fix(ui): 修复主题切换功能,支持明暗主题动态切换

- 替换所有硬编码颜色为动态颜色
- 所有页面使用 Theme.of(context) 获取主题颜色
- 支持深色和浅色主题切换
- 修复 GlassPanel 和 NeonGlow 组件的主题适配
- 完善 lightMaterial ColorScheme 定义
- 测试主题切换功能正常

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-24 02:50:25 +08:00
parent 7bb426b3d8
commit a65aa0fa86
94 changed files with 17889 additions and 17478 deletions

View File

@@ -42,9 +42,10 @@ class _MinePageState extends State<MinePage> with AutomaticKeepAliveClientMixin
@override
Widget build(BuildContext context) {
super.build(context);
final colorScheme = Theme.of(context).colorScheme;
return Scaffold(
backgroundColor: AppColorScheme.darkBackground,
backgroundColor: colorScheme.background,
body: Consumer<AuthProvider>(
builder: (context, auth, _) {
return SingleChildScrollView(
@@ -62,7 +63,7 @@ class _MinePageState extends State<MinePage> with AutomaticKeepAliveClientMixin
'System Build v1.0.0-Neo',
style: TextStyle(
fontSize: 10,
color: AppColorScheme.darkOnSurfaceVariant.withValues(alpha: 0.4),
color: colorScheme.onSurfaceVariant.withOpacity(0.4),
letterSpacing: 0.3,
),
),
@@ -97,6 +98,7 @@ class _MinePageState extends State<MinePage> with AutomaticKeepAliveClientMixin
}
void _showAboutDialog() {
final colorScheme = Theme.of(context).colorScheme;
showShadDialog(
context: context,
builder: (context) => ShadDialog(
@@ -113,7 +115,7 @@ class _MinePageState extends State<MinePage> with AutomaticKeepAliveClientMixin
children: [
Text(
'虚拟货币模拟交易平台',
style: TextStyle(color: AppColorScheme.darkOnSurfaceVariant),
style: TextStyle(color: colorScheme.onSurfaceVariant),
),
SizedBox(height: AppSpacing.md),
_InfoRow(icon: Icons.code, text: '版本: 1.0.0'),
@@ -169,6 +171,9 @@ class _UserCard extends StatelessWidget {
@override
Widget build(BuildContext context) {
final colorScheme = Theme.of(context).colorScheme;
final isDark = Theme.of(context).brightness == Brightness.dark;
return GlassPanel(
padding: EdgeInsets.all(AppSpacing.lg + AppSpacing.sm),
child: Row(
@@ -181,7 +186,7 @@ class _UserCard extends StatelessWidget {
shape: BoxShape.circle,
boxShadow: [
BoxShadow(
color: AppColorScheme.neonGlowPrimary,
color: colorScheme.primary.withOpacity(isDark ? 0.15 : 0.08),
blurRadius: 20,
),
],
@@ -195,17 +200,17 @@ class _UserCard extends StatelessWidget {
child: Container(
padding: EdgeInsets.all(4),
decoration: BoxDecoration(
color: AppColorScheme.darkTertiary,
color: AppColorScheme.up,
shape: BoxShape.circle,
border: Border.all(
color: AppColorScheme.darkBackground,
color: colorScheme.background,
width: 2,
),
),
child: Icon(
Icons.verified,
size: 14,
color: AppColorScheme.darkOnTertiary,
color: colorScheme.onTertiary,
),
),
),
@@ -221,7 +226,7 @@ class _UserCard extends StatelessWidget {
style: GoogleFonts.spaceGrotesk(
fontSize: 24,
fontWeight: FontWeight.bold,
color: AppColorScheme.darkOnSurface,
color: colorScheme.onSurface,
),
),
SizedBox(height: AppSpacing.sm),
@@ -232,10 +237,10 @@ class _UserCard extends StatelessWidget {
vertical: AppSpacing.xs,
),
decoration: BoxDecoration(
color: AppColorScheme.darkPrimary.withValues(alpha: 0.1),
color: colorScheme.primary.withOpacity(0.1),
borderRadius: BorderRadius.circular(AppRadius.full),
border: Border.all(
color: AppColorScheme.darkPrimary.withValues(alpha: 0.2),
color: colorScheme.primary.withOpacity(0.2),
),
),
child: Text(
@@ -244,7 +249,7 @@ class _UserCard extends StatelessWidget {
fontSize: 10,
fontWeight: FontWeight.w700,
letterSpacing: 0.2,
color: AppColorScheme.darkPrimary,
color: colorScheme.primary,
),
),
),
@@ -253,7 +258,7 @@ class _UserCard extends StatelessWidget {
),
Icon(
LucideIcons.chevronRight,
color: AppColorScheme.darkOnSurfaceVariant,
color: colorScheme.onSurfaceVariant,
),
],
),
@@ -271,14 +276,16 @@ class _AppLogo extends StatelessWidget {
@override
Widget build(BuildContext context) {
final colorScheme = Theme.of(context).colorScheme;
return CircleAvatar(
radius: radius,
backgroundColor: AppColorScheme.darkPrimary.withValues(alpha: 0.2),
backgroundColor: colorScheme.primary.withOpacity(0.2),
child: Text(
text ?? '',
style: TextStyle(
fontSize: fontSize,
color: AppColorScheme.darkPrimary,
color: colorScheme.primary,
fontWeight: FontWeight.bold,
),
),
@@ -295,15 +302,17 @@ class _InfoRow extends StatelessWidget {
@override
Widget build(BuildContext context) {
final colorScheme = Theme.of(context).colorScheme;
return Row(
children: [
Icon(icon, size: 14, color: AppColorScheme.darkOnSurfaceVariant),
Icon(icon, size: 14, color: colorScheme.onSurfaceVariant),
SizedBox(width: AppSpacing.sm),
Text(
text,
style: TextStyle(
fontSize: 12,
color: AppColorScheme.darkOnSurfaceVariant,
color: colorScheme.onSurfaceVariant,
),
),
],
@@ -321,6 +330,7 @@ class _MenuList extends StatelessWidget {
@override
Widget build(BuildContext context) {
final themeProvider = context.watch<ThemeProvider>();
final colorScheme = Theme.of(context).colorScheme;
return GlassPanel(
padding: EdgeInsets.zero,
@@ -331,7 +341,7 @@ class _MenuList extends StatelessWidget {
_ThemeToggleTile(isDarkMode: themeProvider.isDarkMode),
_buildDivider(),
// 菜单项
..._buildMenuItems(),
..._buildMenuItems(colorScheme),
],
),
);
@@ -345,41 +355,41 @@ class _MenuList extends StatelessWidget {
);
}
List<Widget> _buildMenuItems() {
List<Widget> _buildMenuItems(ColorScheme colorScheme) {
final items = [
_MenuItem(
icon: LucideIcons.userCheck,
title: '实名认证',
subtitle: '完成实名认证,解锁更多功能',
iconColor: AppColorScheme.darkPrimary,
iconColor: colorScheme.primary,
onTap: () => onShowComingSoon('实名认证'),
),
_MenuItem(
icon: LucideIcons.shield,
title: '安全设置',
subtitle: '密码、二次验证等安全设置',
iconColor: AppColorScheme.darkSecondary,
iconColor: colorScheme.secondary,
onTap: () => onShowComingSoon('安全设置'),
),
_MenuItem(
icon: LucideIcons.bell,
title: '消息通知',
subtitle: '管理消息推送设置',
iconColor: AppColorScheme.darkTertiary,
iconColor: AppColorScheme.up,
onTap: () => onShowComingSoon('消息通知'),
),
_MenuItem(
icon: LucideIcons.settings,
title: '系统设置',
subtitle: '主题、语言等偏好设置',
iconColor: AppColorScheme.darkPrimary,
iconColor: colorScheme.primary,
onTap: () => onShowComingSoon('系统设置'),
),
_MenuItem(
icon: LucideIcons.info,
title: '关于我们',
subtitle: '版本信息与用户协议',
iconColor: AppColorScheme.darkOnSurfaceVariant,
iconColor: colorScheme.onSurfaceVariant,
onTap: onShowAbout,
),
];
@@ -401,6 +411,7 @@ class _ThemeToggleTile extends StatelessWidget {
@override
Widget build(BuildContext context) {
final colorScheme = Theme.of(context).colorScheme;
final themeProvider = context.read<ThemeProvider>();
return InkWell(
@@ -414,7 +425,7 @@ class _ThemeToggleTile extends StatelessWidget {
children: [
_MenuIcon(
icon: isDarkMode ? LucideIcons.moon : LucideIcons.sun,
color: AppColorScheme.darkPrimary,
color: colorScheme.primary,
),
SizedBox(width: AppSpacing.sm + AppSpacing.xs),
Expanded(
@@ -426,7 +437,7 @@ class _ThemeToggleTile extends StatelessWidget {
style: GoogleFonts.spaceGrotesk(
fontSize: 14,
fontWeight: FontWeight.w500,
color: AppColorScheme.darkOnSurface,
color: colorScheme.onSurface,
),
),
SizedBox(height: AppSpacing.xs / 2),
@@ -434,7 +445,7 @@ class _ThemeToggleTile extends StatelessWidget {
isDarkMode ? '当前:深色主题' : '当前:浅色主题',
style: TextStyle(
fontSize: 11,
color: AppColorScheme.darkOnSurfaceVariant,
color: colorScheme.onSurfaceVariant,
),
),
],
@@ -443,8 +454,8 @@ class _ThemeToggleTile extends StatelessWidget {
Switch(
value: isDarkMode,
onChanged: (_) => themeProvider.toggleTheme(),
activeTrackColor: AppColorScheme.darkPrimary.withValues(alpha: 0.5),
activeColor: AppColorScheme.darkPrimary,
activeTrackColor: colorScheme.primary.withOpacity(0.5),
activeColor: colorScheme.primary,
),
],
),
@@ -461,6 +472,8 @@ class _MenuItemTile extends StatelessWidget {
@override
Widget build(BuildContext context) {
final colorScheme = Theme.of(context).colorScheme;
return InkWell(
onTap: item.onTap,
child: Padding(
@@ -481,7 +494,7 @@ class _MenuItemTile extends StatelessWidget {
style: GoogleFonts.spaceGrotesk(
fontSize: 14,
fontWeight: FontWeight.w500,
color: AppColorScheme.darkOnSurface,
color: colorScheme.onSurface,
),
),
if (item.subtitle != null) ...[
@@ -490,7 +503,7 @@ class _MenuItemTile extends StatelessWidget {
item.subtitle!,
style: TextStyle(
fontSize: 11,
color: AppColorScheme.darkOnSurfaceVariant,
color: colorScheme.onSurfaceVariant,
),
),
],
@@ -500,7 +513,7 @@ class _MenuItemTile extends StatelessWidget {
Icon(
LucideIcons.chevronRight,
size: 18,
color: AppColorScheme.darkOnSurfaceVariant,
color: colorScheme.onSurfaceVariant,
),
],
),
@@ -518,16 +531,17 @@ class _MenuIcon extends StatelessWidget {
@override
Widget build(BuildContext context) {
final iconColor = color ?? AppColorScheme.darkPrimary;
final colorScheme = Theme.of(context).colorScheme;
final iconColor = color ?? colorScheme.primary;
return Container(
width: 40,
height: 40,
decoration: BoxDecoration(
color: iconColor.withValues(alpha: 0.1),
color: iconColor.withOpacity(0.1),
borderRadius: BorderRadius.circular(AppRadius.md + AppSpacing.xs),
border: Border.all(
color: iconColor.withValues(alpha: 0.2),
color: iconColor.withOpacity(0.2),
),
),
child: Icon(icon, size: 20, color: iconColor),