在将Navigator.push到新支架上时如何覆盖Material App的主题？

Question

我是新手，要问别人能回答这个问题。在我的应用中，我已经在main.dart文件中将主题定义为

MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primaryColor: QamaiThemeColor,
        scaffoldBackgroundColor: QamaiThemeColor,
        fontFamily: 'Raleway',
        hintColor: White,
        textSelectionColor: White,
        primaryTextTheme: Typography(platform: TargetPlatform.iOS).white,
        textTheme: Typography(platform: TargetPlatform.iOS).white,
        appBarTheme: AppBarTheme(
          color: BlackMaterial,
        ),
      ),

现在，此主题适用于我的应用程序的前3页。登录用户后，我想在我的Scaffold中应用一个新主题，而不使用新的MaterialApp小部件并为此定义主题。这可能吗？到目前为止，我正在使用新的MaterialApp，但我必须传递旧的Material App的上下文，以避免navigator.pop用黑屏杀死我的应用程序。有更好的替代方法吗？

这是我的第二页主题

MaterialApp(
        theme: ThemeData.light().copyWith(scaffoldBackgroundColor: White),

Answer 1

我将使用像提供程序之类的状态管理库...确保像这样在pubspec中放入deps：

dependencies:
  flutter:
    sdk: flutter
  provider: ^3.0.0+1

然后检查此代码段（可运行-您可以复制粘贴它）。请注意MaterialApp的主题属性，以及如何更改按钮的onPressed（）函数中的主题。

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

void main() {
  return runApp(MyApp());
}

class ThemeService with ChangeNotifier {
  static final ThemeData themeA =
      ThemeData.light().copyWith(scaffoldBackgroundColor: Colors.black);
  static final ThemeData themeB =
      ThemeData.light().copyWith(scaffoldBackgroundColor: Colors.white);

  ThemeData _currentTheme = themeA;

  get currentTheme => _currentTheme;

  switchToThemeA() {
    _currentTheme = themeA;
    notifyListeners();
  }

  switchToThemeB() {
    _currentTheme = themeB;
    notifyListeners();
  }
}

/// This Widget is the main application widget.
class MyApp extends StatelessWidget {
  static const String _title = 'Flutter Code Sample';

  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
        create: (_) => ThemeService(),
        child: Builder(builder: (BuildContext context) {
          ThemeService themeService = Provider.of<ThemeService>(context);
          return MaterialApp(
            theme: themeService._currentTheme,
            title: _title,
            home: HomePage(),
          );
        }));
  }
}

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    ThemeService themeService = Provider.of<ThemeService>(context);
    return Scaffold(
      body: SafeArea(
        child: Column(
          children: <Widget>[
            Text(
              "Text on Scaffold Body",
              style: TextStyle(color: Colors.yellow),
            ),
            RaisedButton(
              onPressed: () {
                themeService.switchToThemeA();
              },
              child: Text("Theme A"),
            ),
            RaisedButton(
              onPressed: () {
                themeService.switchToThemeB();
              },
              child: Text("Theme B"),
            ),
          ],
        ),
      ),
    );
  }
}

对我来说，这是最简单的方法。只需使用ThemeService themeService = Provider.of（context）;

来获取对ThemeService的引用，就可以在应用程序中的任何位置更改主题。