我正在嘗試構建一個應用程式來檢索所有表資料并將其顯示在螢屏上。我使用串列構建器小部件制作它。我想為檢索到的每一行添加一個標題。我嘗試添加一個行小部件包含標題。但它沒有顯示。這是 out List 的樣子
我想通過制作一行來添加 dname 和 age Header ..但它不可見
這是我的代碼的樣子
// build list view & its tile
ListView _buildPosts(BuildContext context, List<Post> posts) {
print('Hi');
Row(//This row is not getting displayed
children: [
Container(
child: const Text('Did',
style: TextStyle(
color: Colors.white,
),
),
),
Container(
child: const Text('Dname',style: TextStyle(
color: Colors.white,
),),
),
Container(
child: const Text('Age',style: TextStyle(
color: Colors.white,
),),
),
],
);
return ListView.builder(
itemCount: posts.length,
padding: const EdgeInsets.all(20),
itemBuilder: (context, index) {
return Card(
shadowColor: Colors.white,
color:const Color(0xFF303030),
elevation: 1,
child: IntrinsicHeight(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Text(posts[index].Did,style: const TextStyle(fontWeight: FontWeight.bold,
color:Colors.white,),),
Text(posts[index].Dname,style: const TextStyle(fontWeight: FontWeight.bold,
color:Colors.white,),),
Text(posts[index].Age,style: const TextStyle(fontWeight: FontWeight.bold,color:Colors.white,),
),
],
),
),
);
},
);
}
}
class HttpService {
Future<List<Post>> getPosts() async {
Response res = await get(
Uri.parse('http://localhost/localconnect/driver_change.php'));
print(res.body);
if (res.statusCode == 200) {
List<dynamic> body = jsonDecode(res.body);
List<Post> posts = body.map(
(dynamic item) => Post.fromJson(item),
).toList();
return posts;
} else {
throw "Unable to retrieve posts.";
}
}
}
uj5u.com熱心網友回復：
問題是該行沒有在任何地方使用。因此，您可以簡單地回傳一個 listView.builder，而不是使用這個所謂的 _buildPosts。檢查下面的代碼：
我在下面添加了兩組解決方案：
ListView.builder(
itemCount: posts.length,
itemBuilder: (context, index) {
return Card(
shadowColor: Colors.white,
color: const Color(0xFF303030),
elevation: 1,
child: IntrinsicHeight(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Column(
children: [
Container(
child: const Text(
'Did',
style: TextStyle(
color: Colors.white,
),
),
),
Text(
posts[index].Did,
style: const TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
],
),
Column(
children: [
Container(
child: const Text(
'Dname',
style: TextStyle(
color: Colors.white,
),
),
),
Text(
posts[index].Dname,
style: const TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
],
),
Column(
children: [
Container(
child: const Text(
'Age',
style: TextStyle(
color: Colors.white,
),
),
),
Text(
posts[index].Age,
style: const TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
],
),
],
),
),
);
},
),
這是最簡單的方法，但根據您的回答，還有另一種復雜的方法：
ListView.builder(
itemCount: posts.length * 2,
itemBuilder: (context, index) {
if (index.isOdd) {
return Card(
shadowColor: Colors.white,
color: const Color(0xFF303030),
elevation: 1,
child: IntrinsicHeight(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Text(
posts[index*2].Did,
style: const TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
Text(
posts[index*2].Dname,
style: const TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
Text(
posts[index*2].Age,
style: const TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
],
),
),
);
} else {
return Row(
//This row is not getting displayed
children: [
Container(
child: const Text(
'Did',
style: TextStyle(
color: Colors.white,
),
),
),
Container(
child: const Text(
'Dname',
style: TextStyle(
color: Colors.white,
),
),
),
Container(
child: const Text(
'Age',
style: TextStyle(
color: Colors.white,
),
),
),
],
);
}
},
),
uj5u.com熱心網友回復：
它無法顯示，因為它沒有在任何地方使用！您的 _buildPosts() 僅回傳 Listview.builder()。將您的 List view.builder() 包裹在一個 Column 中，然后將您的 Row() 移到 Listview.builder() 上方的 Column() 中。
uj5u.com熱心網友回復：
最適合您的案例的最佳解決方案是使用。DataTable它使表格資料可視化變得如此簡單，并且非常易于使用
@override
Widget build(BuildContext context) {
return DataTable(
columns: const <DataColumn>[
DataColumn(
label: Text(
'Did',
style: TextStyle(fontStyle: FontStyle.italic),
),
),
DataColumn(
label: Text(
'Dname',
style: TextStyle(fontStyle: FontStyle.italic),
),
),
DataColumn(
label: Text(
'Age',
style: TextStyle(fontStyle: FontStyle.italic),
),
),
],
rows: const <DataRow>[
DataRow(
cells: <DataCell>[
DataCell(Text('1')),
DataCell(Text('Raj')),
DataCell(Text('34')),
],
),
DataRow(
cells: <DataCell>[
DataCell(Text('Janine')),
DataCell(Text('43')),
DataCell(Text('Professor')),
],
),
DataRow(
cells: <DataCell>[
DataCell(Text('William')),
DataCell(Text('27')),
DataCell(Text('Associate Professor')),
],
),
],
);
}
row你可以像這樣渲染一個串列
rows: _list.map((cita) => DataRow(
cells: [
DataCell(Text(_list.telefono ?? '',style: const
TextStyle(
fontSize: 18,color: Colors.black
))),
DataCell(Text(_list.nombre ?? '',style: const
TextStyle(
fontSize: 18,color: Colors.black
))),
DataCell(Text(_list.nombre ?? '',style: const
TextStyle(
fontSize: 18,color: Colors.black
))),
]
)
我知道我的答案與您提出的問題相去甚遠，但這是在顫動中處理資料表的最佳方法
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/411987.html
標籤：
上一篇：Firebase資料未顯示在Recycler視圖中。如何在recyclerview中顯示來自firebase的用戶特定資料？
下一篇：具有輔助注入和刀柄的共享視圖模型