我試圖在 listView.builder 中僅顯示 1 個卡片小部件，該卡片已顯示，但顯示了我無法找到洗掉方法的額外空間。
實際上有 2 個獨立的 listView，一個應該包含一張卡片，另一個包含卡片串列。
這是我的代碼：
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(
'Fiche du patient',
style: TextStyle(color: Colors.black),
)),
body: Column(
children: <Widget>[
Expanded(
child: ListView.builder(
itemCount: 1,
itemBuilder: (BuildContext context, int index) {
return Card(
color: Colors.white,
elevation: 2.0,
margin: EdgeInsets.all(10),
child: ListTile(
contentPadding: EdgeInsets.only(right: 30, left: 36),
title: Text('${widget.patient['nomComplet']}'),
subtitle: Text('Médecin: ${widget.patient['medecin']}'),
trailing: Text('CH: 107'),
leading: Icon(Icons.person),
),
);
}),
),
Expanded(
child: ListView.builder(
itemCount: docsMesures.length,
itemBuilder: (BuildContext context, int index) {
return Card(
margin: EdgeInsets.all(10),
child: ListTile(
trailing: IconButton(
icon: Icon(Icons.edit),
onPressed: () {
Fluttertoast.showToast(
msg: 'Traitement de la demande');
},
),
contentPadding: EdgeInsets.only(right: 30, left: 36),
title: Text(
'Demandée par: ${docsMesures[index]['affectePar']}'),
subtitle: Text(
'Date limite: ${DateFormat('dd-MM-yyyy hh:mm a').format(docsMesures[index]['datePrise'].toDate())}'),
));
},
),
)
],
),
);
}
}
這是顯示的結果：
提前致謝！
uj5u.com熱心網友回復：
那是因為您Expanded在一列中使用了兩個 ListView，這將導致它們中的每一個都有一半的高度。
Expanded從第一個中洗掉ListView并添加 shrinkWrap:true它可以解決問題。
所以這個代碼例如：
Column(
children: <Widget>[
ListView.builder(
itemCount: 1,
shrinkWrap: true,
itemBuilder: (BuildContext context, int index) {
return Card(
color: Colors.white,
elevation: 2.0,
margin: EdgeInsets.all(10),
child: ListTile(
contentPadding: EdgeInsets.only(right: 30, left: 36),
title: Text('asdf'),
subtitle: Text('Médecin: '),
trailing: Text('CH: 107'),
leading: Icon(Icons.person),
),
);
}),
Expanded(
child: ListView.builder(
itemCount: 11,
itemBuilder: (BuildContext context, int index) {
return Card(
margin: EdgeInsets.all(10),
child: ListTile(
trailing: IconButton(
icon: Icon(Icons.edit),
onPressed: () {
},
),
contentPadding: EdgeInsets.only(right: 30, left: 36),
title: Text(
'Demandée par:'),
));
},
),
)
],
);
會給你這樣的東西：
uj5u.com熱心網友回復：
嘗試設定
Listview.builder(
shrinkWrap: true,
...
uj5u.com熱心網友回復：
試試這個它會作業。
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(
'Fiche du patient',
style: TextStyle(color: Colors.black),
)),
body: Column(
children: <Widget>[
Expanded(
child: ListView.builder(
itemCount: docsMesures.length 1,
itemBuilder: (BuildContext context, int index) {
if(index ==0) {
return Card(
color: Colors.white,
elevation: 2.0,
margin: EdgeInsets.all(10),
child: ListTile(
contentPadding: EdgeInsets.only(right: 30, left: 36),
title: Text('${widget.patient['nomComplet']}'),
subtitle: Text('Médecin: ${widget.patient['medecin']}'),
trailing: Text('CH: 107'),
leading: Icon(Icons.person),
),
);
}
else {
return Card(
margin: EdgeInsets.all(10),
child: ListTile(
trailing: IconButton(
icon: Icon(Icons.edit),
onPressed: () {
Fluttertoast.showToast(
msg: 'Traitement de la demande');
},
),
contentPadding: EdgeInsets.only(right: 30, left: 36),
title: Text(
'Demandée par: ${docsMesures[index-1]['affectePar']}'),
subtitle: Text(
'Date limite: ${DateFormat('dd-MM-yyyy hh:mm a').format(docsMesures[index-1]['datePrise'].toDate())}'),
));
}
},
),
)
],
),
);
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/439866.html