Flutter comment afficher les données du tableau dans le widget texte par boucle for
J'ai une liste simple dans laquelle une chaîne est disponible. J'ai juste besoin d'afficher toutes les chaînes dans le widget Texte par boucle for
J'essaye comme ça
List datesData = [{
'09:00 am - 10:00 am',
'10:00 am - 11:00 am',
'11:00 am - 12:00 am',
'12:00 am - 01:00 am',
'01:00 am - 02:00 am',
'02:00 am - 03:00 am',
'03:00 am - 04:00 am',
'04:00 am - 05:00 am'
}];
for(int i = 0; i < 8; i++){
Container(
child: Text(datesData(i)),
);
}
Les TI affichent une erreur dans les dates The expression doesn't evaluate to a function, so it can't be invoked.
De plus, je ne veux pas définir la longueur de for lopp comme for(int i = 0; i < 8; i++)
je dois le vérifier automatiquement qu'il a 8 chaînes.
Réponses
Vous devez obtenir les données indexées du tableau de dates. Il y a une utilisation incorrecte des parenthèses. Vous devez utiliser des crochets pour obtenir un index du tableau. Ça devrait ressembler à ça:
for(int i = 0; i < 8; i++){
Container(
child: Text(datesDate[i]),
);
}
ÉDITER:
Ok, vous pouvez utiliser cette liste de widgets dans une colonne. Maintenant, cela ressemblera à ceci:
List datesData = [
'09:00 am - 10:00 am',
'10:00 am - 11:00 am',
'11:00 am - 12:00 am',
'12:00 am - 01:00 am',
'01:00 am - 02:00 am',
'02:00 am - 03:00 am',
'03:00 am - 04:00 am',
'04:00 am - 05:00 am'
];
List<Widget> textWidgetList = List<Widget>(); // Here we defined a list of widget!
@override
Widget build(BuildContext context) {
for (int i = 0; i < 8; i++) {
textWidgetList.add(
Container(
child: Text(datesData[i]),
),
);
}
return Scaffold(
body: Container(
child: Column(
children: textWidgetList,
),
),
);
}
Vous pouvez utiliser toList
ce qui rend plus facile et également utiliser indexOf
si vous avez besoin d'index
import 'package:flutter/material.dart';
class DateDataWidget extends StatelessWidget {
final List datesData = [
'09:00 am - 10:00 am',
'10:00 am - 11:00 am',
'11:00 am - 12:00 am',
'12:00 am - 01:00 am',
'01:00 am - 02:00 am',
'02:00 am - 03:00 am',
'03:00 am - 04:00 am',
'04:00 am - 05:00 am'
];
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
child: Column(
children: datesData.map((date) {
int index = datesData.indexOf(date); // use index if you want.
print(index);
return Text(date);
}).toList(),
)),
);
}
}
Vous pouvez utiliser int index
si vous en avez besoin.
make it more dynamic
for(int i = 0; i < datesData.length; i++){
Container(
child: Text(datesDate[i]),
);
}
Mise à jour que vous pouvez afficher avec listview.builder
class MyWidget extends StatelessWidget {
final List data = [
'09:00 am - 10:00 am',
'10:00 am - 11:00 am',
'11:00 am - 12:00 am',
'12:00 am - 01:00 am',
'01:00 am - 02:00 am',
'02:00 am - 03:00 am',
'03:00 am - 04:00 am',
'04:00 am - 05:00 am'
];
@override
Widget build(BuildContext context) {
return Scaffold(
body: ListView.builder(
itemCount: data.length,
itemBuilder: (BuildContext ctxt, int index) {
return new Text(data[index]);
}),
);
}
}
essayez ce code sur dartpad.dev
import 'package:flutter/material.dart';
void main() {
runApp(App());
}
class App extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: MyWidget(),
),
),
);
}
}
class MyWidget extends StatelessWidget {
final List data = [
'09:00 am - 10:00 am',
'10:00 am - 11:00 am',
'11:00 am - 12:00 am',
'12:00 am - 01:00 am',
'01:00 am - 02:00 am',
'02:00 am - 03:00 am',
'03:00 am - 04:00 am',
'04:00 am - 05:00 am'
];
@override
Widget build(BuildContext context) {
return ListView(
children: data.map((element) => ListTile(title: Text(element))).toList(),
);
}
}