gavin/font2pic
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

2 Releases 2 Tags

RSS Feed
  • v1.0.1 a582bf09a8
    Compare

    v1.0.1 Stable

    gavin released this 2026-02-11 11:06:37 +08:00 | 34 commits to main since this release

    发布时间：2026年2月9日
    版本定位：小程序 UI 优化与布局完善

    里程碑与亮点

    • 全面适配 Figma 设计稿，UI 风格统一
    • 选择/已收藏区域改为自适应高度（flex fill）
    • 搜索框默认完整展开显示
    • 复选框图标始终显示，状态切换更直观
    • 收藏图标区分已收藏（红心）和未收藏（白心）
    • 新增底部版权说明

    核心特性

    布局优化

    • 选择和已收藏区域从固定高度改为 flex fill，自适应屏幕
    • 统一三个区域（预览、选择、已收藏）的边框颜色为 #3EE4C3
    • 统一容器 padding 为 8rpx
    • 移除多余的嵌套 padding，避免边距叠加

    图标系统完善

    • 复选框：checkbox.svg（选中）、checkbox-no.svg（未选中）
    • 收藏：favorite.svg（未收藏）、favorite-red.svg（已收藏）
    • 分类全选：selectall.svg / unselectall.svg
    • 导出按钮：download.svg、export-svg-s.svg、export-png-s.svg

    对齐修复

    • "选择"文字与搜索框垂直居中对齐
    • "选择"和"已收藏"标题水平对齐
    • 覆盖全局样式污染（padding/margin）

    基础功能

    • 文本输入 + 实时预览
    • 字体搜索、分类树、收藏管理
    • SVG/PNG 导出（远端 API 渲染）
    • 字体大小滑块调节
    • 颜色选择器

    技术实现

    • 框架：微信小程序原生
    • 渲染：远端 API（apiserver）
    • 状态：本地存储（wx.setStorageSync）
    • 图标：本地 SVG 文件（/assets/icons/）

    项目结构

    miniprogram/
├── pages/index/          # 首页
│   ├── index.wxml        # 页面结构
│   ├── index.wxss        # 样式
│   └── index.js          # 逻辑
├── assets/icons/         # 图标资源
├── utils/mp/             # 小程序工具函数
└── app.js/json/wxss      # 应用配置

    设计理念

    • 遵循 Figma 设计稿，保持视觉一致性
    • 适配小程序原生组件限制（如 input 最小高度）
    • 简化图标状态切换逻辑，提升代码可维护性

    下载和安装

    系统要求

    • 微信开发者工具 1.06+
    • Node.js 18+（用于 apiserver）

    快速开始

    1. 克隆仓库
    2. 微信开发者工具导入 miniprogram/ 目录
    3. 部署 apiserver（详见 apiserver/README.md）
    4. 编译运行

    生产构建

    1. 配置合法域名：fonts.biboer.cn
    2. 上传代码并提交审核

    支持和反馈

    Downloads