颤振如何垂直滚动高行

时间:2020-04-02 00:16:04

标签: flutter scrollable

我想使以下行可滚动:

Row(
     children: [
       Expanded(
         flex: 1,
         child: timeColumn, // list of times
       ),
       dayColumn("Monday", "03-09-2002"), // monday info, etc.
       dayColumn("Tuesday", "03-10-2002"),
       dayColumn("Wednesday", "03-11-2002"),
       dayColumn("Thursday", "03-12-2002"),
       dayColumn("Friday", "03-13-2002"),
       dayColumn("Saturday", "03-14-2002"),
       dayColumn("Sunday", "03-15-2002"),
     ],
   )

,然后我创建了一个飞镖板,该飞镖板可显示以下代码: https://dartpad.dev/16547cbb0f37ac52299c1dd1d11c262e

要查看溢出问题,可以将代码的这一部分设置为“太大”,从而导致底部出现溢出:

  ///////////////////////////////////////////////////////////
  double rowHeight = 50;  // <-- Change this to set rowHeight
  ///////////////////////////////////////////////////////////

我正在使用行小部件,因为日期和计划信息每天将包含在一个对象中,因此我想将数据保留为一列列。 (所以,我认为listView是不可能的)

我尝试使用SingleChildScrollView(child:Row(....),但是我仍然遇到溢出情况。 我觉得这是使用LayoutBuilder + BoxConstraints + ConstrainedBox的好时机,如下所示: How to scroll page in flutter

那么,使“高行”可滚动的最佳方法是什么?

1 个答案:

答案 0 :(得分:1)

我只是通过将行放入有限高度的容器中以检查其性能来缩短行的高度,并将行放入SingleChildScrollView中,它可以平滑滚动。

           Container(
                height:50,
                child: SingleChildScrollView(
                   child : Row(
                        children: [
                            Expanded(
                              flex: 1,
                              child: timeColumn,
                            ),
                            dayColumn("Monday", "03-09-2002"),
                            dayColumn("Tuesday", "03-10-2002"),
                            dayColumn("Wednesday", "03-11-2002"),
                            dayColumn("Thursday", "03-12-2002"),
                            dayColumn("Friday", "03-13-2002"),
                            dayColumn("Saturday", "03-14-2002"),
                            dayColumn("Sunday", "03-15-2002"),
                          ],
                        )
                     )
                 ),