docs(plans): 记录 K21 登录页优化回执
This commit is contained in:
1 parent
0e3ddfc1b1
commit
81c1bbb1e5
2 files changed
+148
-1
No files matched your search
+24
-1
@@ -20,7 +20,7 @@
|
||||
|
||||
---
|
||||
|
||||
## [待处理] 2026-10-19 | K21 登录页 UI 优化
|
||||
## [已处理·待用户验收] 2026-10-19 | K21 登录页 UI 优化
|
||||
|
||||
**用户指令(2026-10-19)**:「现在主要做登录页面 ui 优化」。
|
||||
> 只改客户端 `ReelShort` 登录/注册页(`lib/pages/auth/**`)及其 l10n;不改接口、后端、Web、specs、main。
|
||||
@@ -95,6 +95,29 @@
|
||||
- 计划文档 `FruitServer/docs/plans/2026-10-19-K21.md`;留痕写 `PROGRESS.md` 并单独提交 FruitServer develop。
|
||||
- 回执:布局前后差异、三语文案、保留的 Key/尺寸清单、测试条数与门禁原始输出、真机验收步骤。
|
||||
|
||||
### 六、K21 完成回执
|
||||
|
||||
- 客户端分支:`feature/flutter-k21-auth-ui`
|
||||
- 功能提交:`8a96f34`
|
||||
- 合并回 develop:`b1c69e2`
|
||||
- 已推送:`e44fbdf..b1c69e2 develop`
|
||||
- author/committer:`Zhou Weidong <502333560@qq.com>`
|
||||
|
||||
已完成:居中可滚动布局、顶部浮层返回、图片品牌 hero、模式独立副标题、
|
||||
注册密码规则提示、字段级红框、busy/mounted 保护、双层光晕和提交阴影。
|
||||
|
||||
```text
|
||||
$ dart analyze lib test
|
||||
No issues found!
|
||||
|
||||
$ flutter test
|
||||
00:24 +343: All tests passed!
|
||||
|
||||
$ flutter build apk --debug
|
||||
Running Gradle task 'assembleDebug'... 7.5s
|
||||
✓ Built build/app/outputs/flutter-apk/app-debug.apk
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## [已处理·待用户验收] 2026-10-19 | K20 客户端视觉统一(辣椒红主题)
|
||||
|
||||
@@ -2202,6 +2202,130 @@ $ flutter test
|
||||
|
||||
---
|
||||
|
||||
## 37. K21 登录页 UI 优化
|
||||
|
||||
### 37.1 基线与布局
|
||||
|
||||
```text
|
||||
ReelShort: e44fbdf style(ui): 合并 K20 客户端视觉统一
|
||||
FruitServer: af28161 docs(plans): 下发 K21 登录页 UI 优化任务
|
||||
```
|
||||
|
||||
计划先提交为 `0e3ddfc docs(plans): 增加 K21 登录页实施计划`。
|
||||
|
||||
布局由顶部对齐 + ListView 改为:
|
||||
|
||||
- `LayoutBuilder + SingleChildScrollView + ConstrainedBox + Center`;
|
||||
- 正常高度品牌与卡片垂直居中;
|
||||
- 高度小于 720 时使用紧凑横向品牌,保证 600 高测试视口与提交按钮可达;
|
||||
- 返回按钮改为 `Positioned + SafeArea` 浮层,不占内容流;
|
||||
- 小屏键盘仍保留 `28 + viewInsets.bottom` 底部 padding,可滚动到 `auth-submit`。
|
||||
|
||||
### 37.2 品牌与文案
|
||||
|
||||
- `auth-brand-mark` 改用 `assets/icon/splash_mark.png`,尺寸仍为 48×48。
|
||||
- 品牌名 26/w800,tagline 14/blueSoft;正常视口居中竖排。
|
||||
- 登录使用现有 `authSubtitle`;注册新增 `authSignUpSubtitle`:
|
||||
|
||||
```text
|
||||
en: Create an account to keep your list, history, and progress.
|
||||
zh: 创建账号,保存你的片单、观看记录和进度。
|
||||
id: Buat akun untuk menyimpan daftar, riwayat, dan progresmu.
|
||||
```
|
||||
|
||||
- 注册态密码框下显示 `authPasswordHint`,Key `auth-password-rule`;登录态隐藏。
|
||||
|
||||
### 37.3 字段错误与交互
|
||||
|
||||
`AuthLogic` 新增 `fieldError`,`validate()` 记录具体字段错误,输入变化或切换模式时清除。
|
||||
邮箱/密码字段增加 semantic error 红框:
|
||||
|
||||
```text
|
||||
errorBorder / focusedErrorBorder
|
||||
color = colorScheme.error
|
||||
width = 1.5
|
||||
```
|
||||
|
||||
同时:
|
||||
|
||||
- `_submit()` busy 首行短路;
|
||||
- 异步 catch 的 `setState` 前判断 mounted;
|
||||
- 密码框 IME done 提交同样经过 busy 短路;
|
||||
- 提交按钮增加 alpha 0.22 的辣椒红轻阴影,背景色与按下色不变。
|
||||
|
||||
### 37.4 保留项
|
||||
|
||||
```text
|
||||
auth-brand-mark 48x48
|
||||
auth-card radius 20 / border outlineVariantDark / width 1
|
||||
input height 52 / radius 14 / fill bar / focus blue 1.5
|
||||
submit height 52 / radius 26 / blue / bluePressed
|
||||
auth-enter-animation 220ms / tween 0 -> 1
|
||||
mode keys, title copy, hidden compatibility copy
|
||||
error capsule radius 12 / alpha 0.1 / semantic color
|
||||
320x568 + keyboard 260 scroll reachability
|
||||
```
|
||||
|
||||
主 glow 颜色 alpha 保持 ≤0.18;新增 warm glow Key
|
||||
`auth-background-warm-glow`,alpha 上限 0.06。
|
||||
|
||||
### 37.5 TDD 与门禁
|
||||
|
||||
新增 `test/auth/auth_k21_test.dart`,先红灯后转绿:
|
||||
|
||||
```text
|
||||
$ flutter test test/auth/auth_k21_test.dart
|
||||
00:00 +2: All tests passed!
|
||||
```
|
||||
|
||||
全部 Auth 测试:
|
||||
|
||||
```text
|
||||
$ flutter test test/auth/auth_visual_test.dart \
|
||||
test/auth/auth_page_test.dart test/auth/auth_k21_test.dart
|
||||
00:01 +17: All tests passed!
|
||||
```
|
||||
|
||||
全量门禁:
|
||||
|
||||
```text
|
||||
$ dart analyze lib test
|
||||
No issues found!
|
||||
|
||||
$ flutter test
|
||||
00:24 +343: All tests passed!
|
||||
|
||||
$ flutter build apk --debug
|
||||
Running Gradle task 'assembleDebug'... 7.5s
|
||||
✓ Built build/app/outputs/flutter-apk/app-debug.apk
|
||||
```
|
||||
|
||||
### 37.6 Git
|
||||
|
||||
```text
|
||||
8a96f34 feat(auth): 优化登录页布局与字段反馈
|
||||
b1c69e2 feat(auth): 合并 K21 登录页优化
|
||||
e44fbdf..b1c69e2 develop -> develop
|
||||
```
|
||||
|
||||
author/committer 均为 `Zhou Weidong <502333560@qq.com>`。
|
||||
|
||||
### 37.7 用户真机验收
|
||||
|
||||
设备侧取证由用户执行:
|
||||
|
||||
1. 普通手机竖屏打开登录页:品牌 hero 与卡片垂直居中,返回键为顶部浮层。
|
||||
2. 切换注册:副标题变为注册文案,密码框下出现规则提示。
|
||||
3. 提交空邮箱:邮箱出现 1.5px 红色边框,错误胶囊仍保留。
|
||||
4. 输入非法邮箱后修改:字段红框清除。
|
||||
5. 输入弱密码:密码框变红,规则提示仍在。
|
||||
6. 连续点提交或按键盘 Done:只发出一次请求,busy 时按钮与模式切换禁用。
|
||||
7. 320×568 小屏弹出键盘:滚动后提交按钮可点击。
|
||||
8. 检查主辣椒红 glow、暖色副 glow 均淡且不影响文字对比度。
|
||||
9. 检查品牌图为 `splash_mark.png`,显示 48×48,无拉伸。
|
||||
|
||||
---
|
||||
|
||||
## 36. K20 客户端视觉统一
|
||||
|
||||
### 36.1 基线与计划
|
||||
|
||||
Reference in new issue
Block a user