Files
social-app/apps/lib/features/settings/ui/screens/settings_screen.dart
T
qzl 05f972e98a refactor(apps): migrate hardcoded colors to AppColors tokens
- Replace Color(0xFFF8FAFC) with AppColors.surfaceSecondary (11 uses)
- Replace Color(0xFFF8FAFF) with AppColors.surfaceTertiary (9 uses)
- Replace Color(0xFFE2E8F0) with AppColors.borderSecondary (5 uses)
- Replace Color(0xFFDCE5F4) with AppColors.borderTertiary (5 uses)
- Replace Color(0xFFCFE1FB) with AppColors.borderQuaternary (5 uses)
- Replace Color(0xFFF59E0B) with AppColors.warning (4 uses)
- Replace Color(0xFFEAF3FF) with AppColors.surfaceInfo (4 uses)
- Replace Color(0xFF10B981) with AppColors.success (4 uses)
- Replace Color(0xFFEF4444) with AppColors.error (3 uses)
- Replace Color(0xFFF3F7FF) with AppColors.surfaceInfoLight (3 uses)

Files migrated:
- settings_screen.dart (7 colors migrated)
- contacts_screen.dart (3 colors migrated)
- calendar_event_detail_screen.dart (10 colors migrated)
- features_screen.dart (3 colors migrated)
- toast_type_config.dart (3 colors migrated)
- memory_screen.dart (4 colors migrated)
- account_screen.dart (3 colors migrated)
- add_contact_screen.dart (2 colors migrated)

Total: 37 hardcoded colors replaced with design tokens

Verification:
- flutter analyze: passed
- flutter test: passed
2026-03-02 16:34:33 +08:00

403 lines
12 KiB
Dart

import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import '../../../../core/theme/design_tokens.dart';
import '../../../../shared/widgets/page_header.dart' as widgets;
class SettingsScreen extends StatelessWidget {
const SettingsScreen({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: AppColors.surfaceSecondary,
body: SafeArea(
child: Column(
children: [
const widgets.PageHeader(leading: widgets.BackButton()),
Expanded(
child: SingleChildScrollView(
padding: const EdgeInsets.fromLTRB(20, 8, 20, 20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
_buildProfileHero(),
const SizedBox(height: 16),
_buildQuickActions(context),
const SizedBox(height: 16),
_buildSubscriptionCard(),
const SizedBox(height: 16),
_buildMenuCard(context),
],
),
),
),
],
),
),
);
}
Widget _buildProfileHero() {
return Container(
width: double.infinity,
padding: const EdgeInsets.all(20),
decoration: BoxDecoration(
gradient: const LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
stops: [0, 1],
colors: [Color(0xFFFFFFFF), AppColors.surfaceInfoLight],
transform: GradientRotation(35 * 3.14159 / 180),
),
borderRadius: BorderRadius.circular(22),
border: Border.all(color: const Color(0xFFE5ECF8)),
boxShadow: const [
BoxShadow(
color: Color(0x1A0F172A),
blurRadius: 14,
offset: Offset(0, 4),
),
],
),
child: Row(
children: [
Container(
width: 72,
height: 72,
decoration: BoxDecoration(
gradient: const LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [Color(0xFFEAF1FF), Color(0xFFF8FBFF)],
),
borderRadius: BorderRadius.circular(36),
border: Border.all(color: const Color(0xFFD9E5FA)),
),
child: const Icon(Icons.person, size: 30, color: AppColors.blue500),
),
const SizedBox(width: 12),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const Text(
'Qiuzhiliang',
style: TextStyle(
fontSize: 17,
fontWeight: FontWeight.w600,
color: AppColors.slate900,
),
),
Container(
padding: const EdgeInsets.symmetric(
horizontal: 10,
vertical: 4,
),
decoration: BoxDecoration(
color: AppColors.surfaceTertiary,
borderRadius: BorderRadius.circular(10),
border: Border.all(color: const Color(0xFFDEE7F6)),
),
child: const Text(
'Free',
style: TextStyle(
fontSize: 11,
fontWeight: FontWeight.w500,
color: AppColors.slate500,
),
),
),
],
),
const SizedBox(height: 4),
const Text(
'qiuzhiliang@xunmee.com',
style: TextStyle(
fontSize: 13,
fontWeight: FontWeight.w500,
color: AppColors.slate500,
),
),
],
),
),
],
),
);
}
Widget _buildQuickActions(BuildContext context) {
return Container(
height: 120,
padding: const EdgeInsets.all(10),
decoration: BoxDecoration(
color: AppColors.white,
borderRadius: BorderRadius.circular(18),
border: Border.all(color: const Color(0xFFE7EDF6)),
),
child: Row(
children: [
Expanded(
child: _buildQuickActionCard(
icon: Icons.people,
iconColor: AppColors.blue600,
iconBg: AppColors.surfaceTertiary,
iconBorder: const Color(0xFFE6ECF7),
title: '联系人',
subtitle: '已添加 1 位:Toki',
onTap: () => context.push('/contacts'),
),
),
const SizedBox(width: 10),
Expanded(
child: _buildQuickActionCard(
icon: Icons.auto_awesome,
iconColor: const Color(0xFF0EA5A4),
iconBg: const Color(0xFFF7FAFF),
iconBorder: const Color(0xFFE6ECF7),
title: '常用功能',
subtitle: '已启用:会议提醒',
onTap: () => context.push('/settings/features'),
),
),
],
),
);
}
Widget _buildQuickActionCard({
required IconData icon,
required Color iconColor,
required Color iconBg,
required Color iconBorder,
required String title,
required String subtitle,
required VoidCallback onTap,
}) {
return GestureDetector(
onTap: onTap,
child: Container(
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: iconBg,
borderRadius: BorderRadius.circular(14),
border: Border.all(color: iconBorder),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
children: [
Icon(icon, size: 18, color: iconColor),
const SizedBox(width: 8),
Text(
title,
style: const TextStyle(
fontSize: 15,
fontWeight: FontWeight.w600,
color: Color(0xFF1E293B),
),
),
],
),
const Icon(
Icons.chevron_right,
size: 16,
color: AppColors.slate400,
),
],
),
Text(
subtitle,
style: const TextStyle(
fontSize: 12,
fontWeight: FontWeight.w500,
color: AppColors.slate500,
),
),
],
),
),
);
}
Widget _buildSubscriptionCard() {
return Container(
padding: const EdgeInsets.all(14),
decoration: BoxDecoration(
color: AppColors.white,
borderRadius: BorderRadius.circular(16),
border: Border.all(color: const Color(0xFFE3EAF6)),
),
child: Row(
children: [
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'套餐等级 Free',
style: TextStyle(
fontSize: 15,
fontWeight: FontWeight.w600,
color: AppColors.slate900,
),
),
const SizedBox(height: 8),
const Text(
'已用积分 320 / 1000',
style: TextStyle(
fontSize: 13,
fontWeight: FontWeight.w500,
color: AppColors.slate500,
),
),
const SizedBox(height: 8),
ClipRRect(
borderRadius: BorderRadius.circular(999),
child: const LinearProgressIndicator(
value: 0.32,
backgroundColor: Color(0xFFE8EEF8),
valueColor: AlwaysStoppedAnimation(AppColors.blue400),
minHeight: 8,
),
),
],
),
),
const SizedBox(width: 12),
GestureDetector(
onTap: () {},
child: Container(
width: 72,
height: 32,
decoration: BoxDecoration(
color: AppColors.surfaceInfo,
borderRadius: BorderRadius.circular(16),
border: Border.all(color: AppColors.borderQuaternary),
),
child: const Center(
child: Text(
'升级',
style: TextStyle(
fontSize: 13,
fontWeight: FontWeight.w600,
color: AppColors.blue600,
),
),
),
),
),
],
),
);
}
Widget _buildMenuCard(BuildContext context) {
return Container(
decoration: BoxDecoration(
color: AppColors.white,
borderRadius: BorderRadius.circular(16),
border: Border.all(color: AppColors.borderSecondary),
),
child: Column(
children: [
_buildMenuItem(
icon: Icons.calendar_today,
title: '日历',
trailing: 'Toki',
onTap: () {},
),
_buildDivider(),
_buildMenuItem(
icon: Icons.notifications,
title: '日程通知',
onTap: () {},
),
_buildDivider(),
_buildMenuItem(
icon: Icons.bookmark,
title: '我的记忆',
onTap: () => context.push('/settings/memory'),
),
_buildDivider(),
_buildMenuItem(
icon: Icons.person,
title: '我的账户',
onTap: () => context.push('/settings/account'),
),
],
),
);
}
Widget _buildMenuItem({
required IconData icon,
required String title,
String? trailing,
required VoidCallback onTap,
}) {
return GestureDetector(
onTap: onTap,
behavior: HitTestBehavior.opaque,
child: Container(
height: 56,
padding: const EdgeInsets.symmetric(horizontal: 14),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
children: [
Icon(icon, size: 20, color: AppColors.slate500),
const SizedBox(width: 10),
Text(
title,
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.w500,
color: AppColors.slate900,
),
),
],
),
Row(
children: [
if (trailing != null) ...[
Text(
trailing,
style: const TextStyle(
fontSize: 14,
color: AppColors.slate400,
),
),
const SizedBox(width: 6),
],
const Icon(
Icons.chevron_right,
size: 18,
color: AppColors.slate400,
),
],
),
],
),
),
);
}
Widget _buildDivider() {
return Container(
height: 1,
margin: const EdgeInsets.symmetric(horizontal: 14),
color: const Color(0xFFEEF2F7),
);
}
}