Flutter Theme 使用 onpress 事件将暗色变为亮色

Question

我正在处理 flutter 项目我想使用 onpressed 事件

更改主题颜色

我尝试了一些代码但没有用。

main.dart 文件

import 'package:flutter/material.dart';
import 'Screens/HomePage.dart';

void main()=>  runApp(MyApp());

ThemeData _lightTheme = ThemeData(
  brightness: Brightness.light,
  primaryColor: Colors.white,
);
ThemeData _darkTheme = ThemeData(
  brightness: Brightness.light,
  primaryColor: Colors.white,
);
bool _ktheme = true;

class MyApp extends StatelessWidget {
 
 @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Wallbay',
      theme: _ktheme ? _lightTheme : _darkTheme,
      home: MyHomePage('Alpha Papers'),
    );
  }
}

HomePage.dart 文件

........
      IconButton(
        icon: Icon(Icons.brightness_medium_outlined),
        onPressed: () {
          setState(() {
            _ktheme = !ktheme;
          });
        },
      )
......

Answer 1

您的主题对象 _lightTheme 和 _darkTheme 是相同的对象，但名称不同。

他们都将 brightness 设置为 Brightness.light & primaryColor 为 Colors.white。

ThemeData _lightTheme = ThemeData(
  brightness: Brightness.light, // <----
  primaryColor: Colors.white, // <----
);
ThemeData _darkTheme = ThemeData(
  brightness: Brightness.light, // <--- Dark mode having light brightness
  primaryColor: Colors.white, // <---- Dark mode having white color
);

将这些更改为以下内容：

ThemeData _lightTheme = ThemeData(
  brightness: Brightness.light, // light mode
  primaryColor: Colors.white,
);
ThemeData _darkTheme = ThemeData(
  brightness: Brightness.dark, // dark mode
  primaryColor: Colors.black,
);

此外，您的 onPressed 代码看起来有误。

setState(() {
  _ktheme = !_ktheme; // Notice: I renamed ktheme to _ktheme
});

Flutter Theme 使用 onpress 事件将暗色变为亮色

Flutter Theme Changing dark to light using onpress event

themes

dart

flutter