3.1 KiB
3.1 KiB
[已处理] 2026-10-20 | K41-A 登录页:修复邮箱/密码输入不可见 + 视觉升级(仅 App 端)
用户指令(2026-10-20,原文):
「现在修改登录页面 邮箱登录输入框内容都看不见而且登录页面很素」
根因(已定位):lib/pages/auth/auth_form_widgets.dart 中邮箱与密码 TextField 的 style 用了 AppColors.onPrimary(白色),而输入框填充是 AppColors.bar(近白 #FFFDFB),文字与背景同色导致「看不见」。
口径(只改 Flutter,不动后端、不改接口;所有既有 Key 保留)
一、输入可见性(必修)
- 邮箱/密码输入文字颜色改
AppColors.onSurface(15 号),光标AppColors.blue。 - 输入框:白底
AppColors.card、1pxAppColors.border、圆角 14、高 52;聚焦时描边AppColors.blue(160ms),错误态红色描边;prefix 图标聚焦时为主题色。 - hint 14 号
AppColors.subtle;密码可见性按钮保持。
二、登录页视觉升级(暖橙风,不再素)
- 背景:
AppTheme.pageGradient暖色渐变 + 两个柔和光斑(顶部右上AppColors.surfaceTop、底部左下AppColors.gold透明度 0.18,BlurMask/径向渐变),加一层极淡的斜向细纹(可选,透明度 ≤0.04)。 - 落地页(Key
auth-landing):- Logo 72×72、圆角 20、主色→粉色渐变 + 白色播放图标 36 + 轻阴影;
- 品牌名 24 号 w900(Outfit),副标语 13 号
AppColors.muted; - 主 CTA「手机号登录」(Key
auth-entry-phone):高 50、圆角 25、主色实底、白字 15 w800 + 图标; - 次 CTA「邮箱登录」(Key
auth-entry-email):高 50、圆角 25、白底 + 1px 描边 + 深色字; - 两个按钮间距 12,整体距品牌 28;底部法务文案保持 9 号 muted(Key
auth-legal)。
- 邮箱登录卡片(
_AuthCard):- 白卡、圆角 20、内边距 20、阴影
AppTheme.cardShadow; - 顶部「登录 / 注册」分段切换(选中主色实底白字,未选中透明深色字,高 36 圆角 18),切换逻辑不变;
- 字段标签 12 号 w700
AppColors.onSurface、与输入框间距 6;两字段间距 14; - 提交按钮(Key
auth-submit)高 50、圆角 25、主色实底白字 15 w800,busy 时显示白色 18 圈; - 错误文案保持红色 12 号,位于提交按钮上方。
- 白卡、圆角 20、内边距 20、阴影
- 返回按钮(Key
auth-back)改为 40×40 白色圆形 + 1px 描边 + 轻阴影、深色箭头(与二级页统一)。 - 键盘弹出时不遮挡输入(保持现有
viewInsets处理)。
测试/门禁
- 新增:邮箱/密码输入文字颜色为
AppColors.onSurface(不再是白色);登录落地页主/次 CTA 高度 50;卡片圆角 20;auth-back40×40; - 既有登录/注册、错误提示、可见性切换用例保持通过;
dart analyze lib test零告警 +flutter test全过 +flutter build apk --debug。
流程:从 develop 拉 feature/flutter-k41-auth-redesign;作者 Zhou Weidong <502333560@qq.com>;--no-ff 合回 develop 并 push;PROGRESS 留痕;真机验收由用户执行。