Что такое SafeArea в Flutter и когда его применять?

SafeArea — это виджет в Flutter, который автоматически добавляет отступы (padding) к своему дочернему виджету, чтобы избежать перекрытия контента системными интерфейсами. Он учитывает:

• Вырез экрана («чёлка») на iPhone.
• Динамический остров (Dynamic Island) на новых iPhone.
• Закругленные углы экрана.
• Панели навигации и статус-бары на Android и iOS.

Базовое использование: Просто оберните ваш корневой контент в SafeArea, обычно внутри Scaffold.body.

Scaffold(
  body: SafeArea(
    child: Column(
      children: [
        Text('Этот текст будет находиться в безопасной зоне'),
        // ... остальной контент
      ],
    ),
  ),
);

Тонкая настройка: Вы можете контролировать, к каким сторонам применять отступы.

SafeArea(
  left: false, // Отключить отступ слева (например, для drawer)
  top: true,   // Включить отступ сверху (для статус-бара)
  right: true,
  bottom: true, // Включить отступ снизу (для панели навигации)
  minimum: EdgeInsets.only(top: 20.0), // Минимальные обязательные отступы
  child: MyContent(),
)

Важные замечания:

1. Не злоупотребляйте: Не оборачивайте каждый виджет в SafeArea. Обычно он нужен только один раз на верхнем уровне экрана. Вложенные SafeArea приведут к накоплению отступов.
2. Альтернатива — MediaQuery.padding: Если вам нужны данные о безопасных зонах для кастомной логики (например, для позиционирования виджета), используйте MediaQuery.of(context).padding.
3. SliverSafeArea: Для использования внутри CustomScrollView существует виджет SliverSafeArea.

Использование SafeArea критически важно для обеспечения профессионального вида приложения и комфортного UX на современных устройствах с нестандартными формами экранов.