如何制作一个可以扩展以适合内容但在剩余空间被填充时停止扩展的盒子?

时间:2018-06-28 11:08:21

标签: flutter flutter-layout

我很扑朔迷离。我有一个layout,其中有一个pageview.builder,每页显示一张卡片。我希望卡片适合内容,扩展为包含更多内容的卡片,直到卡片填满页面的其余部分为止,然后我希望卡片开始滚动。我花了几个小时尝试layouts的不同嵌套,但是无法计算出该组合以获得我想要的效果。

code看起来像这样:

child: new Column(
        children: [

          SizedBox(
            height: 25.0,
          ),
          Image.asset(
            "images/image.png",
            scale: 0.1,
            height: 100.0,
          ),
          new ConstrainedBox(
              constraints: BoxConstraints(maxHeight: 550.0),
              child: PageView.builder(
                controller: PageController(viewportFraction: 0.9),
                itemBuilder: (BuildContext context, int index){
                  DayInfo thisDay = AllDaysInfo[index];
                      child: Material(
                          child: new Text(thisDay.info),
                          )
                      )
                 )
        ]
),

({parentheses可能是不正确的!已将我的代码缩减为简化代码,以便于查看我在做什么)

因此,我想删除ConstrainedBox,这实际上是迫使其高550。我希望它可以填充剩余的空间,但是当它到达那里时就停止增长!

有什么想法吗?

迈克

1 个答案:

答案 0 :(得分:1)

所以-我已经解决了!抱歉-这有点愚蠢。本质上,我要做的就是添加一个Expanded小部件,而不是上面示例中的ConstrainedBox,然后在SingleChildScrollView小部件周围放置一个Material小部件。很有魅力!

child: new Column(
        children: [

          SizedBox(
            height: 25.0,
          ),
          Image.asset(
            "images/image.png",
            scale: 0.1,
            height: 100.0,
          ),
          new Expanded(
              child: PageView.builder(
                controller: PageController(viewportFraction: 0.9),
                itemBuilder: (BuildContext context, int index){
                  DayInfo thisDay = AllDaysInfo[index];
                      child: SingleChildScrollView
                             child: Material(
                                    child: new Text(thisDay.info),
                                    )
                             )
                      )
                 )
        ]
),