新手学习笔记DAY11：学习将“GitCode 口袋工具”启用深色模式

本人的学习灵感源自 CSDN 博主 A 懿轩 A（博客链接：https://blog.csdn.net/2301_80035882?type=blog）。博主围绕【2025 版 OpenHarmony】GitCode 口袋工具系列开发内容，兼具实用性与指导性，极具参考和学习意义。在此基础上所有内容均为个人实操总结，尊重原作者知识产权，特此标注。

1、首先我们将华为模拟器调为深色模式

2、然后新增一个app_theme.dart文件，具体路径是lib/core/app_theme.dart，文件创建完毕后将下列代码添加到该文件中。

import 'package:flutter/material.dart'; /// 统一管理浅色/深色主题，方便在 HarmonyOS 上适配系统夜间模式。 class AppTheme { AppTheme._(); static const Color _seedColor = Colors.indigo; static ThemeData light() => _theme(Brightness.light); static ThemeData dark() => _theme(Brightness.dark); static ThemeData _theme(Brightness brightness) { final colorScheme = ColorScheme.fromSeed( seedColor: _seedColor, brightness: brightness, ); final isDark = brightness == Brightness.dark; return ThemeData( colorScheme: colorScheme, useMaterial3: true, visualDensity: VisualDensity.standard, brightness: brightness, scaffoldBackgroundColor: colorScheme.surface, appBarTheme: AppBarTheme( backgroundColor: colorScheme.surface, foregroundColor: colorScheme.onSurface, centerTitle: true, elevation: 0, ), navigationBarTheme: NavigationBarThemeData( backgroundColor: colorScheme.surfaceContainerHigh, indicatorColor: colorScheme.primary.withValues(alpha: isDark ? 0.35 : 0.2), labelBehavior: NavigationDestinationLabelBehavior.alwaysShow, ), cardTheme: CardTheme( color: colorScheme.surfaceContainerLowest, elevation: 0, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(20), ), ), inputDecorationTheme: InputDecorationTheme( border: OutlineInputBorder( borderRadius: BorderRadius.circular(16), borderSide: BorderSide(color: colorScheme.outlineVariant), ), enabledBorder: OutlineInputBorder( borderRadius: BorderRadius.circular(16), borderSide: BorderSide(color: colorScheme.outlineVariant), ), focusedBorder: OutlineInputBorder( borderRadius: BorderRadius.circular(16), borderSide: BorderSide(color: colorScheme.primary, width: 1.4), ), filled: true, fillColor: colorScheme.surfaceContainerLowest, labelStyle: TextStyle(color: colorScheme.onSurfaceVariant), hintStyle: TextStyle( color: colorScheme.onSurfaceVariant.withValues(alpha: 0.7), ), prefixIconColor: colorScheme.onSurfaceVariant, ), chipTheme: ChipThemeData( backgroundColor: colorScheme.surfaceContainerHigh, selectedColor: colorScheme.primary.withValues(alpha: 0.2), shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(24), ), labelStyle: TextStyle(color: colorScheme.onSurface), ), dividerTheme: DividerThemeData( color: colorScheme.outlineVariant.withValues(alpha: 0.7), thickness: 1, ), ); } }

3、然后修改main.dart文件，MaterialApp跟随系统模式，可同时拥有亮/暗主题，并通过ThemeMode.system跟随HarmonyOS/Windows 的系统设置，修改代码：

return MaterialApp( title: 'GitCode 口袋工具', theme: AppTheme.light(), darkTheme: AppTheme.dark(), themeMode: ThemeMode.system, home: const MainNavigationPage(), );

记得添加导入文件，否则会报错！

import 'package:gitcode_pocket_tool/core/app_theme.dart';

4、最后修改search_page.dart文件，修改代码：

return _InfoBanner( icon: Icons.error_outline, background: scheme.errorContainer, textColor: scheme.onErrorContainer, message: _errorMessage!, );

5、运行实例：