Flutter: ListView

ListView

• ListView slouží pro zobrazení dynamického seznamu položek, který lze skrolovat.
• Lze ho využít například pro zobrazení položek ze seznamu či pro položky, které přidáváme postupně.

Zobrazení seznamu

• Pro zobrazení seznamu seznam můžeme použít ListView:

 Expanded(
   child: ListView.builder(
     itemCount: _seznam.length,
     itemBuilder: (context, index) {
       return ListTile(
           title: Text('${_seznam[index].abc}'),
           subtitle: Text('${_seznam[index].def}'),
       );
     },
   ),
 ),

Vytvoření ListView

ListView(children: [])

• Vhodné pro krátké statické seznamy — nelze přidávat položky.

ListView(

 children: [
   ListTile(title: Text('Položka 1')),
   ListTile(title: Text('Položka 2')),
   ListTile(title: Text('Položka 3')),
 ],

)

ListView.builder()

• Používá se pro delší nebo dynamické seznamy (nejčastější varianta).
• Vytváří položky až když jsou potřeba (lepší výkon)

ListView.builder(

 itemCount: 10,
 itemBuilder: (context, index) {
   return ListTile(
     title: Text('Položka $index'),
   );
 },

)

ListTile: položka seznamu

• Jednu položku dynamického seznamu reprezentuje widget ListTile

Vlastnosti ListTile

• leading – ikona vlevo
• trailing – ikona vpravo
• onTap – reakce na kliknutí

ListTile(

 leading: Icon(Icons.person),
 title: Text('Uživatel'),
 trailing: Icon(Icons.arrow_forward),
 onTap: () {
   print('Klik!');
 },

)

Související stránky

• Flutter: Základní widgety
• Flutter: Kostra aplikace