21

I can't fix this error

RenderBox was not laid out: RenderPointerListener#2b92a relayoutBoundary=up9 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE 'package:flutter/src/rendering/box.dart': Failed assertion: line 1940 pos 12: 'hasSize'. The relevant error-causing widget was ->ListView

enter image description here

This is my allProducts part.

import 'package:flutter/material.dart';
import 'package:hospital/Drawer/drawercontent.dart';
import 'package:hospital/Product/AllProducts/ProductList/product_list.dart';
import 'package:hospital/Product/AllProducts/carousel.dart';
import 'package:hospital/Product/AllProducts/category.dart';

class AllProducts extends StatefulWidget {
  @override
  _AllProductsState createState() => _AllProductsState();
}

class _AllProductsState extends State<AllProducts> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.green,

          title: Text(
            "Product",
            style: TextStyle(fontStyle: FontStyle.italic),
          ),
          actions: [

            IconButton(
              icon: Icon(Icons.person),
              onPressed: () => print("open cart"),
            ),
          ],

        ),
        drawer: Drawer(
          child: DrawerContent(),
        ),
        body: ListView(

          children: [
            Carousel(),
            SizedBox(
              height: 10.0,
            ),

            CategoryPage(),
            SizedBox(
              height: 20.0,
            ),
            ProductList()

          ],
        ));
  }
}

This is my product part

import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:flutter/foundation.dart';
import 'package:hospital/Product/AllProducts/ProductList/network_req.dart';
import 'package:hospital/Product/AllProducts/ProductList/product_model.dart';
import 'package:hospital/constant.dart';
import 'package:http/http.dart' as http;
// import '../../drawercontent.dart';

class ProductList extends StatefulWidget {
  final s_id;

  const ProductList({key, this.s_id}) : super(key: key);
  @override
  _ProductListState createState() => _ProductListState();
}

class _ProductListState extends State<ProductList> {
  @override
  Widget build(BuildContext context) {
    return Container(
      // ignore: missing_required_param
      child: FutureBuilder<List<Model>>(
        // future: NetReq.fetchTeams(),
        future: NetReq.fetchTeams(widget.s_id),

        builder: (context, snapshot) {
          if (snapshot.hasError) {
            return Text("Error ${snapshot.error}");
          } else if (snapshot.hasData) {
            return GridView.count(

                // childAspectRatio: 1.0,
                padding: EdgeInsets.only(left: 20, right: 20),
                crossAxisCount: 2,
                crossAxisSpacing: 18,
                mainAxisSpacing: 18,

                children: snapshot.data.map((team) {
                  return Card(
                    elevation: 3.0,
                    margin: EdgeInsets.all(10.0),
                    shape: RoundedRectangleBorder(

                      borderRadius: BorderRadius.circular(12.0),
                    ),
                    child: Container(
                      width: 150.0,
                      padding: EdgeInsets.all(8.0),

                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          Expanded(
                            child: ClipRRect(

                              borderRadius: BorderRadius.circular(14.0),
                              child: Container(
                                decoration: BoxDecoration(
                                  borderRadius: BorderRadius.circular(12.0),
                                  image: DecorationImage(
                                    image: NetworkImage(
                                        "https://5.imimg.com/data5/MR/TK/KJ/SELLER-769696/tulac-granules-500x500.jpeg"),
                                  ),

                                ),
                              ),
                            ),
                          ),
                          SizedBox(height: 12.0),

                          Text(
                              // "Tulac Granules, For Personal, Packaging Size: 90 Gm",
                              team.teamUniqId,
                              overflow: TextOverflow.ellipsis,
                              maxLines: 2,

                              style: kTitleStyle),
                          SizedBox(height: 6.0),
                          Text(
                              // "\u20B9 239/ Box",
                              team.teamType,

                              maxLines: 1,
                              style: kSubTitleStyle),
                        ],
                      ),
                    ),

                  );
                }).toList());
          }
          return Center(
            child: CircularProgressIndicator(),

          );
        },
      ),
    );

  }
}

3 Answers 3

43

This happens when ListView has no constrained height which makes it gets an infinite height, you can solve this using two solutions

  1. add shrinkWrap: true as a parameter which will tell the ListView to use a little space as possible,

  2. Wrap your ListView with a constrained height widget, such as a SizedBox or a Container, and give it a height and width like so

       Container(
            height: 50,
            width: 50,
            child: ListView()
              )

hope this solves your problem

4
  • Yes, wrapping the listview with a SizedBox fixes the issue, but the problem is the listview doesn't have a fixed height, its height is changing as items are increasing.. what to do in such scenario?
    – Ali Mohsin
    May 16, 2022 at 12:57
  • 1
    @AliMohsin Its always recommended to go for the first solution I mentioned which is to add shrinkWrap: true May 18, 2022 at 7:43
  • shrinkWrap: true is the right direction, but you also need something like Expanded wrapped around the ListView to get this work (as Forhan Ahmed Chowdhury mentioned - otherwise the error persists. This approach also uses the available space without defining a fixed height, which I prefer in most cases.
    – jonashackt
    Jan 28 at 10:51
  • I got the error when I used "height: double.infinity" in SingleChildScrollView, now I have removed "height: double.infinity" and it is working fine. Feb 18 at 13:48
8

Please add to the GridView shrinkWrap: true like this:

return GridView.count(
  shrinkWrap: true
   padding: EdgeInsets.only(left: 20, right: 20),
   crossAxisCount: 2,
   crossAxisSpacing: 18,
   mainAxisSpacing: 18,
);
6

When ListView has no constrained height you face this problem. You can wrap your ListView with the Expanded widget. Also, add shrinkWrap: true as a parameter.

Expanded(
   child: ListView(
      shrinkWrap: true,
   ),
 )
0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.