如何在flutter中的列中添加滚动

时间:2018-07-30 08:34:40

标签: flutter flutter-layout

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

然后,我从列移到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,),
            ),
          ],
        ),

1 个答案:

答案 0 :(得分:3)

您的ListView似乎还不错,但是我猜它以ColumnRow的形式包裹在固定大小的小部件中(黄色和黑色错误表示内容较大而不是可用空间),因此您应该将ListView包装在Expanded小部件中,如下所示:

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