如何在Flutter中将高度填充填充到父级(或获取父级尺寸)?

时间:2019-05-09 16:06:40

标签: flutter widget size

我是新手,但我的ListView遇到问题。我的ListView包含许多项目,ListView的项目包含问题内容和一些用户评论。

商品的高度由其子商品的高度自动确定,商品的第一个子商品(下面的DeepOrange容器)的高度也取决于父商品的高度(不是ListView的商品),其高度必须填充到父商品的高度项目。

ListView的项目大小取决于其子项目大小, 该项目中的第一个小部件(下面的容器)也依赖于父项目。

我该怎么做?

非常抱歉,英语不是我的灵长类语言,我的英语很差。这是我的代码:

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

class MainPage extends StatefulWidget {
  const MainPage({Key key, this.title}) : super(key: key);
  final String title;

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

class _MainPageState extends State<MainPage> {
  var items = List.generate(10, (index) => index);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ListView(
        children: items.map((item) => Row(
          /*I can't compute the real rendered height of the item by it's children content, because it's possible contain many replay message, different font size etc.*/
          children: <Widget>[
            Container(
              width: 5.0,
              /**
               * I want to fill the height to parent widget of the container,
               * (I want to make an timeline widget, it's should max height to its parent.)
               * but i can't get parent items size, or double.infinity etc,
               */
              height: 80.0, // How to fill the height to parent of the property? or how to get parent item size (or actually rendered height)?
              color: Colors.deepOrange,
            ),
            SizedBox(width: 10.0,),
            Expanded(
              child: Column(
                mainAxisSize: MainAxisSize.min,
                children: <Widget>[
                  Text("there is long comment of users, there is long comment of users, there is long comment of users, there is long comment of users, there is long comment of users, $item"),
                  /*
                  Also here is a lists of replay message by another user.
                  * */
                  Column(children: <Widget>[
                    Text("replay 1"),
                    Text("replay 2"),
                    Text("replay 3"),
                    Text("replay N"),
                  ],),
                  Row(
                    children: <Widget>[
                      IconButton(icon: Icon(Icons.favorite)),
                      IconButton(icon: Icon(Icons.delete)),
                      IconButton(icon: Icon(Icons.message)),
                    ],
                  )
                ],
              ),
            ),
          ],
        ),).toList(),
      ),
    );
  }
}

enter image description here

我只想将该紫色容器的高度调整为父容器的高度。 预先谢谢你。

1 个答案:

答案 0 :(得分:1)

将列表包装在容器中。然后将高度设置为屏幕尺寸。您可以通过MediaQuery来获取。

frozenset({1, 2})