更新记录

1.0.8（2026-07-08）

平台兼容性

uni-app(3.7.13)

其他

宇泽二维码小程序 - 规格说明书

1. 项目概述

项目名称

宇泽二维码 (QRCode Master)

项目类型

uni-app 跨平台小程序（支持微信、支付宝、H5等）

核心功能

一款纯前端的二维码工具集，提供二维码生成、解码、美化、模板库、拍照水印和海报合成等功能，所有数据本地存储。

目标用户

• 需要快速生成各类二维码的普通用户
• 商家需要生成店铺二维码、宣传码
• 个人需要名片、WiFi、地址等生活二维码
• 需要拍照水印和海报合成的用户

2. 技术架构

技术栈

• 框架: uni-app + Vue3 + TypeScript
• 构建工具: Vite
• 状态管理: Pinia
• 存储: localStorage + uni-app Storage API
• UI组件: uView UI（可选）或自定义组件

架构模式

• 纯前端无后端
• 所有数据存储在本地缓存
• 模块化组件设计

3. 页面结构

底部导航

• 首页 | 模板 | 相机 | 我的
• 4个Tab页面：首页、模板中心、水印相机、我的（含设置和历史）

4. 功能模块详细说明

4.1 多功能二维码生成

支持类型

1. 文本生成: 自定义文字、数字、字符输入
2. 网址链接: 自动识别URL，生成可跳转二维码
3. 图片生成: 上传本地图片转二维码（支持压缩配置）
4. TXT文档: 上传.txt文件读取内容生成二维码

交互流程

1. 用户选择内容类型
2. 输入/上传内容
3. 实时预览二维码
4. 保存到历史记录
5. 可复制内容或保存图片

历史记录

• 自动保存生成记录到本地
• 支持查看、重新生成
• 支持单条删除、清空全部

4.2 摄像头扫描解码

功能点

• 摄像头实时扫描（自动对焦、手电筒开关）
• 相册选择图片解码
• 扫描/解码结果操作：
  • 复制内容
  • 重新生成二维码
  • 打开网址（如是链接）
  • 保存到解码历史

4.3 模板中心（35+模板）

分类与模板

个人类（6个）

1. 微信加友 - ***输入
2. 手机号 - 电话号码
3. 邮箱地址 - 邮件地址
4. 个人名片 - 姓名+电话+邮箱+地址
5. 收货地址 - 详细地址
6. 个人主页 - 个人URL

生活类（6个）

7. WiFi密码 - SSID+密码+加密类型
8. 门禁信息 - 门禁卡号
9. 快递备注 - 收件信息+备注
10. 旅行清单 - 行程信息
11. 菜谱分享 - 菜名+步骤摘要
12. 书单分享 - 书名+作者

办公类（6个）

13. 会议信息 - 时间+地点+议题
14. 文件说明 - 文件名+版本+说明
15. 产品标签 - 产品名+型号+规格
16. 工位信息 - 工位号+负责人
17. 周报总结 - 工作摘要
18. 会议议程 - 议程内容

营销类（6个）

19. 店铺地址 - 店名+地址+电话
20. 营业时间 - 店名+营业时段
21. 店铺简介 - 店名+简介+联系方式
22. 引导关注 - 平台+账号
23. 优惠券 - 券名+优惠内容+有效期
24. 产品促销 - 产品+价格+促销内容

文本类（6个）

25. 表白文案 - 自定义文本
26. 祝福信息 - 祝福语+署名
27. 备忘录 - 备忘内容
28. 名言警句 - 名言+出处
29. 歌词分享 - 歌词内容
30. 诗歌分享 - 诗歌内容

系统类（5个）

31. 日历事件 - 事件标题+时间+地点+描述
32. 联系方式 - 多种联系方式整合
33. 车牌绑定 - 车牌+车主信息
34. 会员信息 - 会员号+积分+等级
35. 活动邀请 - 活动名+时间+地点+RSVP

模板功能

• 点击模板 → 自动填充表单 → 用户修改 → 一键生成
• 支持收藏模板
• 收藏记录本地缓存

4.4 二维码高级美化

Logo设置

• 上传中心Logo
• 支持裁剪、圆角、大小调整

尺寸调整

• 固定档位：小(128px) / 中(256px) / 大(384px) / 超大(512px)

颜色设置

• 单点色：纯色二维码
• 线性渐变：两种颜色线性过渡
• 径向渐变：两种颜色中心向外渐变
• 前景色、背景色独立配置

文字装饰

• 位置：顶部、底部、左侧、右侧
• 属性：字体大小、颜色、粗体

边框样式

• 开关控制
• 宽度、颜色、圆角配置

预设功能

• 保存当前配置为预设
• 预设列表本地缓存

4.5 带水印相机

水印叠加（三层）

1. 时间水印: 年-月-日 时:分:秒（精确到秒）
2. 地点水印: 城市+街道（定位获取）
3. 二维码水印: 二维码内容 = 拍摄时间 + 拍摄地点

水印调整

• 大小调整
• 透明度调整
• 位置选择：左上、左下、右上、右下

拍摄功能

• 调用相机拍摄
• 直接保存到本地相册
• 支持相册选择图片添加水印（非拍摄）

4.6 海报二维码合成

流程

1. 上传海报背景图（相册选择）
2. 框选/点击确定二维码放置区域
3. 输入二维码内容
4. 生成二维码并放置指定位置

调整功能

• 二维码大小、位置拖拽
• 添加文字（标题、备注）
• 位置自由布局

输出

• 高清保存到本地相册
• 保存历史记录
• 支持重新编辑

5. 数据存储方案

存储结构

localStorage: {
  // 生成历史
  generateHistory: [
    { id, type, content, qrDataUrl, createTime }
  ],
  // 解码历史
  decodeHistory: [
    { id, content, source, createTime }
  ],
  // 模板收藏
  templateFavorites: [templateId, ...],
  // 美化预设
  beautifyPresets: [
    { id, name, config: { colors, logo, text, border } }
  ],
  // 海报历史
  posterHistory: [
    { id, background, qrConfig, textList, createTime }
  ],
  // 用户设置
  userSettings: {
    watermarkPosition: 'right-bottom',
    defaultQrSize: 'medium',
    cameraFlash: false
  }
}

6. UI设计规范

主题色

• 主色: #1890FF (科技蓝)
• 辅助色: #52C41A (成功绿)
• 警告色: #FAAD14 (橙色)
• 错误色: #FF4D4F (红色)
• 背景色: #F5F5F5 (浅灰)
• 文字色: #333333 (深灰)

字体

• 主字体: PingFang SC, -apple-system, sans-serif
• 标题: 18-20px, font-weight: 600
• 正文: 14-16px, font-weight: 400
• 辅助文字: 12px, color: #999999

间距

• 页面边距: 16px
• 模块间距: 16px
• 元素间距: 8-12px
• 圆角: 8px (卡片), 4px (按钮)

组件规范

• 卡片阴影: 0 2px 8px rgba(0,0,0,0.08)
• 按钮高度: 44px (标准)
• 输入框高度: 40px
• 图标大小: 24px (标准), 32px (大)

7. 验收标准

功能验收

• [ ] 四大类型二维码生成正常
• [ ] 扫描解码功能正常
• [ ] 35+模板全部可用
• [ ] 美化功能完整（颜色、logo、文字、边框）
• [ ] 水印相机三层水印正常
• [ ] 海报合成功能完整
• [ ] 历史记录增删查正常
• [ ] 数据本地持久化正常

性能验收

• [ ] 页面切换流畅
• [ ] 二维码生成<1秒
• [ ] 扫描识别<2秒

兼容性验收

• [ ] 微信小程序正常
• [ ] H5浏览器正常