断言失败:第 551 行 pos 12:'child.hasSize':不正确
Posted
技术标签:
【中文标题】断言失败:第 551 行 pos 12:\'child.hasSize\':不正确【英文标题】:Failed assertion: line 551 pos 12: 'child.hasSize': is not true断言失败:第 551 行 pos 12:'child.hasSize':不正确 【发布时间】:2020-12-29 16:22:04 【问题描述】:我是 Flutter 的新手,我正在开发一个电子商务网站,我想在我的欢迎页面中添加一个显示最近产品的 Grid,我正在尝试使用 GridVeiw.builder,但出现错误
断言失败:第 551 行 pos 12: 'child.hasSize': is not true.
我不明白为什么我会看到这个错误。
我的欢迎屏幕
import 'package:ecommerce_practice/components/carousel.dart';
import 'package:ecommerce_practice/components/horizontal_list.dart';
import 'package:ecommerce_practice/components/products.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class WelcomePage extends StatelessWidget
@override
Widget build(BuildContext context)
return Scaffold(
appBar: AppBar(
title: Text('E-commerce'),
backgroundColor: Colors.red,
actions: [
IconButton(
icon: Icon(
Icons.search,
),
color: Colors.white,
onPressed: () ,
),
IconButton(
icon: Icon(Icons.shopping_cart),
color: Colors.white,
onPressed: () ,
)
],
),
drawer: Drawer(
child: ListView(
children: [
UserAccountsDrawerHeader(
accountName: Text("Aleem"),
accountEmail: Text('aleem.alam@outlook.com'),
currentAccountPicture: GestureDetector(
child: CircleAvatar(
backgroundColor: Colors.grey,
child: Icon(
Icons.person,
color: Colors.white,
),
),
),
decoration: BoxDecoration(color: Colors.red),
),
DrawerMenuButton(
title: 'Home',
icon: Icon(
Icons.home,
color: Colors.red,
),
),
DrawerMenuButton(
title: 'My Account',
icon: Icon(
Icons.person,
color: Colors.red,
),
),
DrawerMenuButton(
title: 'My Order',
icon: Icon(
Icons.shopping_basket,
color: Colors.red,
),
),
DrawerMenuButton(
title: 'Category',
icon: Icon(
Icons.category,
color: Colors.red,
),
),
DrawerMenuButton(
title: 'Favourites',
icon: Icon(
Icons.favorite,
color: Colors.red,
),
),
Divider(),
DrawerMenuButton(
title: 'Settings',
icon: Icon(
Icons.settings,
color: Colors.blue,
),
),
DrawerMenuButton(
title: 'About Us',
icon: Icon(
Icons.help,
color: Colors.blue,
),
),
],
),
),
body: ListView(
children: [
ImageCarousel(),
Padding(
padding: EdgeInsets.all(10.0),
child: Text('Category'),
),
HorizontalList(),
Padding(
padding: EdgeInsets.all(10.0),
child: Text('Recent Product'),
),
Products(),
],
),
);
class DrawerMenuButton extends StatelessWidget
DrawerMenuButton(this.title, this.icon);
final String title;
final Icon icon;
@override
Widget build(BuildContext context)
return InkWell(
onTap: () ,
child: ListTile(
title: Text(title),
leading: icon,
),
);
products.dart
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class Products extends StatefulWidget
@override
_ProductsState createState() => _ProductsState();
class _ProductsState extends State<Products>
List<dynamic> products = [
'name': 'Shirt',
'image': 'images/category.jpg',
'old_price': 200,
'price': 140,
,
'name': 'Shirt',
'image': 'images/category.jpg',
'old_price': 200,
'price': 140,
];
@override
Widget build(BuildContext context)
return GridView.builder(
itemCount: products.length,
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
),
itemBuilder: (context, index)
return Product(
name: products[index]['name'],
image: products[index]['image'],
oldPrice: products[index]['old_price'],
finalPrice: products[index]['price'],
);
,
);
class Product extends StatelessWidget
Product(this.name, this.image, this.oldPrice, this.finalPrice);
final String name, image;
final int oldPrice, finalPrice;
@override
Widget build(BuildContext context)
return Card(
child: Hero(
tag: name,
child: Material(
child: InkWell(
onTap: () ,
child: GridTile(
footer: Container(
color: Colors.white,
child: ListTile(
leading: Text(
name,
style: TextStyle(
fontWeight: FontWeight.bold,
),
),
),
),
child: Image.asset(
image,
fit: BoxFit.cover,
),
),
),
),
),
);
【问题讨论】:
HorizontalList
是另一个水平滚动的ListView
吗?
这个问题是因为你把GridView放在ListView里面。 ListView/Gridview 有无限的高度。这意味着您将一个无限小部件推入另一个无限。这是错误的。首先你需要确定Gridview的高度。但我认为这里可能会出现另一个问题。网格视图也可以滚动,ListView 也可以滚动。(嵌套滚动)所以我认为这里最好的解决方案:您可以使用 CustomscrollView 或 NestesScrollView 代替 ListView 并且必须确定 GridView 的大小。
【参考方案1】:
尝试将GridView
的shrinkWrap
属性设置为true
,以便它只占用基于其项目所需的空间:
我以你的代码为例添加了一个演示:
return GridView.builder(
itemCount: products.length,
shrinkWrap: true, // new line
physics: NeverScrollableScrollPhysics(), // new line
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
),
itemBuilder: (context, index)
return Product(
name: products[index]['name'],
image: products[index]['image'],
oldPrice: products[index]['old_price'],
finalPrice: products[index]['price'],
);
,
);
编辑:为防止GridView
在您的ListView
中单独滚动,请将GridView
的physics
设置为NeverScrollablePhysics
。
【讨论】:
如果我的回答帮助您解决了您帖子中指定的问题,请接受并投票。 @Armaan以上是关于断言失败:第 551 行 pos 12:'child.hasSize':不正确的主要内容,如果未能解决你的问题,请参考以下文章
断言失败:第 6075 行 pos 12:'child == _child':不正确
断言行 5120 pos 12 失败:'child = _child' 不正确
断言失败:第 125 行第 12 行:'assertMidButtonStyles(navBarStyle, items!.length)'
断言失败:第 22 行 pos 14: 'url != null': is not true
Flutter 错误 - 断言失败:第 213 行 pos 15:'data != null':在从 firestore 获取数据时不正确
Flutter - 断言失败:第 61 行第 12 行:'_route == ModalRoute.of(context)':不正确