2.6 KiB
2.6 KiB
二维码生成器修复与优化 Spec
Why
用户反馈当前二维码美化弹窗存在多个问题:颜色预设方案异常(如"夜空蓝"反色方案不适合二维码)、点阵样式视觉效果差、Logo 功能未验证、复制内容按钮无存在必要、下载功能需确认是否可用。
What Changes
- 替换颜色预设方案,移除反色/异常配色,新增实用美观的配色
- 优化点阵样式渲染效果,使圆形和圆角方形更美观
- 移除"复制内容"按钮(仅保留下载二维码按钮)
- 验证并修复下载二维码功能
- 验证 Logo 上传功能在浏览器中的可用性
Impact
- Affected specs: qrcode-logo-and-styles
- Affected code:
src/pages/QRCodeGenerator/QRCodeGenerator.tsx,src/utils/qrRenderer.ts,src/pages/QRCodeGenerator/QRCodeGenerator.css
MODIFIED Requirements
Requirement: 颜色预设方案优化
系统 SHALL 提供美观实用的颜色预设方案,替换当前异常配色。
Scenario: 移除反色方案
- WHEN 用户查看预设配色
- THEN 不再出现"夜空蓝"等 fg 浅色 + bg 深色的反色方案
Scenario: 新增实用配色
- WHEN 用户使用预设配色
- THEN 提供经典黑白、深蓝白、森林绿白、橙黄白、深紫白、科技蓝白共 6 种方案,均为深色前景+浅色背景
Requirement: 点阵样式渲染优化
系统 SHALL 优化圆形和圆角方形点阵的渲染效果,使其视觉上更美观。
Scenario: 圆点样式优化
- WHEN 用户选择圆形点阵
- THEN 相邻模块的圆点之间应有适当间隙(直径缩小至模块大小的 82%),避免"挤在一起"的视觉效果
Scenario: 圆角方形样式优化
- WHEN 用户选择圆角方形点阵
- THEN 圆角半径调整为模块大小的 40%,使圆角更明显更柔和
Requirement: 移除复制内容按钮
系统 SHALL 移除预览区下方的"复制内容"按钮,仅保留"下载二维码"按钮。
Scenario: 预览区操作按钮
- WHEN 二维码已生成
- THEN 预览区下方仅显示"下载二维码"按钮,不再显示"复制内容"按钮
Requirement: 下载二维码功能验证
系统 SHALL 确保下载二维码功能在所有场景下正常工作。
Scenario: 下载带 Logo 的二维码
- WHEN 用户点击下载按钮且二维码包含 Logo
- THEN 下载的 PNG 图片包含 Logo 且与预览一致
Scenario: 下载带样式的二维码
- WHEN 用户点击下载按钮且二维码使用了自定义颜色和形状
- THEN 下载的 PNG 图片样式与预览一致