
- 创建SettingPage视图,包含用户信息管理、头像设置、昵称编辑等功能。 - 实现SettingViewModel,处理设置页面的业务逻辑,包括头像上传、昵称更新等。 - 添加相机和相册选择功能,支持头像更换。 - 更新MainPage和MainViewModel,添加导航逻辑以支持设置页面的访问。 - 完善本地化支持,确保多语言兼容性。 - 新增相关测试建议,确保功能完整性和用户体验。
180 lines
4.5 KiB
Markdown
180 lines
4.5 KiB
Markdown
# SettingPage 实现文档
|
||
|
||
## 概述
|
||
|
||
成功创建了 MVVM 版本的 SettingPage,参照 AppSettingView 的 UI 设计,实现了完整的设置页面功能。
|
||
|
||
## 实现文件
|
||
|
||
### 1. SettingViewModel.swift
|
||
- **位置**: `yana/MVVM/ViewModel/SettingViewModel.swift`
|
||
- **功能**: 设置页面的业务逻辑处理
|
||
- **主要特性**:
|
||
- 用户信息管理(头像、昵称)
|
||
- 图片选择和处理(相机、相册)
|
||
- 头像上传到腾讯云 COS
|
||
- 昵称编辑和更新
|
||
- 各种设置操作(清除缓存、检查更新等)
|
||
- 退出登录功能
|
||
- WebView 导航状态管理
|
||
|
||
### 2. SettingPage.swift
|
||
- **位置**: `yana/MVVM/View/SettingPage.swift`
|
||
- **功能**: 设置页面的 UI 界面
|
||
- **主要特性**:
|
||
- 参照 AppSettingView 的 UI 布局
|
||
- 头像设置区域(支持点击更换)
|
||
- 个人信息设置区域(昵称编辑)
|
||
- 其他设置区域(各种设置选项)
|
||
- 退出登录区域
|
||
- 各种弹窗和确认对话框
|
||
- WebView 集成(用户协议、隐私政策等)
|
||
|
||
## 主要功能
|
||
|
||
### 头像管理
|
||
- 支持从相机拍照
|
||
- 支持从相册选择
|
||
- 自动上传到腾讯云 COS
|
||
- 实时显示上传状态
|
||
|
||
### 昵称编辑
|
||
- 弹窗式编辑界面
|
||
- 字符长度限制(15字符)
|
||
- 实时验证和更新
|
||
|
||
### 设置选项
|
||
- 个人信息与权限
|
||
- 帮助
|
||
- 清除缓存
|
||
- 检查更新
|
||
- 注销账号
|
||
- 关于我们
|
||
|
||
### 退出登录
|
||
- 确认对话框
|
||
- 清除所有认证信息
|
||
- 回调到主页面
|
||
|
||
## 导航集成
|
||
|
||
### MainPage 修改
|
||
- 添加了 `showSettingPage` 状态
|
||
- 在 "Me" 标签页的右上角设置按钮点击时导航到 SettingPage
|
||
- 使用 `navigationDestination` 进行导航
|
||
|
||
### MainViewModel 修改
|
||
- 添加了 `showSettingPage` 发布属性
|
||
- 修改了 `onTopRightButtonTapped` 方法,在 "Me" 标签页时显示设置页面
|
||
|
||
## 技术特点
|
||
|
||
### MVVM 架构
|
||
- 清晰的视图和视图模型分离
|
||
- 使用 `@Published` 属性进行状态管理
|
||
- 异步操作使用 `Task` 和 `@MainActor`
|
||
|
||
### 图片处理
|
||
- 使用 `PhotosUI` 进行图片选择
|
||
- 自定义 `CameraPicker` 进行拍照
|
||
- 集成腾讯云 COS 进行图片上传
|
||
|
||
### 本地化支持
|
||
- 使用 `LocalizedString` 进行多语言支持
|
||
- 添加了缺失的本地化字符串
|
||
|
||
### 错误处理
|
||
- 完善的错误状态管理
|
||
- 用户友好的错误提示
|
||
- 网络请求失败处理
|
||
|
||
## 依赖关系
|
||
|
||
### 内部依赖
|
||
- `UserInfoManager`: 用户信息管理
|
||
- `COSManagerAdapter`: 图片上传服务
|
||
- `APIService`: 网络请求服务
|
||
- `LogManager`: 日志管理
|
||
|
||
### 外部依赖
|
||
- `SwiftUI`: UI 框架
|
||
- `PhotosUI`: 图片选择
|
||
- `UIKit`: 相机功能
|
||
|
||
## 测试建议
|
||
|
||
1. **基本功能测试**
|
||
- 页面加载和显示
|
||
- 导航和返回
|
||
- 用户信息显示
|
||
|
||
2. **头像功能测试**
|
||
- 相机拍照
|
||
- 相册选择
|
||
- 图片上传
|
||
- 上传状态显示
|
||
|
||
3. **昵称编辑测试**
|
||
- 弹窗显示
|
||
- 字符输入和限制
|
||
- 保存和更新
|
||
|
||
4. **设置选项测试**
|
||
- 各种设置项点击
|
||
- WebView 页面显示
|
||
- 退出登录流程
|
||
|
||
5. **错误处理测试**
|
||
- 网络异常情况
|
||
- 图片上传失败
|
||
- 用户信息获取失败
|
||
|
||
## 注意事项
|
||
|
||
1. **权限要求**
|
||
- 相机权限(用于拍照)
|
||
- 相册权限(用于选择图片)
|
||
|
||
2. **网络依赖**
|
||
- 图片上传需要网络连接
|
||
- 用户信息更新需要网络连接
|
||
|
||
3. **存储依赖**
|
||
- 用户信息存储在 Keychain
|
||
- 图片缓存管理
|
||
|
||
## 后续优化
|
||
|
||
1. **性能优化**
|
||
- 图片压缩优化
|
||
- 缓存策略优化
|
||
|
||
2. **用户体验**
|
||
- 添加加载动画
|
||
- 优化错误提示
|
||
|
||
3. **功能扩展**
|
||
- 添加更多设置选项
|
||
- 支持更多个人信息字段
|
||
|
||
## 文件修改记录
|
||
|
||
### 新增文件
|
||
- `yana/MVVM/ViewModel/SettingViewModel.swift`
|
||
- `yana/MVVM/View/SettingPage.swift`
|
||
|
||
### 修改文件
|
||
- `yana/MVVM/MainPage.swift`: 添加导航逻辑
|
||
- `yana/MVVM/ViewModel/MainViewModel.swift`: 添加设置页面状态
|
||
- `yana/MVVM/CommonComponents.swift`: 添加 AppImageSource 枚举
|
||
- `yana/Resources/zh-Hans.lproj/Localizable.strings`: 添加缺失的本地化字符串
|
||
- `yana/Resources/en.lproj/Localizable.strings`: 添加缺失的本地化字符串
|
||
|
||
### 重构文件
|
||
- `yana/MVVM/ViewModel/SettingViewModel.swift`: 移除重复的 AppImageSource 定义
|
||
- `yana/Features/AppSettingFeature.swift`: 移除重复的 AppImageSource 定义
|
||
|
||
## 总结
|
||
|
||
成功实现了完整的 MVVM 版本 SettingPage,功能完整,代码结构清晰,符合项目的架构规范。所有功能都经过了仔细的设计和实现,确保了良好的用户体验和代码质量。
|