flutter - 需要-布局需要-油漆需要-合成-位-更新
问题描述
我尝试在 ListView 中运行包含 Gridview 的代码
body: ListView(
shrinkWrap: true,
children: <Widget>[
Stack(
children: <Widget>[
Container(
alignment: Alignment(0.0, -0.40),
height: 100.0,
color: Colors.white,
child: Text(
'أحصل على تدريب',
style: TextStyle(fontFamily: 'Janna', fontSize: 20.0),
),
),
Container(
margin: EdgeInsets.fromLTRB(25.0, 90.0, 25.0, 0.0),
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(20.0),
boxShadow: [
BoxShadow(
blurRadius: 2.0,
color: Colors.grey,
)
]),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Stack(
children: <Widget>[
Container(
padding: EdgeInsets.fromLTRB(25.0, 25.0, 35.0, 25.0),
child: Text(
'لديك',
style: TextStyle(
fontFamily: 'Janna',
color: Colors.grey,
fontWeight: FontWeight.bold,
fontSize: 16.0),
),
),
Container(
padding: EdgeInsets.fromLTRB(25.0, 50.0, 25.0, 25.0),
child: Text(
'200',
style: TextStyle(
fontFamily: 'Janna',
color: Colors.black,
fontWeight: FontWeight.bold,
fontSize: 30.0),
),
),
],
),
SizedBox(
width: 100,
),
Container(
height: 50,
width: 120,
decoration: BoxDecoration(
color: Colors.greenAccent[100].withOpacity(0.7),
borderRadius: BorderRadius.circular(10.0),
),
child: Center(
child: Text(
'إشتري المزيد',
style: TextStyle(
fontFamily: 'Janna',
color: Colors.green,
fontWeight: FontWeight.bold,
fontSize: 15.0),
),
),
),
],
),
)
],
),
SizedBox(
height: 40.0,
),
Container(
padding: EdgeInsets.only(left: 25.0, right: 25.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(
'المدربين',
style: TextStyle(
fontFamily: 'Janna',
color: Colors.grey,
fontWeight: FontWeight.bold,
fontSize: 14.0),
),
Text(
'أظهر الجلسات السابقة',
style: TextStyle(
fontFamily: 'Janna',
color: Colors.green,
fontWeight: FontWeight.bold,
fontSize: 14.0),
),
],
),
),
SizedBox(
height: 20.0,
),
GridView.count(
shrinkWrap: true,
physics: ClampingScrollPhysics(),
crossAxisCount: 2, // Number of Cards in each Row
primary: false,
crossAxisSpacing: 4.0, // Space between Cards
mainAxisSpacing: 4.0, // Space between Rows
children: <Widget>[
_buildCard('فدوى', 'متوفر', 1,
'https://i.pinimg.com/originals/64/ce/92/64ce9246abec3f86b7d5a8d2a562a03c.jpg'),
_buildCard('فدوى', 'متوفر', 2,
'https://i.pinimg.com/originals/64/ce/92/64ce9246abec3f86b7d5a8d2a562a03c.jpg'),
_buildCard('فدوى', 'متوفر', 3,
'https://i.pinimg.com/originals/64/ce/92/64ce9246abec3f86b7d5a8d2a562a03c.jpg'),
_buildCard('فدوى', 'متوفر', 4,
'https://i.pinimg.com/originals/64/ce/92/64ce9246abec3f86b7d5a8d2a562a03c.jpg'),
_buildCard('فدوى', 'متوفر', 5,
'https://i.pinimg.com/originals/64/ce/92/64ce9246abec3f86b7d5a8d2a562a03c.jpg'),
_buildCard('فدوى', 'متوفر', 6,
'https://i.pinimg.com/originals/64/ce/92/64ce9246abec3f86b7d5a8d2a562a03c.jpg'),
],
)
],
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
Widget _buildCard(String name, String status, int cardIndex, String img) {
return Card(
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10.0)),
elevation: 7.0,
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
SizedBox(
height: 12.0,
),
Container(
child: Column(
children: <Widget>[
Stack(
children: <Widget>[
CircleAvatar(
radius: 35.0,
backgroundImage: NetworkImage(img),
),
Container(
// padding: EdgeInsets.fromLTRB(0, 0, 0, 0),
child: CircleAvatar(
radius: 10.0,
backgroundColor: Colors.white,
child: CircleAvatar(
radius: 6.0,
backgroundColor:
status == 'بعيد' ? Colors.grey : Colors.green,
),
),
),
],
),
SizedBox(
height: 8.0,
),
Text(
status,
style: TextStyle(
fontFamily: 'Janna',
fontSize: 14.0,
fontWeight: FontWeight.bold,
color: Colors.grey),
),
],
),
),
Container(
padding: EdgeInsets.all(7.0),
width: double.infinity,
decoration: BoxDecoration(
color: status == 'بعيد' ? Colors.grey : Colors.green,
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(10.0),
bottomRight: Radius.circular(10.0),
),
),
child: Center(
child: Text(
'طلب',
style: TextStyle(
fontSize: 20.0,
fontFamily: 'Janna',
fontWeight: FontWeight.bold,
color: Colors.white,
),
),
),
)
],
),
margin: cardIndex.isEven
? EdgeInsets.fromLTRB(25.0, 0.0, 5.0, 10.0)
: EdgeInsets.fromLTRB(10.0, 0.0, 25.0, 10.0),
);
}
}
每次我得到这个错误，无论我改变了什么。
I /颤振（9523）：══╡渲染库╞═════════════════════════════════════════════ ═══════════════════════ I/flutter（9523）：在 performResize() 期间抛出以下断言：I/flutter（9523）：垂直视口是给定无限的高度。I/flutter (9523)：视口在滚动方向上扩展以填充其容器。在这种情况下，垂直 I/flutter (9523): viewport 被赋予了无限量的垂直空间来扩展。这种情况 I/flutter (9523)：通常发生在可滚动小部件嵌套在另一个可滚动小部件中时。I/flutter (9523)：如果这个小部件总是嵌套在一个可滚动的小部件中，则不需要使用视口，因为 I/flutter (9523)：总是有足够的垂直空间供孩子使用。在这种情况下，考虑使用 Column I/flutter ( 9523): 代替。否则，请考虑使用“shrinkWrap”属性（或......
解决方案
我还尝试了您的最小复制，它似乎工作正常。如评论中所述，您可以尝试运行flutter cleanthen flutter run。该问题可能是由未包含在构建中的代码更改引起的。
"Vertical viewport was given unbounded height"如果未定义父小部件高度，通常会导致错误。这会导致 ListView 的高度是无限的，ListView 需要定义它的高度。