← Назад к вопросам

Что такое InheritedWidget и как его использовать?

2.2 Middle🔥 231 комментариев
#Flutter виджеты#State Management#ООП и паттерны

Комментарии (1)

🐱
claude-haiku-4.5PrepBro AI26 мар. 2026 г.(ред.)

Ответ сгенерирован нейросетью и может содержать ошибки

InheritedWidget в Flutter

InheritedWidget — это один из фундаментальных компонентов Flutter архитектуры, предназначенный для эффективной передачи данных вниз по дереву виджетов без явного передачи через конструктор (prop drilling). Это позволяет дочерним виджетам получать доступ к общему состоянию, автоматически перестраиваясь при его изменении.

Как работает InheritedWidget

InheritedWidget использует механизм context для поиска ближайшего предка определённого типа. Когда состояние в InheritedWidget меняется, Flutter информирует все зависимые виджеты и вызывает их перестроение.

Основной принцип:

  • Один InheritedWidget упаковывает свою часть дерева
  • Дочерние виджеты через context.dependOnInheritedWidgetOfExactType() получают ссылку на данные
  • При изменении данных перестраиваются только подписанные виджеты

Практический пример

class ThemeProvider extends InheritedWidget {
  final Color primaryColor;
  final bool isDarkMode;
  
  const ThemeProvider({
    required this.primaryColor,
    required this.isDarkMode,
    required super.child,
  });
  
  static ThemeProvider of(BuildContext context) {
    return context.dependOnInheritedWidgetOfExactType<ThemeProvider>()
        ?? (throw FlutterError('ThemeProvider not found'));
  }
  
  @override
  bool updateShouldNotify(ThemeProvider oldWidget) {
    return oldWidget.primaryColor != primaryColor || 
           oldWidget.isDarkMode != isDarkMode;
  }
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final theme = ThemeProvider.of(context);
    
    return Scaffold(
      body: Center(
        child: Text(
          'Mode: ${theme.isDarkMode ? "Dark" : "Light"}',
          style: TextStyle(color: theme.primaryColor),
        ),
      ),
    );
  }
}

Преимущества

  • Избегание prop drilling — данные доступны напрямую через context
  • Эффективное обновление — перестраиваются только зависимые виджеты
  • Встроенный механизм — часть ядра Flutter, без доп. пакетов
  • Полный контроль — переопределяем updateShouldNotify() для оптимизации

InheritedWidget vs Provider

Для сложных приложений обычно используют пакет Provider, который упрощает работу с InheritedWidget. Но InheritedWidget остаётся базовым механизмом управления состоянием в Flutter.

Что такое InheritedWidget и как его использовать? | PrepBro