Question

我正在开发一款应用程序，它会根据系统主题更改其主题数据，即，如果用户为设备启用了暗模式，则该应用程序将自动更改为暗模式，反之亦然。还要更改App的文本颜色。

我创建了自定义文本主题，因为我不想更改默认的 TextThemeData 。相同的代码如下

text_themes.dart

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

extension CustomTextStyles on TextTheme {

  TextStyle get h1 {
    return TextStyle(
      fontSize: 24.0,
      fontWeight: FontWeight.bold,
    );
  }

  TextStyle get d1 {
    return TextStyle(
      fontSize: 16.0,
      fontWeight: FontWeight.bold,
      color: Brightness.dark == null ? Colors.blue:Colors.white,
    );
  }
  TextStyle get d2 {
    return TextStyle(fontSize: 16.0);
  }
}

问题在于，每当我切换主题时，文本颜色就不会改变。我尝试使用 color: ThemeData.dark() == null ? Colors.blue[800] : Colors.white, 和 color: Brightness.dark() == null ? Colors.blue[800] : Colors.white, 但没有任何效果。

This Is My Expected Output after above lines of code

This is My Current Output

Main.dart

import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/material.dart';
import 'package:kjssc/models/user_data.dart';
import 'package:kjssc/screens/edit_profile_screen.dart';
import 'package:kjssc/screens/home_screen.dart';
import 'package:kjssc/screens/sign_up_screen.dart';
import 'package:provider/provider.dart';
import 'screens/login_screen.dart';
import 'screens/sign_up_in_screen.dart';
import 'package:shared_preferences/shared_preferences.dart';

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

class MyApp extends StatelessWidget {
  static SharedPreferences mainSharedPreferences;

  Widget _getScreenID() {
    return StreamBuilder<FirebaseUser>(
      stream: FirebaseAuth.instance.onAuthStateChanged,
      builder: (BuildContext context, snapshot) {
        if (snapshot.hasData) {
          Provider.of<UserData>(context).currentUserID = snapshot.data.uid;
          return HomeScreen();
        } else {
          return SignUpInScreen();
        }
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
      create: (context) => UserData(),
      child: MaterialApp(
        title: 'My KJSSC',
        debugShowCheckedModeBanner: false,
        home: _getScreenID(),
        // theme: state.themeData,
        theme: ThemeData(
          brightness: Brightness.light,
          indicatorColor: Colors.white,
          primaryColor: Colors.lightBlue[800],
          primaryIconTheme: IconThemeData(
            color: Colors.white,
          ),
          tabBarTheme: TabBarTheme(
            labelColor: Colors.white,
            unselectedLabelColor: Colors.white70,
            indicatorSize: TabBarIndicatorSize.tab,
            labelStyle: TextStyle(fontWeight: FontWeight.bold),
          ),
        ),
        darkTheme: ThemeData(
          brightness: Brightness.dark,
          indicatorColor: Colors.white,
          primaryIconTheme: IconThemeData(
            color: Colors.white,
          ),
          tabBarTheme: TabBarTheme(
            labelColor: Colors.white,
            unselectedLabelColor: Colors.white54,
            indicatorSize: TabBarIndicatorSize.tab,
            labelStyle: TextStyle(fontWeight: FontWeight.bold),
          ),
        ),

        routes: {
          LoginScreen.id: (context) => LoginScreen(),
          SignupScreen.id: (context) => SignupScreen(),
          EditProfileScreen.id: (context) => EditProfileScreen(),
        },
      ),
    );
  }
}

homescreen.dart（代码段）

child: Row(
  children: <Widget>[
    Container(
      child: Text(
        'Email Id : ',
         style: Theme.of(context).textTheme.d1
      ),
    ),
    Container(
      child: Text(
        'user1@gmail.com',
         style: Theme.of(context).textTheme.d2,
         overflow: TextOverflow.ellipsis,
    ),
   ),
  ],
),

如何在Flutter中使用主题更改来更改文本颜色

0 个答案: