标签: flutter-theme

我想设置LicensePage除某些颜色之外的每个屏幕的背景颜色，因此我scaffoldBackbroundColor通过如下theme参数指定了。MaterialApp

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(scaffoldBackgroundColor: Colors.blue.shade200),
      home: HomeScreen(),
    );
  }
}

这也会更改许可证页面的背景颜色，因此为了将其改回白色，我尝试覆盖scaffoldBackbroundColor，但它不起作用。

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Theme(
        data: Theme.of(context).copyWith(scaffoldBackgroundColor: Colors.white),
        child: Center(
          child: RaisedButton(
            child: const Text('Show licenses'),
            onPressed: () => showLicensePage(context: context),
          ),
        ),
      ),
    );
  }
}

我该怎么做？

如果主题在 main.dart 中设置为

return MaterialApp(
  title: 'MY APP',
  theme: ThemeData(
    primarySwatch: Colors.blue,
    fontFamily: 'Cabin',
    textTheme: TextTheme(
      headline1: TextStyle(
        fontFamily: 'Raleway',
        color: Colors.black,
        fontWeight: FontWeight.w600,
        fontSize: 18,
      ),
      subtitle1: TextStyle(
        fontFamily: 'Raleway',
        color: Colors.black54,
        fontWeight: FontWeight.w600,
        fontSize: 16,
      ),
    ),
  ),

我使用主题作为

Text('MY STRING',
    style: Theme.of(context).textTheme.subtitle1),

如何使“我的字符串”的颜色与 subtitle1 主题颜色不同，同时保留主题数据的其他属性，例如字体粗细、系列和大小等？

我是新来的颤振和尝试的东西。

我用一个中心小部件替换了脚手架小部件（只是乱搞）。所有文本都有一个黄色下划线，为了克服这个我用TextDecoration

Text(
    friend.name,
    style: TextStyle(
        decoration: TextDecoration.none
    ),
));

但这对于所有 Text 小部件都是必需的，因此我尝试通过在根 MaterialApp 中设置 Theme 数据来为所有 Text 小部件通用设置它。

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp( 
      title: 'Friends List',
      theme: ThemeData(
        primaryColor: Colors.black,
        primarySwatch: Colors.teal,
        primaryTextTheme: TextTheme(
          headline1: TextStyle(color: Colors.green, decoration: TextDecoration.none),
         headline2: TextStyle(color: Colors.green, decoration: TextDecoration.none),
         headline3: TextStyle(color: Colors.green, decoration: TextDecoration.none),
         headline4: TextStyle(color: Colors.green, decoration: TextDecoration.none),
         headline5: TextStyle(color: Colors.green, decoration: TextDecoration.none),
         headline6: TextStyle(color: Colors.green, …

我已经使用提供程序来更改主题，这是浅色和深色主题的代码。我的问题的主要目的是通过开关而不是按钮来更改主题。可以使用“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]; …

我想创建自己的主题属性，可以在运行时动态设置。我尝试为 TextTheme 创建一个扩展，如下所示：

extension CustomTextTheme on TextTheme {
  TextStyle get heading => themeMode == ThemeMode.light
      ? TextStyle(
          color: GlobalTheme.defaultLightTheme.textTheme.headline.color,
          fontSize: GlobalTheme.defaultLightTheme.textTheme.headline.fontSize,
        )
      : TextStyle(
          color: GlobalTheme.defaultDarkTheme.textTheme.headline.color,
          fontSize: GlobalTheme.defaultLightTheme.textTheme.headline.fontSize,
        );
}

问题是我如何动态更改运行时的扩展属性。我想要归档的是，我可以从服务器加载“主题配置”并在每个设备上动态设置该主题。