当在列中包装容器时，颤振显示hasSize错误

Question

将容器包装在列小部件中时出现错误。我在一列中需要2个容器，但是当我将其包装在列小部件中时，就会显示此错误

'package:flutter/src/rendering/box.dart':
Failed assertion: line 1694 pos 12: 'hasSize'

在“列行错误”中显示

这是我的代码

class _PlaceListState extends State<PlaceList> {
  final List _places = [
    {'name': 'Hunza', 'where': 'Gilgit Baltistan'},
    {'name': 'Skardu' ,'where': 'Gilgit Baltistan'},
    {'name': 'Murree', 'where': 'Gilgit Baltistan'},
  ];

  @override
  Widget build(BuildContext context) {
    return Column(children: <Widget>[
      Container(
        margin: EdgeInsets.only(left: 40),
        width: MediaQuery.of(context).size.width * 0.5,
        child: ListView.builder(
            itemCount: _places.length,
            itemBuilder: (ctx, int index) {
              return Container(
                padding: EdgeInsets.only(top: 50),
                child: Column(
                  children: <Widget>[
                    Text(_places[index]['name'], style: TextStyle(fontSize: 20),),
                    Container(
                      padding: EdgeInsets.only(top: 20),
                      child: ClipRRect(
                        borderRadius: BorderRadius.circular(20.0),
                        child: Card(
                          elevation: 40.0,
                          child: Container(
                            width: 200,
                            child: Image(image: AssetImage('assets/images/500place.jpg')),
                          ),
                        ),
                      ),
                    ),
                    Padding(
                        padding: const EdgeInsets.only(top: 7),
                        child: Row(
                          children: <Widget>[
                            Icon(Icons.favorite_border, size: 20),
                            Spacer(),
                            Text(
                              _places[index]['where'],
                            ),
                          ],
                        )
                    ),

                  ],
                ),
              );
            }),
      )
    ],);
  }
}

我使用导航规则的屏幕输出，这就是为什么我设置宽度和它在没有Column小部件的情况下工作正常的原因

Answer 1

您可以在下面复制粘贴运行完整代码
步骤1：在使用height时提供PlaceList()，可以使用Expanded(child: PlaceList())
步骤2：为shrinkWrap: true添加ListView
步骤3：使用Expaneded flex为Container() 1和2提供高度，

Column(
      children: <Widget>[
        Expanded(
          flex: 3,
      ...
      Expanded(
        flex: 1,
        child: Center(child: Container(child: Text("Second Container"))))

工作演示

完整代码

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Expanded(child: PlaceList()),
          ],
        ),
      ),
    );
  }
}

class PlaceList extends StatefulWidget {
  @override
  _PlaceListState createState() => _PlaceListState();
}

class _PlaceListState extends State<PlaceList> {
  final List _places = [
    {'name': 'Hunza', 'where': 'Gilgit Baltistan'},
    {'name': 'Skardu', 'where': 'Gilgit Baltistan'},
    {'name': 'Murree', 'where': 'Gilgit Baltistan'},
    {'name': 'abc', 'where': 'def'},
  ];

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Expanded(
          flex: 3,
          child: Container(
            margin: EdgeInsets.only(left: 40),
            width: MediaQuery.of(context).size.width * 0.5,
            child: ListView.builder(
                shrinkWrap: true,
                itemCount: _places.length,
                itemBuilder: (ctx, int index) {
                  return Container(
                    padding: EdgeInsets.only(top: 50),
                    child: Column(
                      children: <Widget>[
                        Text(
                          _places[index]['name'],
                          style: TextStyle(fontSize: 20),
                        ),
                        Container(
                          padding: EdgeInsets.only(top: 20),
                          child: ClipRRect(
                            borderRadius: BorderRadius.circular(20.0),
                            child: Card(
                              elevation: 40.0,
                              child: Container(
                                width: 200,
                                child: Image(
                                    image: AssetImage(
                                        'assets/images/500place.jpg')),
                              ),
                            ),
                          ),
                        ),
                        Padding(
                            padding: const EdgeInsets.only(top: 7),
                            child: Row(
                              children: <Widget>[
                                Icon(Icons.favorite_border, size: 20),
                                Spacer(),
                                Text(
                                  _places[index]['where'],
                                ),
                              ],
                            )),
                      ],
                    ),
                  );
                }),
          ),
        ),
        Expanded(
            flex: 1,
            child: Center(child: Container(child: Text("Second Container"))))
      ],
    );
  }
}

Answer 2

尝试将height: // define height in double添加到您的容器中