【问题标题】:How to add scroll to the column in flutter如何在颤动中向列添加滚动
【发布时间】:2019-01-06 11:12:23
【问题描述】:

我在一个列中创建了一个包含多个小部件的屏幕。我得到了错误。然后我更新了列中容器的高度,然后屏幕不会滚动,因为它有一些固定的大小。

然后我从列移动到ListView,但我的小部件仍然无法滚动。

  new ListView(
          shrinkWrap: true,
          children: <Widget>[

            // Author information
            new Container(
              height: MediaQuery
                  .of(context)
                  .size
                  .height * .075,
              width: double.infinity,
              padding: const EdgeInsets.only(
                  top: 10.00, right: 10.00),
              child: new Row(

                children: <Widget>[

                  new CircleAvatar(

                    backgroundColor: new Color(0xFF535386),
                    foregroundColor: new Color(0xFFF4F4F4),
                    backgroundImage: new NetworkImage(
                        _feed.authorImageUrl),
                    radius: 30.00,
                    child: new Text(
                        _feed.authorName.substring(0, 1)
                            .toUpperCase()),
                  ),

                  new Padding(padding: EdgeInsets.only(
                      bottom: 5.00, top: 2.00, left: 5.00),
                      child: new Column(
                        crossAxisAlignment: CrossAxisAlignment
                            .start,
                        children: <Widget>[
                          new Text(
                            _feed.authorName,
                            textAlign: TextAlign.start,
                            softWrap: true,
                            style: new TextStyle(
                              fontSize: 20.0,

                            ),
                          ),
                          new Text(_feed.dateTime,
                            textAlign: TextAlign.start,),
                        ],
                      )),

                ],

              ),
            ),

            // Title

            new Padding(padding: const EdgeInsets.only(
                top: 10.00, left: 10.00),
              child: new Text(
                _feed.title, textAlign: TextAlign.start,),
            ),

            // content

            new Container(
              child: new Text(
                _feed.content, textAlign: TextAlign.start,),
            ),
          ],
        ),

【问题讨论】:

  • @GünterZöchbauer 我使用了ListView 也无法正常工作。请检查上面的代码。
  • 内容是否高于列表?尝试启用flutter.io/debugging/#visual-debugging debugPaintSizeEnabled=true;
  • 是的,我正在此Text() 中加载完整的论坛提要,因此对于某些提要,内容更高。此论坛应用程序。完整的论坛帖子及其 cmets 将加载到此屏幕上。这就是我寻找滚动条的原因。
  • 我认为是 MediaQuery 导致了您的问题。你想达到什么效果?如果您喜欢这样的话,使用Expanded 可能是实现比例布局的更好方法。

标签: flutter flutter-layout


【解决方案1】:

您的ListView 似乎很好,但我猜它被包裹在一个固定大小的小部件中,如ColumnRow(黄色和黑色错误表示内容大于可用空间),所以你应该将ListView 包装在一个Expanded 小部件中,如下所示:

new Expanded(
    child: new ListView(
      shrinkWrap: true,
      children: <Widget>[
        //Your content
      ],
    )
)

【讨论】:

    猜你喜欢
    • 2021-04-03
    • 2020-06-01
    • 2021-10-06
    • 2021-11-30
    • 2021-11-23
    • 2020-12-25
    • 2019-11-05
    • 2019-05-18
    • 2021-10-26
    相关资源
    最近更新 更多