Je veux afficher les données dans une vue de liste extensible en flutter ...
Par exemple, j'ai besoin de la liste ci-dessous comme en-tête de la liste de réception ...
S'il vous plaît laissez-moi savoir si vous avez besoin si vous avez besoin toute information supplémentaire de ma fin.
3 Réponses :
Vous pouvez obtenir en utilisant un widget de l'expantiontile.
Le code suivant peut vous aider. P>
class DeleteWidget extends StatefulWidget {
const DeleteWidget({Key key}) : super(key: key);
@override
_DeleteWidgetState createState() => _DeleteWidgetState();
}
class _DeleteWidgetState extends State<DeleteWidget> {
List<String> _days = ['sunday', 'Monday', 'Tuesday'];
List<Cars> dummyData = [
Cars(
model: 'Fiat',
speed: '100',
day: 'Monday',
),
Cars(
model: 'Maruti',
speed: '120',
day: 'Monday',
),
Cars(
model: 'Hyundai',
speed: '130',
day: 'Tuesday',
),
Cars(
model: 'Toyota',
speed: '140',
day: 'Wednesday',
),
];
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
child: ListView.builder(
itemCount: _days.length,
itemBuilder: (_, index) {
return ExpansionTile(
title: Text(_days[index].toString()),
children: [
...dummyData.map((e) {
if (e.day == _days[index]) {
return Text(e.speed.toString());
}
return Container();
}).toList(),
]);
},
),
),
);
}
}
class Cars {
String model;
String speed;
String day;
Cars({this.model, this.day, this.speed});
}
Salut viren merci beaucoup pour votre aide ... j'ai essayé le code et ça marche parfaitement
Vraiment heureux d'entendre que cela vous aide. Codage heureux.
Merci beaucoup de Viren
réorganiser d'abord des données telles que celles suivantes:
Widget expandableList() {
return ListView.builder(
itemCount: organizedData.length,
itemBuilder: (context, index) {
String day = organizedData.keys.elementAt(index);
return Card(
child: ExpandablePanel(
header: day,
collapsed: Text('some text', softWrap: true, maxLines: 2, overflow: TextOverflow.ellipsis,),
expanded: Card(
child: Row(
children: carsUI(organizedData[day]),
),
tapHeaderToExpand: true,
hasIcon: true,
),
);
},
);
}
List<Widget> carsUI(List<Car> cars){
final ui = cars.map((car){
return Text(car.speed + ", " + car.model);
}).toList();
return ui;
}
Vous pouvez utiliser widget ListView.Builder () pour rendu la liste dynamique et cette méthode est une méthode efficace.
ListView.builder(
itemCount: dummyData.length,
itemBuilder: (BuildContext context, int index) {
return ListTile(
title: Column(
children: <Widget>[
Text(dummyData[index].model),
Text(dummyData[index].day),
]
),
trailing: Text(dummyData[index].speed)
)
}
)
Vous devez combiner plus d'une entrée du même jour, E.g lundi dispose de deux voitures afin que vous voulez mettre ces deux voitures sous une en-tête? Vous devez donc reformater la liste?
Oui, je veux placer les voitures dans leurs en-têtes respectifs (lundi, mardi, mercredi) ... 2 voitures de lundi ... 1 voiture sous mardi et 1 voiture de mercredi et j'ai besoin d'afficher la voiture et leur vitesse dans la liste ... Pouvez-vous m'aider à résoudre ce problème
J'ai posté une réponse suggérée, espérons que cela aide. Vous devez essentiellement réorganiser la liste et la mettre sur une carte par exemple, puis le rendre des voitures dans leurs en-têtes respectifs.