флаттер Как вертикально прокрутить высокий ряд - PullRequest
Новая
       12

флаттер Как вертикально прокрутить высокий ряд

0 голосов
/ 02 апреля 2020

Я хочу сделать следующую строку прокручиваемой: 

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, как указано здесь: Как прокручивать страницу во флаттере

Итак, каков лучший способ сделать прокручиваемый «Tall Row»?

1 Ответ

1 голос
/ 02 апреля 2020

Я просто сократил высоту строки, поместив ее в контейнер с ограниченной высотой, чтобы проверить, как она работает, и поместил строку в 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"),
                          ],
                        )
                     )
                 ),
...