簡體   English   中英

如何在 Flutter MultiProvider 中使用其子級中內置的上下文?

[英]How to i use the context built in Flutter MultiProvider, inside its child?

我正在嘗試使用 MyTheme 提供程序通過使用 MultiProvider 在 MaterialApp 中設置主題值。 但是 MaterialApp 無法訪問 MyTheme 提供程序。

我正在嘗試通過使用應用程序內的按鈕來更改主題,這將更新提供程序並反過來更改整個應用程序的主題。

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MultiProvider(
      providers: [
        ChangeNotifierProvider(
          create: (context) => Result(),
        ),
        ChangeNotifierProvider(
          create: (context) => MyTheme(),
        ),
      ],
      child: MaterialApp(
        home: TasksScreen(),
        theme: ThemeData.light(),
        darkTheme: ThemeData.dark(),
        themeMode: context.watch<MyTheme>().currentTheme(),
      ),
    );
  }
}

我相信我無法訪問它,因為消費者和提供者處於同一級別,但我不確定如何去做。

class MyTheme with ChangeNotifier {
  static bool _isDark = true;

  ThemeMode currentTheme() {
    return _isDark ? ThemeMode.dark : ThemeMode.light;
  }

  void switchTheme() {
    _isDark = !_isDark;
    notifyListeners();
  }
}

如何在 MultiProvider 的子節點中訪問 MyTheme Provider?

如果不可能,那么更好的方法是什么?

在構建器中包裝 MaterialApp

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MultiProvider(
      providers: [
        ChangeNotifierProvider(
          create: (context) => Result(),
        ),
        ChangeNotifierProvider(
          create: (context) => MyTheme(),
        ),
      ],
      child: Builder(
        builder: (context) => MaterialApp(
          home: TasksScreen(),
          theme: ThemeData.light(),
          darkTheme: ThemeData.dark(),
          themeMode: context.watch<MyTheme>().currentTheme(),
        ),
      ),
    );
  }
}

使用提供者

var theme = Provider.of<MyTheme>(context, listen: false).currentTheme();

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM