264 lines
9.2 KiB
Dart
264 lines
9.2 KiB
Dart
import 'package:flutter/material.dart';
|
||
import 'package:shared_preferences/shared_preferences.dart';
|
||
import '../theme/app_theme.dart';
|
||
|
||
class AppearanceSettingsScreen extends StatefulWidget {
|
||
const AppearanceSettingsScreen({super.key});
|
||
|
||
@override
|
||
State<AppearanceSettingsScreen> createState() => _AppearanceSettingsScreenState();
|
||
}
|
||
|
||
class _AppearanceSettingsScreenState extends State<AppearanceSettingsScreen> {
|
||
ThemeMode _themeMode = ThemeMode.system;
|
||
double _fontSize = 1.0; // 1.0 = 正常,0.8 = 小,1.2 = 大
|
||
|
||
@override
|
||
void initState() {
|
||
super.initState();
|
||
_loadSettings();
|
||
}
|
||
|
||
Future<void> _loadSettings() async {
|
||
final prefs = await SharedPreferences.getInstance();
|
||
final themeModeIndex = prefs.getInt('theme_mode') ?? 0;
|
||
setState(() {
|
||
_themeMode = ThemeMode.values[themeModeIndex];
|
||
_fontSize = prefs.getDouble('font_size') ?? 1.0;
|
||
});
|
||
}
|
||
|
||
Future<void> _saveSettings() async {
|
||
final prefs = await SharedPreferences.getInstance();
|
||
await prefs.setInt('theme_mode', _themeMode.index);
|
||
await prefs.setDouble('font_size', _fontSize);
|
||
}
|
||
|
||
@override
|
||
Widget build(BuildContext context) {
|
||
final theme = Theme.of(context);
|
||
|
||
return Scaffold(
|
||
appBar: AppBar(
|
||
title: const Text('外观设置'),
|
||
),
|
||
body: SingleChildScrollView(
|
||
padding: const EdgeInsets.all(16),
|
||
child: Column(
|
||
crossAxisAlignment: CrossAxisAlignment.start,
|
||
children: [
|
||
// 主题模式
|
||
Card(
|
||
child: Padding(
|
||
padding: const EdgeInsets.all(16),
|
||
child: Column(
|
||
crossAxisAlignment: CrossAxisAlignment.start,
|
||
children: [
|
||
Row(
|
||
children: [
|
||
Icon(Icons.palette, color: AppTheme.primaryColor),
|
||
const SizedBox(width: 8),
|
||
Text(
|
||
'主题模式',
|
||
style: theme.textTheme.titleMedium?.copyWith(
|
||
fontWeight: FontWeight.w600,
|
||
),
|
||
),
|
||
],
|
||
),
|
||
const SizedBox(height: 16),
|
||
RadioListTile<ThemeMode>(
|
||
title: const Text('跟随系统'),
|
||
subtitle: const Text('根据系统设置自动切换'),
|
||
value: ThemeMode.system,
|
||
groupValue: _themeMode,
|
||
onChanged: (value) {
|
||
if (value != null) {
|
||
setState(() {
|
||
_themeMode = value;
|
||
});
|
||
_saveSettings();
|
||
// 通知应用更新主题
|
||
// 注意:这需要重启应用或使用 Provider 来管理主题
|
||
}
|
||
},
|
||
),
|
||
RadioListTile<ThemeMode>(
|
||
title: const Text('浅色模式'),
|
||
subtitle: const Text('始终使用浅色主题'),
|
||
value: ThemeMode.light,
|
||
groupValue: _themeMode,
|
||
onChanged: (value) {
|
||
if (value != null) {
|
||
setState(() {
|
||
_themeMode = value;
|
||
});
|
||
_saveSettings();
|
||
}
|
||
},
|
||
),
|
||
RadioListTile<ThemeMode>(
|
||
title: const Text('深色模式'),
|
||
subtitle: const Text('始终使用深色主题'),
|
||
value: ThemeMode.dark,
|
||
groupValue: _themeMode,
|
||
onChanged: (value) {
|
||
if (value != null) {
|
||
setState(() {
|
||
_themeMode = value;
|
||
});
|
||
_saveSettings();
|
||
}
|
||
},
|
||
),
|
||
],
|
||
),
|
||
),
|
||
),
|
||
const SizedBox(height: 16),
|
||
|
||
// 字体大小
|
||
Card(
|
||
child: Padding(
|
||
padding: const EdgeInsets.all(16),
|
||
child: Column(
|
||
crossAxisAlignment: CrossAxisAlignment.start,
|
||
children: [
|
||
Row(
|
||
children: [
|
||
Icon(Icons.text_fields, color: AppTheme.primaryColor),
|
||
const SizedBox(width: 8),
|
||
Text(
|
||
'字体大小',
|
||
style: theme.textTheme.titleMedium?.copyWith(
|
||
fontWeight: FontWeight.w600,
|
||
),
|
||
),
|
||
],
|
||
),
|
||
const SizedBox(height: 16),
|
||
Text(
|
||
'当前大小: ${_getFontSizeLabel(_fontSize)}',
|
||
style: theme.textTheme.bodyMedium,
|
||
),
|
||
const SizedBox(height: 16),
|
||
Slider(
|
||
value: _fontSize,
|
||
min: 0.8,
|
||
max: 1.2,
|
||
divisions: 4,
|
||
label: _getFontSizeLabel(_fontSize),
|
||
onChanged: (value) {
|
||
setState(() {
|
||
_fontSize = value;
|
||
});
|
||
_saveSettings();
|
||
},
|
||
),
|
||
Row(
|
||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||
children: [
|
||
Text(
|
||
'小',
|
||
style: theme.textTheme.bodySmall?.copyWith(
|
||
fontSize: 12 * _fontSize,
|
||
),
|
||
),
|
||
Text(
|
||
'正常',
|
||
style: theme.textTheme.bodyMedium?.copyWith(
|
||
fontSize: 14 * _fontSize,
|
||
),
|
||
),
|
||
Text(
|
||
'大',
|
||
style: theme.textTheme.bodyLarge?.copyWith(
|
||
fontSize: 16 * _fontSize,
|
||
),
|
||
),
|
||
],
|
||
),
|
||
],
|
||
),
|
||
),
|
||
),
|
||
const SizedBox(height: 16),
|
||
|
||
// 图表样式(占位,未来功能)
|
||
Card(
|
||
child: Padding(
|
||
padding: const EdgeInsets.all(16),
|
||
child: Column(
|
||
crossAxisAlignment: CrossAxisAlignment.start,
|
||
children: [
|
||
Row(
|
||
children: [
|
||
Icon(Icons.bar_chart, color: AppTheme.primaryColor),
|
||
const SizedBox(width: 8),
|
||
Text(
|
||
'图表样式',
|
||
style: theme.textTheme.titleMedium?.copyWith(
|
||
fontWeight: FontWeight.w600,
|
||
),
|
||
),
|
||
],
|
||
),
|
||
const SizedBox(height: 16),
|
||
ListTile(
|
||
title: const Text('图表颜色主题'),
|
||
subtitle: const Text('默认主题'),
|
||
trailing: const Icon(Icons.chevron_right),
|
||
onTap: () {
|
||
ScaffoldMessenger.of(context).showSnackBar(
|
||
const SnackBar(
|
||
content: Text('此功能正在开发中'),
|
||
),
|
||
);
|
||
},
|
||
),
|
||
],
|
||
),
|
||
),
|
||
),
|
||
const SizedBox(height: 24),
|
||
|
||
// 说明
|
||
Card(
|
||
color: AppTheme.infoColor.withOpacity(0.1),
|
||
child: Padding(
|
||
padding: const EdgeInsets.all(16),
|
||
child: Row(
|
||
crossAxisAlignment: CrossAxisAlignment.start,
|
||
children: [
|
||
Icon(Icons.info_outline, color: AppTheme.infoColor),
|
||
const SizedBox(width: 12),
|
||
Expanded(
|
||
child: Text(
|
||
'主题模式更改需要重启应用才能生效。字体大小更改会立即生效。',
|
||
style: theme.textTheme.bodySmall?.copyWith(
|
||
color: theme.colorScheme.onSurface.withOpacity(0.7),
|
||
),
|
||
),
|
||
),
|
||
],
|
||
),
|
||
),
|
||
),
|
||
],
|
||
),
|
||
),
|
||
);
|
||
}
|
||
|
||
String _getFontSizeLabel(double size) {
|
||
if (size <= 0.9) {
|
||
return '小';
|
||
} else if (size <= 1.1) {
|
||
return '正常';
|
||
} else {
|
||
return '大';
|
||
}
|
||
}
|
||
}
|
||
|