Flutter 颤振如何设置为按下以更改主题数据？

我想使用此按钮将主题更改为深色主题并返回浅色主题：

IconButton(

       icon: Icon(
        Icons.brightness,
        ),
       onPressed: () {
       setState(() {
       // Change to dark theme?
        } else {
       //Change it back to default light theme //How?
  }
}
);

主飞镖

MaterialApp(

  theme: ThemeData(
  ),
  darkTheme: ThemeData(
    brightness: Brightness.dark,
  ),

---

您可以使用

themeMode

属性选择要使用的主题。它有三个可能的值：

• 幻灯
• 黑暗
• ThemeMode.system

现在的问题是如何更改按钮点击

坏方法
将

themeMode

的值保留在变量中，并使用该变量，而不是直接设置

themeMode

。单击按钮更改状态，如：

setState（）{
themeModeVariable=ThemeMode.dark；
});

为什么这样不好？假设您的按钮位于其他位置，而不是MaterialApp所在的位置。你走得越深，面临的问题就越多

好方法
这个概念仍然是一样的，但是您使用状态管理解决方案来处理这个问题。你可以使用或其他任何东西

---

我强烈建议您首先学习状态管理解决方案。检查“材质”主题中的“第一个”是否设置为“条件” （可能是您在主类中定义的）

导入'dart:async'；
进口“包装：颤振/材料.省道”；
StreamController setTheme=StreamController（）；
main（）{
runApp（MyApp（））；
}
类MyApp扩展了无状态小部件{
@凌驾
小部件构建（构建上下文）{
返回流生成器(
initialData:true，
stream:setTheme.stream，
生成器：（上下文，快照）{
返回材料PP(
主题：snapshot.data？主题数据.light（）：主题数据.dark（），
debugShowCheckedModeBanner:false，
家：脚手架(
appBar:appBar（标题：文本（“您的主题”）），
body:YourButtonPage（））；/*使用类更改此名称*/
});
}
}
类YourButtonPage扩展无状态小部件{
@凌驾
小部件构建（构建上下文）{
返回填充(
填充：常数边集全部（16.0），
儿童：中心(
孩子：排(
mainAxisAlignment:mainAxisAlignment.center，
儿童：[
图标按钮(
图标：图标(
图标。亮度低，
尺码：21，
),
对齐：对齐.center，
已按下：（）{
setTheme.add（true）；
}),
图标按钮(
图标：图标(
图标。亮度_1，
尺码：21，
),
对齐：对齐.center，
已按下：（）{
setTheme.add（false）；
}),
])));
}
}

参考此代码，您将找到解决方案，

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

StreamController<bool> setTheme = StreamController();

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return StreamBuilder<bool>(
        initialData: true,
        stream: setTheme.stream,
        builder: (context, snapshot) {
          return MaterialApp(
              theme: snapshot.data ? ThemeData.light() : ThemeData.dark(),
              debugShowCheckedModeBanner: false,
              home: Scaffold(
                  appBar: AppBar(title: Text("Your Theme")),
                  body: YourButtonPage()));/*Change this name with Your class*/
        });
  }
}

class YourButtonPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Padding(
        padding: const EdgeInsets.all(16.0),
        child: Center(
            child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
              IconButton(
                  icon: Icon(
                    Icons.brightness_low,
                    size: 21,
                  ),
                  alignment: Alignment.center,
                  onPressed: () {
                    setTheme.add(true);
                  }),
              IconButton(
                  icon: Icon(
                    Icons.brightness_1,
                    size: 21,
                  ),
                  alignment: Alignment.center,
                  onPressed: () {
                    setTheme.add(false);
                  }),
            ])));
  }
}