微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Flutter:如何在Flutter中使用Switch更改主题-我已经使用提供程序实现了此明暗主题,但无法通过Switch进行更改

如何解决Flutter:如何在Flutter中使用Switch更改主题-我已经使用提供程序实现了此明暗主题,但无法通过Switch进行更改

我已经使用提供程序来更改主题,这是浅色和深色主题代码。我的问题的主要目的是通过开关而不是按钮来更改主题。 可以使用“ int模式”通过按钮正确更改主题。 但是当我因为开关而使用“布尔模式”时。开关需要为true或false。

如何实现此开关以更改明暗主题?我需要一个开关,而不是一个按钮。

import 'package:Flutter/material.dart';

class AppStyleModeNotifier extends ChangeNotifier {
  bool mode = true; //0 for light and 1 for dark
  Color primaryBackgroundColor = Colors.white;
  Color appBarBackgroundColor = Colors.cyan[200];
  Color BoxColor = Colors.blue[50];
  Color BoxTextColor = Colors.indigo;
  Color primaryTextColor = Colors.white;
  Color dashboardColor = Colors.cyan;
  Color dashboardTextColor = Colors.red[600];
  Color dashboardIconColor = Colors.yellow[200];
  //Color typeMessageBoxColor = Colors.grey[200];

  switchMode() {
    if (mode == true) {
      //if it is light mode currently switch to dark
      primaryBackgroundColor = Colors.grey[900];
      appBarBackgroundColor = Colors.grey[800];
      // BoxColor = Colors.grey[600];
      BoxColor = Colors.black;
      BoxTextColor = Colors.grey[100];
      primaryTextColor = Colors.black;
      dashboardColor = Colors.grey[900];
      dashboardTextColor = Colors.grey[400];
      dashboardIconColor = Colors.white;
      //typeMessageBoxColor = Colors.grey[800];
      mode = false;
    } else {
      //if it is dark mode currently switch to light
      primaryBackgroundColor = Colors.white;
      appBarBackgroundColor = Colors.cyan[200];
      BoxColor = Colors.tealAccent;
      BoxTextColor = Colors.indigo;
      primaryTextColor = Colors.white;
      dashboardColor = Colors.cyan;
      dashboardTextColor = Colors.red[600];
      dashboardIconColor = Colors.yellow[200];
      //typeMessageBoxColor = Colors.grey[200];
      mode = true;
    }

    notifyListeners();
  }
}

以下是用于更改明暗主题的开关。该开关无法正常工作,代码中是否有任何错误。代替使用按钮进行开关,它可以正常工作。

import 'package:provider/provider.dart';
import '../FreelanceTheme/AppStyleModeNotifier.dart';

class HomePage extends StatelessWidget with NavigationStates {

  const HomePage({Key key,this.onMenuTap}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final appStyleMode = Provider.of<AppStyleModeNotifier>(context);
    return MaterialApp(
      home: Scaffold(
        backgroundColor: Color(0xffE5E5E5),appBar: AppBar(
          elevation: 0,backgroundColor: appStyleMode.appBarBackgroundColor,actions: <Widget>[
            Switch(
              value: appStyleMode.mode,onChanged: appStyleMode.switchMode(),),

解决方法

将您的代码更改为此即可。

Switch(
  value: appStyleMode.mode,onChanged: (value)=> appStyleMode.switchMode(),),

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。