floatingActionButton : FloatingActionButton( bosilgan: () {},
maslahat: — Soʻrang a marhamat', bola: Belgi (Icons.add),
),
),
);
}
The birinchi vidjet hozir ichida the FavorsPage vidjet pastki daraxt hisoblanadi the DefaultTabController biz uchun yorliq o'zgarishini boshqaradigan vidjet. Shundan so'ng, bizda Iskala bor Materiallar dizaynining asosiy tuzilishini amalga oshiradigan vidjet. Bu erda biz ushbu elementlarning ba'zilaridan, jumladan, ilovalar paneli va suzuvchi harakat tugmasidan foydalanmoqdamiz. Ushbu vidjet Material Designga amal qiladigan ilovalarni loyihalash uchun juda foydali, chunki u koʻrsatmalar asosida foydali xususiyatlarni taqdim etadi:
In AppBar , biz bor qo'shildi a sarlavha bilan the Yordam bering ning a Matn vidjet. In biroz hollarda, biz unga harakatlar yoki shaxsiy tartib qo'shishimiz mumkin. Bu erda biz qo'shdik
Tabbar misol to'g'ri da the pastki ning the ilova bar bu bo'ladi ko'rsatish the mavjud
yorliqlar.
In FloatingActionButton , biz shuningdek bor emas o'zgardi ham ko'p; biz faqat Belgini ishlatib, belgi qo'shdi ramka tomonidan taqdim etilgan Material Design belgisini o'z ichiga olgan vidjet.
Tana _ iskala mulki vidjet - biz maketni o'zi loyihalashtiramiz. Bu hisoblanadi belgilangan kabi quyidagicha: a TabBarView vidjet ko'rsatadi the mos keladigan DefaultTabController -da tanlangan yorliq uchun vidjet misol aniqlangan
avval. Uning bolalar mulk hisoblanadi nima talab qiladi diqqat; bu mos keladi the yorliqlar panelining yorliqlari va har bir yorliqning tegishli vidjetini qaytaradi.
The Tab bar buyumlar bor yaratilgan tomonidan the _buildCategoryChip() usul, kabi quyidagicha:
sinf FavorsPage uzaytiradi davlatsiz vidjet {
// ... dalalar, qurmoq usuli va boshqalar Vidjet _buildCategoryTab(String sarlavha) {
qaytish Tab(
bola: Matn (sarlavha),
);
}
}
Sifatida siz mumkin qarang, the funktsiyasi yaratadi a kategoriya tab element tomonidan oddiygina bino a
Tab > Matn pastki daraxt, qayerda sarlavha hisoblanadi the element identifikatori.
In the xuddi shu tarzda, har bir yaxshilik ro'yxati bo'limi hisoblanadi belgilangan o'z uslubida, _favorsList() :
sinf FavorsPage uzaytiradi davlatsiz vidjet {
// ... dalalar, qurmoq usuli va boshqalar
Vidjet _favorsList(String sarlavha, Ro'yxat yaxshilik) { qaytish Ustun(
mainAxisSize: MainAxisSize.max, bolalar: [
to'ldirish(
bola: Matn (sarlavha),
to'ldirish: EdgeInsets.only(yuqori: 16.0),
),
Kengaytirilgan(
bola: ListView.builder(
fizika: BouncingScrollPhysics(), element soni: ne'matlar.uzunlik,
itemBuilder: (BuildContext kontekst, int indeks) { final yaxshilik = imtiyozlar[indeks];
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),
),
);
},
),
),
],
);
}
}
The yaxshilik Bo'lim vidjet hisoblanadi ifodalangan tomonidan a Ustun vidjet bu ega ikki bola vidjetlar:
A Matn vidjet (bilan a To'ldirish ota-ona) o'z ichiga olgan the Bo'lim sarlavha, kabi ListViewdan oldin har bir yaxshilik elementini o'z ichiga olgan misol
Bu ro'yxati hisoblanadi qurilgan ichida a alohida yo'l dan the Oldingi birlar. Bu yerda, biz bor ishlatilgan
ListView.builder( ) konstruktor deb nomlanadi. Ushbu ro'yxat konstruktori itemCountni kutadi va itemBuilder holatlar, qaysi biz aniqlash foydalanish the ro'yxati o'tdi kabi a dalil ichida _favorsList() ga qo'ng'iroq :
itemCount hisoblanadi oddiygina the hajmi ning the ro'yxati.
itemBuilder kerak bo'l a funktsiyasi bu qaytadi the vidjet mos keladigan uchun ob'ekt ma'lum bir pozitsiyada. Bu funksiya build() kabi BuildContext ni oladi. vidjet usuli, shuningdek, indeks pozitsiyasi (bu erda biz indeksdan foydalandik argumentlar ro'yxatidan mos keladigan yaxshilikni olish uchun).
Bu shakl ning element bino hisoblanadi optimal uchun katta ro'yxatlar, ro'yxatlar bu o'sadi davomida the hayot tsikl, yoki hatto cheksiz aylantiruvchi ro'yxatlar (ba'zi ilovalarda allaqachon ko'rgan bo'lishingiz mumkin), chunki u faqat kerak bo'lganda elementlarni yaratadi va hisoblash resurslarini isrof qilishning oldini oladi.
ItemBuilder _ funktsiya qiymati kartani yaratadi ne'matlar argumentidagi har bir yaxshilik uchun vidjet ro'yxati tomonidan olish the mos keladigan element bilan final yaxshilik = imtiyozlar[indeks]; . Quruvchining qolgan qismi quyidagicha:
qaytish karta(
kalit: ValueKey(favor.uuid),
Do'stlaringiz bilan baham: |