Ask the assistant

0/400

Your question is processed by an AI service and kept to improve answers. Do not enter personal data.

SingleChildScrollView

This page has not been translated into English yet. The Russian original is below.

Делает прокручиваемым одного ребёнка, который не помещается в отведённое место. Подходит для формы или страницы из нескольких блоков, когда список однотипных строк не нужен.

Тип: single-child

SizedBox height:120
  SingleChildScrollView
    Column
      Text "Строка 1"
      Text "Строка 2"
      Text "Строка 3"
      Text "Строка 4"
      Text "Строка 5"
      Text "Строка 6"

Параметры

Параметр	Тип	Default	Описание
`scrollDirection`	string	vertical	Направление: `vertical` , `horizontal`
`reverse`	bool	false	Начинать прокрутку с конца
`physics`	string	always	Реакция на жест: `never` , `bouncing` , `clamp` , `always`
`clipBehavior`	string	hardEdge	Обрезка по границам
`keyboardDismissBehavior`	string	manual	`onDrag` — убирать экранную клавиатуру при протаскивании

Вложенные структуры

`#padding`

Отступ внутри области прокрутки.

SizedBox height:120
  SingleChildScrollView
    #padding all 16
    Column spacing:8
      Text "Абзац 1"
      Text "Абзац 2"
      Text "Абзац 3"
      Text "Абзац 4"

Примеры

Горизонтальная прокрутка ряда

SingleChildScrollView scrollDirection:horizontal
  Row spacing:8
    SizedBox width:200 height:80
      ColoredBox color:#4f46e5
    SizedBox width:200 height:80
      ColoredBox color:#7c3aed
    SizedBox width:200 height:80
      ColoredBox color:#059669

Форма, которая не должна прятаться за клавиатурой

@email:""
@name:""
SingleChildScrollView keyboardDismissBehavior:onDrag
  #padding all 16
  Column spacing:12 crossAxisAlignment:stretch
    TextField value:$name
      #decoration labelText:"Имя"
    TextField value:$email
      #decoration labelText:"Почта"

Различия между приложением и сайтом

scrollDirection , #padding работают. reverse , physics и clipBehavior на сайте не читаются, keyboardDismissBehavior — не имеет смысла (у страницы нет собственной экранной клавиатуры; браузер закрывает свою сам).
Внутри ребёнка по поперечной оси размер равен области прокрутки, а по главной — по содержимому.

Best practices

Длинный однотипный список — не сюда. SingleChildScrollView строит всё содержимое сразу, даже невидимое; для длинных повторяющихся строк берите ListView.builder .
Ставьте SingleChildScrollView внутрь элемента с ограниченным размером ( SizedBox , Expanded ): иначе прокручивать нечего — места и так сколько угодно.
Внутрь SingleChildScrollView не кладите Expanded / Spacer : по главной оси места нет, растягиваться им не из чего.