修复:日期录入收口共享层——「今天」快捷键 + 品牌配色 datePickerTheme(M3.5-02)
用户实测已因日期选择器误录:Flutter 原生日历只给年份网格、月份必须靠 < > 逐月点,从 9 月回 4 月要点 5 次,他把当月(2026-09)的就医记录记成了 2026-04-09,进而误判「本月花费 ¥0」是聚合坏了。 新增 lib/core/widgets/app_date_picker.dart,全仓 7 处裸 showDatePicker 收口 (改造后 lib/ 下 showDatePicker 只出现在该文件内部一次): - pickAppDate(...):calendar 首屏 + 保留头部铅笔切手输;initialDate 自动夹进 [firstDate, lastDate] 防原生越界断言(调用方常传「当前值 ?? 今天」,而 「到期日期」的 firstDate 就是今天,历史值可能已越界);返回值统一抹时分秒; 中文文案一律交给 zh-CN 本地化,不硬编码,避免两处文案漂移。 - AppDateFieldTrailing(...):7 处日期行统一「今天 + 日历图标」。今天越界自动 隐藏按钮、提交中禁用、触控 44×44、primaryStrong 白底 4.49:1。 入口模式取舍:不用 calendarOnly——它恰好会砍掉手输按钮,把「录一个已知日期」 这条唯一快路堵死;也不用 input 首屏——「记今天」这类高频场景敲 8 个数字更慢。 两条路都留着最省事。 「今天」为何放表单行而非弹窗内:原生 showDatePicker 无法注入自定义动作 (builder 只能包裹整个 Dialog,拿不到内部选中态;塞进 Column 还会因 Dialog 在无界高度下贪心布局而溢出)。放表单行反而更快——一键落值连弹窗都不用开, 把容易走错的月份导航整段绕开,且一次实现 7 处形态完全一致。 各调用点原有的 firstDate/lastDate 业务约束原样传入、一字未改(健康事件 不许未来、到期日不许补记过去、疫苗 allowFuture 双态、生日不许未来), 并由 widget 测试直接断言 DatePickerDialog.firstDate/lastDate 防后续悄悄放宽。 顺带修配色:此前从未定制 datePickerTheme,选中日直接吃 ColorScheme.fromSeed 由珊瑚橙派生的暗红棕,与品牌脱节。新增 _datePickerTheme 只复用 05 号规范 (iteration-2/05、iteration-3/05)已审计的色对,不新造色值:头部 surfaceTint + primaryDark 7.98:1(选中 chip 同款)、选中日/年 primaryStrong 实底白字 4.49:1、今日 primaryStrong 1.5px 描边、星期表头 inkSoft 6.59:1、 越界日 muted(DEBT-2 允许的禁用态用途)。headerHeadlineStyle 取 22px (默认 32):中文「9月10日周四」在横屏侧栏头部 26px 起就折行。 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
@@ -176,6 +176,7 @@ ThemeData buildAppTheme() {
|
||||
borderRadius: BorderRadius.all(Radius.circular(AppRadius.md)),
|
||||
),
|
||||
),
|
||||
datePickerTheme: _datePickerTheme,
|
||||
navigationBarTheme: NavigationBarThemeData(
|
||||
backgroundColor: AppColors.surface,
|
||||
indicatorColor: AppColors.surfaceTint,
|
||||
@@ -194,3 +195,102 @@ ThemeData buildAppTheme() {
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
/// 日期选择器主题(M3.5-01)。
|
||||
///
|
||||
/// 根因备忘:此前未定制,`showDatePicker` 完全走 `ColorScheme.fromSeed`
|
||||
/// 由珊瑚橙 `#FF6F4C` 派生出的 M3 调和色(选中日为暗红棕实底),
|
||||
/// 与全 app 品牌色脱节。这里只复用 05 号规范(iteration-2/05、iteration-3/05)
|
||||
/// 已审计过的色对,不新造色值:
|
||||
///
|
||||
/// | 位置 | 色对 | 对比度 | 来源 |
|
||||
/// | --- | --- | --- | --- |
|
||||
/// | 头部(帮助文字 + 标题 + 模式切换图标) | `surfaceTint` 底 + `primaryDark` | 7.98:1 | 选中 chip 同款(iteration-2/05 §3 D7) |
|
||||
/// | 选中日 / 选中年 | `primaryStrong` 底 + 白字 | 4.49:1 | FAB / 头像徽标同款(同 §2) |
|
||||
/// | 今日(未选中)描边与文字 | 白底 + `primaryStrong` | 4.49:1 | 同上 |
|
||||
/// | 未选中日 / 年 | 白底 + `ink` | ≥12:1 | 正文主色 |
|
||||
/// | 星期表头 | 白底 + `inkSoft` | 6.59:1 | 承载信息的次级文字(§3 DEBT-2) |
|
||||
/// | 越界不可选日 | 白底 + `muted` | 3.36:1 | 禁用态,DEBT-2 允许的 `muted` 用途 |
|
||||
/// | 确定 / 取消按钮 | 白底 + `primaryStrong` 文字 | 4.49:1 | 可点击文字链接(§1.1 token 注释) |
|
||||
final DatePickerThemeData _datePickerTheme = DatePickerThemeData(
|
||||
backgroundColor: AppColors.surface,
|
||||
elevation: 0,
|
||||
surfaceTintColor: Colors.transparent,
|
||||
shadowColor: Colors.transparent,
|
||||
shape: const RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(AppRadius.xl)),
|
||||
side: BorderSide(color: AppColors.border),
|
||||
),
|
||||
dividerColor: AppColors.border,
|
||||
headerBackgroundColor: AppColors.surfaceTint,
|
||||
headerForegroundColor: AppColors.primaryDark,
|
||||
headerHelpStyle: const TextStyle(
|
||||
color: AppColors.primaryDark,
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
headerHeadlineStyle: const TextStyle(
|
||||
color: AppColors.primaryDark,
|
||||
// 22(默认 32 偏大):中文 `formatMediumDate` 是「9月10日周四」5~6 字,
|
||||
// 横屏侧栏头部宽度下 26 起就会折行,22 一行放得下。
|
||||
fontSize: 22,
|
||||
fontWeight: FontWeight.w800,
|
||||
),
|
||||
// 年份下拉 / 上下月箭头一行:与头部同族深色,白底 8.74:1。
|
||||
subHeaderForegroundColor: AppColors.primaryDark,
|
||||
weekdayStyle: const TextStyle(
|
||||
color: AppColors.inkSoft,
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w600,
|
||||
),
|
||||
dayStyle: const TextStyle(fontSize: 14, fontWeight: FontWeight.w600),
|
||||
dayForegroundColor: WidgetStateProperty.resolveWith((states) {
|
||||
if (states.contains(WidgetState.disabled)) return AppColors.muted;
|
||||
if (states.contains(WidgetState.selected)) return Colors.white;
|
||||
return AppColors.ink;
|
||||
}),
|
||||
dayBackgroundColor: WidgetStateProperty.resolveWith((states) {
|
||||
if (states.contains(WidgetState.selected)) return AppColors.primaryStrong;
|
||||
return null;
|
||||
}),
|
||||
dayOverlayColor: WidgetStateProperty.resolveWith((states) {
|
||||
if (states.contains(WidgetState.selected)) return Colors.white24;
|
||||
return AppColors.primary.withAlpha(31);
|
||||
}),
|
||||
todayForegroundColor: WidgetStateProperty.resolveWith((states) {
|
||||
if (states.contains(WidgetState.disabled)) return AppColors.muted;
|
||||
if (states.contains(WidgetState.selected)) return Colors.white;
|
||||
return AppColors.primaryStrong;
|
||||
}),
|
||||
todayBackgroundColor: WidgetStateProperty.resolveWith((states) {
|
||||
if (states.contains(WidgetState.selected)) return AppColors.primaryStrong;
|
||||
return null;
|
||||
}),
|
||||
// 今日始终带描边(选中态由实底承载,未选中态靠 1.5px 描边定位):
|
||||
// `primaryStrong` 白底 4.49:1,超过非文字元素 3:1 门槛。
|
||||
todayBorder: const BorderSide(color: AppColors.primaryStrong, width: 1.5),
|
||||
yearStyle: const TextStyle(fontSize: 15, fontWeight: FontWeight.w600),
|
||||
yearForegroundColor: WidgetStateProperty.resolveWith((states) {
|
||||
if (states.contains(WidgetState.disabled)) return AppColors.muted;
|
||||
if (states.contains(WidgetState.selected)) return Colors.white;
|
||||
return AppColors.ink;
|
||||
}),
|
||||
yearBackgroundColor: WidgetStateProperty.resolveWith((states) {
|
||||
if (states.contains(WidgetState.selected)) return AppColors.primaryStrong;
|
||||
return null;
|
||||
}),
|
||||
yearOverlayColor: WidgetStateProperty.resolveWith((states) {
|
||||
if (states.contains(WidgetState.selected)) return Colors.white24;
|
||||
return AppColors.primary.withAlpha(31);
|
||||
}),
|
||||
cancelButtonStyle: TextButton.styleFrom(
|
||||
foregroundColor: AppColors.inkSoft,
|
||||
minimumSize: const Size(64, 44),
|
||||
textStyle: const TextStyle(fontSize: 14, fontWeight: FontWeight.w600),
|
||||
),
|
||||
confirmButtonStyle: TextButton.styleFrom(
|
||||
foregroundColor: AppColors.primaryStrong,
|
||||
minimumSize: const Size(64, 44),
|
||||
textStyle: const TextStyle(fontSize: 14, fontWeight: FontWeight.w700),
|
||||
),
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user