J'utilise ListTile
pour créer chaque élément de la liste. Chaque élément est créé dynamiquement à partir du tableau de données. ListTile
fournit onTap
, mais c'est insuffisant pour moi car je dois savoir quel élément est cliqué en obtenant la clé ou l'index.
ListTile:
new ListTile(
//leading: const Icon(Icons.flight_land),
title: const Text('Trix\'s airplane'),
subtitle: const Text('The airplane is only in Act II.'),
enabled: true,
onTap: () { //TODO: get the identifier for this item },
trailing: new Container(
child: new Row(
children: [
new Text("70%"),
const Icon(Icons.flight_land)
]
)
),
)
Vous voudriez construire votre liste de ListTile
s dans un ListView
et utiliser le constructeur List.generate
pour obtenir l'index de children
en voici un exemple simple:
import "package:flutter/material.Dart";
class ListTest extends StatefulWidget {
@override
_ListTestState createState() => new _ListTestState();
}
class _ListTestState extends State<ListTest> {
final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();
int _id;
@override
Widget build(BuildContext context) {
return new Scaffold(
key: _scaffoldKey,
appBar: new AppBar(title: new Text("List"),),
body: new ListView(
children: new List.generate(10, (int index){
return new ListTile(title: new Text("item#$index"),
onTap:(){
setState((){
_id = index; //if you want to assign the index somewhere to check
});
_scaffoldKey.currentState.showSnackBar(new SnackBar(content: new Text("You clicked item number $_id")));
},
);
})
),
);
}
}
Gardez à l’esprit que List.generate
fonctionne bien avec de petites listes. Si vous lisez une liste extensible (par exemple, une liste d’utilisateurs), vous devez utiliser ListView.builder
au lieu de ListView
, il possède un argument builder
qui vous permet de parcourir votre liste index aussi.
new ListView.builder(itemBuilder: (BuildContext context, int index) {
//return your list
},
Vous pouvez créer des instances ListTile avec des fermetures qui capturent les informations sur les éléments. Dans cet exemple, la fonction _tappedFolder est appelée avec le libellé de chaque texte du ListTile.
List<ListTile> _buildFolderTiles() {
var list = List<ListTile>();
for (var each in ['A:','B:','C:','D:']) {
list.add(ListTile(
title: Text(each),
onTap: (){ _tappedFolder(each); }
));
}
return list;
}
void _tappedFolder(String which) {
print("tapped ${which}");
}