हुड के नीचे फड़फड़ाहट

विजेट

एक [तत्व] के लिए विन्यास का वर्णन करता है।

फ़्लटर ढांचे में विजेट केंद्रीय वर्ग पदानुक्रम हैं। एक विजेट एक यूजर इंटरफेस के हिस्से का एक अपरिवर्तनीय विवरण है। विजेट तत्वों में फुलाए जा सकते हैं, जो अंतर्निहित रेंडर ट्री का प्रबंधन करते हैं।

• विजेट - उपयोगकर्ता इंटरफ़ेस के एक हिस्से का अपरिवर्तनीय विवरण;
• विजेट कुछ उन्नत दृश्य के साथ जुड़ा हुआ है जिसे एक तत्व कहा जाता है;
• एक तत्व रेंडर ट्री की कुछ इकाई को नियंत्रित करता है।

विजेट के पास स्वयं कोई परिवर्तनशील स्थिति नहीं है (उनके सभी फ़ील्ड अंतिम होने चाहिए)।
यदि आप एक उत्परिवर्ती राज्य को एक विजेट के साथ जोड़ना चाहते हैं, तो एक [स्टेटफुलवेटगेट] का उपयोग करने पर विचार करें, जो एक [राज्य] ऑब्जेक्ट ([स्टेटफुलविडगेट.क्रिएटेस्टेट के माध्यम से]) बनाता है जब भी यह एक तत्व में फुलाया जाता है और पेड़ में शामिल होता है।

एक दिए गए विजेट को पेड़ में शून्य या अधिक बार शामिल किया जा सकता है। विशेष रूप से दिए गए विजेट को कई बार पेड़ में रखा जा सकता है। हर बार एक विजेट को पेड़ में रखा जाता है, इसे एक [तत्व] में फुलाया जाता है, जिसका अर्थ है कि एक विजेट जिसे कई बार पेड़ में शामिल किया गया है उसे कई बार फुलाया जाएगा।

• विजेट - पदानुक्रम का केंद्रीय वर्ग;
• विजेट कुछ विन्यास है;
• विजेट - उपयोगकर्ता इंटरफ़ेस के एक हिस्से का अपरिवर्तनीय विवरण;
• विजेट एक ऐसे तत्व से जुड़ा है जो किसी तरह से प्रतिपादन को नियंत्रित करता है;
• विजेट की बदलती स्थिति का वर्णन कुछ इकाई द्वारा किया जा सकता है, लेकिन यह विजेट के साथ नहीं, बल्कि उस तत्व से जुड़ा है जो इस विजेट का प्रतिनिधित्व करता है।

तत्त्व

पेड़ में एक विशेष स्थान पर एक [विजेट] की तात्कालिकता।

विजेट वर्णन करते हैं कि कैसे एक सबट्री को कॉन्फ़िगर किया जाए लेकिन एक ही विजेट का उपयोग एक साथ कई सबट्रीज़ को कॉन्फ़िगर करने के लिए किया जा सकता है क्योंकि विजेट अपरिवर्तनीय हैं। एक [तत्व] पेड़ में एक विशिष्ट स्थान को कॉन्फ़िगर करने के लिए एक विजेट के उपयोग का प्रतिनिधित्व करता है। समय के साथ, किसी दिए गए तत्व से जुड़ा विजेट बदल सकता है, उदाहरण के लिए, यदि मूल विजेट पुन: बनाता है और इस स्थान के लिए एक नया विजेट बनाता है।

• Widget.createElement , .
• mount . .
• .
• , (, ), . runtimeType key, . , , .
• , , , , ( deactivate).
• , . , , (unmount), .
• जब आप पेड़ में तत्वों को फिर से शामिल करते हैं, उदाहरण के लिए, यदि तत्व या इसके पूर्वजों के पास एक वैश्विक कुंजी है, तो इसे निष्क्रिय तत्वों की सूची से हटा दिया जाएगा, सक्रिय विधि को बुलाया जाएगा, और इस तत्व से जुड़ी प्रदान की गई वस्तु को फिर से रेंडर ट्री में एम्बेड किया जाएगा। इसका मतलब है कि आइटम को स्क्रीन पर फिर से दिखाई देना चाहिए।

Renderderbject

स्पंदन विश्व चित्र

• , .
• , .
• , — , .

void mount(Element parent, dynamic newSlot) {
    assert(_debugLifecycleState == _ElementLifecycle.initial);
    assert(widget != null);
    assert(_parent == null);
    assert(parent == null || parent._debugLifecycleState == _ElementLifecycle.active);
    assert(slot == null);
    assert(depth == null);
    assert(!_active);
    _parent = parent;
    _slot = newSlot;
    _depth = _parent != null ? _parent.depth + 1 : 1;
    _active = true;
    if (parent != null)
        _owner = parent.owner;
    if (widget.key is GlobalKey) {
        final GlobalKey key = widget.key;
        key._register(this);
    }
    _updateInheritance();
    assert(() {
        _debugLifecycleState = _ElementLifecycle.active;
        return true;
    }());
}

RenderObject get renderObject {
    RenderObject result;
    void visit(Element element) {
        assert(result == null); 
        if (element is RenderObjectElement)
            result = element.renderObject;
        else
            element.visitChildren(visit);
    }
    visit(this);
    return result;
}

body: Center(
    child: Text(“Hello world!”)
),

static bool canUpdate(Widget oldWidget, Widget newWidget) {
    return oldWidget.runtimeType == newWidget.runtimeType && oldWidget.key == newWidget.key;
}

@override
Widget build(BuildContext context) {
    return Scaffold(
        body: Center(
            child: _isFirst ? first() : second(),
        ),
        floatingActionButton: FloatingActionButton(
            child: Text("Switch"),
            onPressed: () {
                setState(() {
                    _isFirst = !_isFirst;
                });
            },
        ),
    );
}

Widget first() => Row(
    mainAxisAlignment: MainAxisAlignment.center,
    children: <Widget>[
        Text(
            "test",
            style: TextStyle(fontSize: 25),
        ),
        SizedBox(
            width: 5,
        ),
        Icon(
            Icons.error,
        ),
    ],
);

Widget second() => Row(
    mainAxisAlignment: MainAxisAlignment.center,
    children: <Widget>[
        Text(
            "one more test",
            style: TextStyle(fontSize: 25),
        ),
        Padding(
            padding: EdgeInsets.only(left: 5),
        ),
        Icon(
            Icons.error,
        ),
    ],
);

Widget second() => Container(child: first(),);

var _key = GlobalKey(debugLabel: "testLabel");

Widget first() => Row(
    key: _key,
    …
);

निष्कर्ष

साधन