Flutter uchun Yangi boshlanuvchilar

Yaratish odatiy vidjetlar

Flutter yordamida foydalanuvchi interfeyslarini yaratishda biz har doim ba'zi maxsus vidjetlarni yaratishimiz kerak bo'ladi; Biz qilolmaymiz va qil emas istayman uchun qochish dan bu. Keyin hammasi, the tarkibi ning vidjetlar uchun noyob interfeyslarni yaratish - bu Flutterga juda yaxshi imkon beradi.
In the ariza, biz bor yaratilgan biroz ning the tartib allaqachon, va the faqat Biz yaratgan maxsus vidjetlar FavorsPage va RequestFavorPage vidjetlar.
Siz mumkin bor qayd etdi kabi yaxshi bu muddati uchun the yo'l ning bastalash maketlar ichida Flutter, the kod juda katta va uni saqlash qiyin bo'lishi mumkin. Buni hal qilish uchun biz to'liq tartibni yaratish uchun vidjetni yaratishni qismlarga ajratadigan kichik usullarni yaratdik.
Vidjetlarni kichik usullarga bo‘lish kodni kichraytirishga yordam beradi, lekin Flutter uchun unchalik yaxshi emas. Bizning holatda, bizda hali murakkab tartib yo'q, shuning uchun bu yaxshi, lekin murakkab tartib bo'lsa, vidjet daraxti ko'p marta o'zgarishi mumkin, vidjetlarga ega. kabi o'rnatilgan usullari bo'ladi emas Yordam bering the ramka uchun optimallashtirish the ko'rsatish jarayon.
Ramkaga ko'rsatish jarayonini optimallashtirishga yordam berish uchun biz usullarimizni ajratishimiz kerak ichiga kichik, maqsadli vidjetlar. Shunday qilib, the Vidjet daraxt | Element daraxt operatsiyalar optimallashtiriladi. Esda tutingki, vidjet turi ramkaga vidjet qachon o‘zgargani va qayta tiklanishi kerakligini bilishga yordam beradi, bu esa butun renderlash jarayoniga ta’sir qiladi. Shunday qilib, keling, qayta ko'rib chiqaylik bizning Favors sahifamiz vidjet va kichik vidjet usullarini yangi maxsus kichik vidjetlarga aylantiring.
The _favorsList() usuli (qarang the biriktirilgan manba kod) mumkin bo'l refaktorlangan ichiga a
yangi Favors List vidjet. Keyin, the itemBuilder mulk ning the Favors List vidjet FavorCardItemni qaytarish uchun refaktoratsiya qilinishi mumkin karta elementini qaytaradigan vidjet:

sinf FavorCardItem uzaytiradi davlatsiz vidjet { final Yaxshilik iltifot;

const FavorCardItem({Kalit kalit, this.favor}) : super(kalit: kalit);

@override
Vidjet qurish (BuildContext kontekst) { qaytish karta(
kalit: ValueKey(favor.uuid),
chegara: EdgeInsets.symmetric(vertikal: 10.0, gorizontal: 25.0), bola: to'ldirish(
bola: Ustun( bolalar: [
_itemHeader(yoqimlilik), Matn (favor.description),
_itemFooter (yoqimli)
],
),
to'ldirish: EdgeInsets.all(8.0),
),
);
}
Vidjet _itemHeader(Favor yaxshilik) { ... } // uchun qisqalik Vidjet _itemFooter(Favor yaxshilik) { ... }// uchun qisqalik
}

The faqat narsa bu o'zgarishlar hisoblanadi the qo'shish ning a yangi sinf bilan the to'g'ri final dalalar bu vidjetni ko'rsatish uchun muhim; qurilish () usul oldingi _buildFavorsList() bilan deyarli bir xil. usuli.

Eslatma bu the yaxshilik karta element hali ham o'z ichiga oladi the sarlavha va altbilgi qismlar kabi
usullari, _itemHeader() va _itemActions() mos ravishda. Bu yo'l, ular bor renderlash jarayoniga zarar bermaslik uchun etarlicha kichik. Ammo unutmangki, ularni vidjetlarga bo'lish ham zarar keltirmaydi.

Bo'lish vidjetidan foydalanishning ushbu usuli bilan biz ramkani etarli darajada beramiz ma `lumot ning bizning vidjetlar, va ular bo'ladi o'zini tutish kabi o'rnatilgan vidjetlar va bo'l o'rnatilgan vidjetlar kabi optimallashtirish mumkin.