如何使flutter中的水平ListView的高度与其子级最大高度一样高,放置在列中?

sm_*_*edi 3 flutter flutter-layout flutter-listview

我将水平ListView放置在一列中,并且我希望它具有所需的高度。实现此目的的一种方法是将 包装ListView在 a 中SizedBox并为其指定特定的硬编码height. 此外,将其包装在Expanded小部件中将导致ListView占用列中的额外可用空间。但是,我希望它自动占据所需的高度。如何才能实现这一目标?谢谢。

示例代码如下:

@override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Padding(
          padding: const EdgeInsets.all(20),
          child: Column(
            children: [
              Text("Hi there!"),
              SizedBox(
                height: 50,
                child: ListView(
                  scrollDirection: Axis.horizontal,
                  shrinkWrap: true,
                  children: List.generate(
                    4,
                    (index) => Text("Item $index "),
                  ),
                ),
              ),
              ElevatedButton(
                onPressed: () {},
                child: Text("This is a button"),
              ),
            ],
          ),
        ),
      ),
    );
  }
Run Code Online (Sandbox Code Playgroud)

输出是: 在此输入图像描述

但我想要的(周围没有更多或更少的空间ListView): 在此输入图像描述

use*_*613 10

不幸的是这是不可能的。AListView可能有很多项目(甚至无限),因此找出“最大的一个”需要遍历每个项目,这违背了使用 的全部意义ListView

如果您只有几个项目,Row则可以使用小部件。如果需要滚动,请RowSingleChildScrollView.

例如:

Column(
  children: [
    Container(
      color: Colors.green.shade100,
      child: SingleChildScrollView(
        scrollDirection: Axis.horizontal,
        child: Row(
          children: [
            FlutterLogo(),
            FlutterLogo(size: 100),
            for (int i = 0; i < 50; i++) FlutterLogo(),
          ],
        ),
      ),
    ),
    const Text('The row has ended.'),
  ],
)
Run Code Online (Sandbox Code Playgroud)

演示:

演示动图