Berkibar di bawah kap

Widget

Menjelaskan konfigurasi untuk [Elemen].

Widget adalah hierarki kelas pusat dalam kerangka Flutter. Widget adalah deskripsi abadi dari bagian antarmuka pengguna. Widget dapat digembungkan menjadi elemen, yang mengelola pohon render yang mendasarinya.

• widget - deskripsi abadi dari bagian antarmuka pengguna;
• widget dikaitkan dengan beberapa tampilan lanjutan yang disebut elemen;
• sebuah elemen mengendalikan beberapa entitas pohon render.

Widget itu sendiri tidak memiliki status bisa berubah (semua bidangnya harus final).
Jika Anda ingin mengaitkan status yang dapat diubah dengan widget, pertimbangkan untuk menggunakan [StatefulWidget], yang membuat objek [Status] (melalui [StatefulWidget.createState]) setiap kali itu digembungkan ke dalam elemen dan dimasukkan ke dalam pohon.

Widget yang diberikan dapat dimasukkan dalam pohon nol atau lebih banyak kali. Khususnya widget yang diberikan dapat ditempatkan di pohon beberapa kali. Setiap kali widget ditempatkan di pohon, itu digembungkan ke dalam [Elemen], yang berarti widget yang dimasukkan ke pohon beberapa kali akan meningkat beberapa kali.

• widget - kelas pusat hirarki;
• widget adalah beberapa konfigurasi;
• widget - deskripsi abadi dari bagian antarmuka pengguna;
• widget dikaitkan dengan elemen yang mengontrol rendering dalam beberapa cara;
• status perubahan widget dapat dijelaskan oleh beberapa entitas, tetapi terhubung tidak dengan widget, tetapi dengan elemen yang mewakili widget ini.

Elemen

Instansiasi dari [Widget] di lokasi tertentu di pohon.

Widget menjelaskan cara mengonfigurasi subtree tetapi widget yang sama dapat digunakan untuk mengonfigurasi beberapa subtree secara bersamaan karena widget tidak dapat diubah. [Elemen] mewakili penggunaan widget untuk mengonfigurasi lokasi tertentu di pohon. Seiring waktu, widget yang dikaitkan dengan elemen yang diberikan dapat berubah, misalnya, jika widget induk dibangun kembali dan membuat widget baru untuk lokasi ini.

• Widget.createElement , .
• mount . .
• .
• , (, ), . runtimeType key, . , , .
• , , , , ( deactivate).
• , . , , (unmount), .
• Ketika Anda memasukkan kembali elemen dalam pohon, misalnya, jika elemen atau leluhurnya memiliki kunci global, itu akan dihapus dari daftar elemen tidak aktif, metode aktivasi akan dipanggil, dan objek yang diberikan terkait dengan elemen ini akan kembali tertanam dalam pohon render. Ini berarti bahwa item tersebut akan muncul di layar lagi.

Renderderbject

Flutter World Picture

• , .
• , .
• , — , .

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,
    …
);

Kesimpulan

Sumber daya