![](/img/trans.png)
[英]how to make Card() leading,title,trailing fixed position in flutter
[英]How to make card width fixed in Flutter?
在我的 Flutter 項目中,我想在卡片中顯示數據列表的每一項。 為此,我在Card中設置了所有組件(例如圖像、文本)。
它看起來像下圖 -
現在,問題是——
我想將卡片寬度固定為固定大小或包裝內容。 由於 Card 小部件沒有height 和 width屬性,那么我應該如何修復這張卡片的寬度。
這是我的代碼-
Card showCard(int position, int index, AsyncSnapshot<List<ModelFrontList>> snapshot) {
return new Card(
elevation: 10.0,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
height: 250,
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Image.network(
snapshot.data[position].products[index].image,
height: 150,
width: 50,
),
SizedBox(
width: 20.0,
),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text( snapshot.data[position].products[index].nameEnglish),
SizedBox(
height: 10.0,
),
Text( snapshot.data[position].products[index].nameEnglish),
],
),
),
],
),
),
),
);
}
此showCard function 在Container中調用。 所以,我需要一個解決方案來修復這張卡的寬度。
解決方案是將卡片包裝在一個大小合適的盒子中。 例如,
Card showCard(int position, int index, AsyncSnapshot<List<ModelFrontList>> snapshot) {
SizedBox(
width: 200.0,
height: 300.0,
child: const Card(
elevation: 10.0,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
height: 250,
child: Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Image.network(
snapshot.data[position].products[index].image,
height: 150,
width: 50,
),
SizedBox(
width: 20.0,
),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text( snapshot.data[position].products[index].nameEnglish),
SizedBox(
height: 10.0,
),
Text( snapshot.data[position].products[index].nameEnglish),
],
),
),
],
),
),
),
);
}
)
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.