Какими Widget часто пользуешься?

Часто используемые Widget в Flutter

В повседневной разработке на Flutter я работаю с определённым набором основных виджетов, которые встречаются в большинстве приложений. Понимание их функциональности и назначения критически важно для эффективной разработки.

Контейнеры и Layout

Container — самый универсальный виджет для создания прямоугольных областей с настройкой отступов, границ, фона и теней. Я использую его для декорирования и позиционирования элементов:

Container(
  margin: EdgeInsets.all(16),
  padding: EdgeInsets.symmetric(horizontal: 16, vertical: 12),
  decoration: BoxDecoration(
    color: Colors.white,
    borderRadius: BorderRadius.circular(12),
    boxShadow: [BoxShadow(blurRadius: 8, color: Colors.black12)],
  ),
  child: Text("Контент"),
)

Column и Row — основные виджеты для вертикального и горизонтального расположения дочерних элементов. С помощью свойств mainAxisAlignment, crossAxisAlignment и mainAxisSize управляю распределением пространства.

Stack — позволяет накладывать виджеты друг на друга с абсолютным позиционированием. Часто использую для создания сложных UI-макетов с перекрытиями:

Stack(
  children: [
    Image.asset("background.png"),
    Positioned(
      bottom: 20,
      right: 20,
      child: FloatingActionButton(onPressed: () {}),
    ),
  ],
)

Expanded и Flexible — для распределения доступного пространства между дочерними виджетами внутри Row/Column. Expanded заполняет всё доступное место, Flexible даёт больше контроля.

Ввод данных и интерактивность

TextField — основной виджет для ввода текста. Оборачиваю его в Form для валидации и управления состоянием:

TextField(
  controller: _controller,
  decoration: InputDecoration(
    hintText: "Введите текст",
    border: OutlineInputBorder(),
    prefixIcon: Icon(Icons.search),
  ),
  onChanged: (value) => setState(() {}),
)

Button-виджеты (ElevatedButton, TextButton, OutlinedButton) — для действий пользователя. Выбираю в зависимости от визуальной иерархии:

ElevatedButton(
  onPressed: () => _handleSubmit(),
  child: Text("Отправить"),
)

GestureDetector — для обработки жестов (касания, двойные нажатия, длинное нажатие). Более гибкий чем специализированные кнопки.

Списки

ListView — для отображения прокручиваемых списков. Использую .builder конструктор для эффективной работы с большими списками:

ListView.builder(
  itemCount: items.length,
  itemBuilder: (context, index) => ListTile(
    title: Text(items[index].name),
  ),
)

GridView — для сеток элементов. Часто применяю для галерей или каталогов:

GridView.count(
  crossAxisCount: 2,
  children: List.generate(10, (i) => Container()),
)

Текст и иконки

Text — основной виджет для отображения текста с поддержкой стилизации, теней и переноса.

Icon и IconButton — для отображения иконок и кнопок с иконками из Material Design набора.

Навигация и состояние

Scaffold — структурирует экран с appBar, body и floatingActionButton.

AppBar — для заголовка экрана с действиями.

BottomNavigationBar — для навигации между экранами приложения.

В целом, эти виджеты покрывают 90% случаев использования в типичном приложении, а их комбинация позволяет создавать сложные интерфейсы.