[英]A RenderFlex overflowed by 21 pixels on the bottom
我是 flutter 的新手,我嘗試使用網格視圖,但它顯示了一個渲染彎曲,底部溢出了 21 個像素。 在 GridView 我使用圖片,但它顯示錯誤。 誰知道怎么修它? 謝謝
我在互聯網上搜索,它使用 SingleChildScrollView,但我不想使用它,因為網格視圖看起來很奇怪
這是我的代碼
import 'package:flutter/material.dart';
import 'package:monger_app/page/detail.dart';
class BudgetSettings extends StatefulWidget {
@override
_BudgetSettingsState createState() => _BudgetSettingsState();
}
class _BudgetSettingsState extends State<BudgetSettings> {
List<Container> categorylist = new List();
var character=[
{"name":"Food", "image":"food.png"},
{"name":"Social-Life", "image":"travel.png"},
{"name":"Transportation", "image":"transportation.png"},
{"name":"Beauty", "image":"makeup.png"},
{"name":"Household", "image":"household.png"},
{"name":"Education", "image":"education.png"},
{"name":"Health", "image":"health.png"},
{"name":"Gift", "image":"gift.png"},
{"name":"Other", "image":"other.png"},
];
_makelist() async {
for (var i = 0; i < character.length; i++) {
final newcharacter = character[i];
final String image = newcharacter["image"];
categorylist.add(
new Container(
padding: new EdgeInsets.all(20.0),
child: new Card( child:
new Column(
children: <Widget>[
new Image.asset('assets/$image', fit: BoxFit.cover,),
new Padding(padding: new EdgeInsets.all(5.0),),
new Text(newcharacter['name'], style: new TextStyle(fontSize: 18.0),),
],
),
),
)
);
}
}
@override
void initState() {
_makelist();
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Budget Setting'),
),
body: new GridView.count(
crossAxisCount: 2,
children: categorylist,
),
);
}
}
您的問題的一個簡單解決方案是將您的圖像小部件包裝在一個靈活的小部件中,就像這樣:
Flexible(
child: Image.asset('assets/$image', fit: BoxFit.cover,),
),
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.