flutter - 带有 'mainAxisSize: MainAxisSize.min'的列内部的ShrinkWrap Horizo​​ntal ListView给出错误: 'constraints.hasBoundedHeight':不正确

Question

我正在尝试显示水平ListView，其高度由其子级在Column中指定，该高度也是其子级的高度。
但是，我收到以下错误:'constraints.hasBoundedHeight':不正确。
这是重现该错误的简单代码段:

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

main() => runApp(MaterialApp(
      home: Scaffold(
        body: MyApp(),
      ),
    ));

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisSize: MainAxisSize.min,
      children: <Widget>[
        Text('Vertical1'),
        ListView(
          scrollDirection: Axis.horizontal,
          shrinkWrap: true,
          children: <Widget>[
            Container(
              height: 100,
              width: 100,
              child: Text('Horizontal1'),
              color: Colors.red,
            ),
          ],
        ),
        Text('Vertical2')
      ],
    );
  }
}

如您所见， children 的高度已经确定，所以我没有问题。
这是预期的输出:

我知道我可以使用SingleChildScrollView，但只想了解为什么它不适用于ListView。

Answer 1

仅仅因为您的 child 有一个尺寸，并不意味着ListView将采用该尺寸。
您需要为ListView设置一个高度，因为默认情况下它的高度是无限的。
之所以会出现此错误，是因为您无法在列中放置无限的高度，
因此，如果您希望列表占用所有可用空间，请使用Expanded小部件为其设置高度。
这是一个例子:

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Column(
          children: <Widget>[
            Container(color: Colors.red, child: Text('Vertical1')),
            ConstrainedBox(
              constraints: BoxConstraints(
                maxHeight: 100,
              ),
              child: Container(
                color: Colors.green,
                child: ListView(
                  scrollDirection: Axis.horizontal,
                  shrinkWrap: true,
                  children: <Widget>[
                    Container(
                      height: 100,
                      width: 100,
                      child: Text('Horizontal1'),
                    ),
                  ],
                ),
              ),
            ),
            Container(color: Colors.red, child: Text('Vertical2'))
          ],
        ),
      ),
    );
  }
}