断言失败:第 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】:

尝试将GridViewshrinkWrap 属性设置为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 中单独滚动,请将GridViewphysics 设置为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)':不正确