From 9fa3c3d909ed810a20bb6b4e01f8126c8921e0b5 Mon Sep 17 00:00:00 2001 From: Max Date: Thu, 10 Jul 2025 09:53:18 +0800 Subject: [PATCH] First commit --- README.md | 339 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 339 insertions(+) create mode 100644 README.md diff --git a/README.md b/README.md new file mode 100644 index 0000000..24a64aa --- /dev/null +++ b/README.md @@ -0,0 +1,339 @@ +# YX Icon Fonts + +学习官OA系统图标字体库，基于iconfont.ttf和iconfont.json生成的Flutter图标库。 + +## 特性 + +- 🎨 包含50+个精心设计的图标 +- 📱 支持Flutter应用 +- 🎯 类型安全的图标使用 +- 📦 轻量级，无额外依赖 +- 🔧 易于集成和使用 +- ⚡ 自动化生成脚本 + +## 安装 + +在您的`pubspec.yaml`文件中添加依赖： + +```yaml +dependencies: + yx_icon_fonts: ^1.0.0 +``` + +然后运行： + +```bash +flutter pub get +``` + +## 使用方法 + +### 基本用法 + +```dart +import 'package:flutter/material.dart'; +import 'package:yx_icon_fonts/yx_icon_fonts.dart'; + +class MyWidget extends StatelessWidget { + @override + Widget build(BuildContext context) { + return Icon( + YXIconFonts.iconMsgContacts, + size: 24, + color: Colors.blue, + ); + } +} +``` + +### 使用YXIcon组件 + +```dart +import 'package:flutter/material.dart'; +import 'package:yx_icon_fonts/yx_icon_fonts.dart'; + +class MyWidget extends StatelessWidget { + @override + Widget build(BuildContext context) { + return YXIcon( + YXIconFonts.iconMsgContacts, + size: 24, + color: Colors.blue, + ); + } +} +``` + +### 在AppBar中使用 + +```dart +AppBar( + title: Text('我的应用'), + actions: [ + IconButton( + icon: Icon(YXIconFonts.iconMsgSearch), + onPressed: () { + // 搜索操作 + }, + ), + ], +) +``` + +## 可用图标 + +### 消息相关图标 +- `YXIconFonts.iconMsgContacts` - 联系人 +- `YXIconFonts.iconMsgViedo` - 视频 +- `YXIconFonts.iconMsgSearch` - 搜索 +- `YXIconFonts.iconMsgCall` - 通话 +- `YXIconFonts.iconMsgPhoto` - 照片 +- `YXIconFonts.iconMsgImg` - 图片 +- `YXIconFonts.iconMsgFile` - 文件 + +### 箭头相关图标 +- `YXIconFonts.icon32Arrowright` - 右箭头32 +- `YXIconFonts.icon44Arrowleft` - 左箭头44 +- `YXIconFonts.icon44Arrowright` - 右箭头44 +- `YXIconFonts.icon24Arrowleft` - 左箭头24 +- `YXIconFonts.icon24Arrowdown` - 下箭头24 +- `YXIconFonts.icon44Arrowright1` - 右箭头44(1) + +### 编辑相关图标 +- `YXIconFonts.icon44Edit` - 编辑44 +- `YXIconFonts.icon24Edit` - 编辑24 +- `YXIconFonts.icon36Editline` - 编辑线36 + +### 个人中心相关图标 +- `YXIconFonts.icon44MePassword` - 密码 +- `YXIconFonts.icon44MeHelp` - 帮助 +- `YXIconFonts.icon44MeVersion` - 版本 +- `YXIconFonts.icon44MePrivacy` - 隐私 +- `YXIconFonts.icon44MeUser` - 用户 +- `YXIconFonts.icon44MeSafe` - 安全 +- `YXIconFonts.icon44MePhone` - 手机 + +### 功能图标 +- `YXIconFonts.icon32Filter` - 筛选 +- `YXIconFonts.icon36Question` - 问题 +- `YXIconFonts.icon36Onlysee` - 仅查看 +- `YXIconFonts.icon36Hint` - 提示 +- `YXIconFonts.icon24Switch` - 切换 + +### 操作图标 +- `YXIconFonts.icon44Delete` - 删除44 +- `YXIconFonts.icon36Delete` - 删除36 +- `YXIconFonts.icon24Delete` - 删除24 +- `YXIconFonts.icon44More` - 更多 +- `YXIconFonts.icon44More2` - 更多2 +- `YXIconFonts.icon24Copy` - 复制 +- `YXIconFonts.icon44Share` - 分享 +- `YXIconFonts.icon44Calendar` - 日历 + +### 添加相关图标 +- `YXIconFonts.icon24Add` - 添加24 +- `YXIconFonts.icon24Plus` - 加号 +- `YXIconFonts.icon44Add` - 添加44 +- `YXIconFonts.icon32Add` - 添加32 + +### 消息功能图标 +- `YXIconFonts.icon56Msgadd` - 消息添加 +- `YXIconFonts.icon56Msgface` - 消息表情 +- `YXIconFonts.icon56Msgvoice` - 消息语音 + +### 其他图标 +- `YXIconFonts.icon36Team` - 团队 +- `YXIconFonts.icon32Student` - 学生 +- `YXIconFonts.icon44Keyboard` - 键盘 +- `YXIconFonts.icon24Minus` - 减号 +- `YXIconFonts.icon44Quitlite` - 退出轻量 +- `YXIconFonts.icon32Quit` - 退出32 +- `YXIconFonts.icon44Quit` - 退出44 + +## 示例 + +运行示例应用查看所有图标： + +```bash +cd example +flutter run +``` + +## 自定义 + +### 修改图标大小 + +```dart +Icon( + YXIconFonts.iconMsgContacts, + size: 48, // 自定义大小 +) +``` + +### 修改图标颜色 + +```dart +Icon( + YXIconFonts.iconMsgContacts, + color: Colors.red, // 自定义颜色 +) +``` + +### 在主题中使用 + +```dart +Theme( + data: Theme.of(context).copyWith( + iconTheme: IconThemeData( + color: Colors.blue, + size: 24, + ), + ), + child: Icon(YXIconFonts.iconMsgContacts), +) +``` + +## 开发 + +### 自动化生成脚本 + +项目提供了 `generate.sh` 脚本来自动化图标数据的生成过程。 + +#### 脚本功能 + +- 🔄 自动生成图标数据文件 (`lib/src/yx_icon_fonts_data.dart`) +- 📝 自动生成示例文件 (`example/lib/icons.dart`) +- ✅ 错误检查和验证 +- 🎨 彩色输出和进度提示 + +#### 使用方法 + +```bash +# 生成所有文件（默认） +./generate.sh + +# 只生成图标数据 +./generate.sh icons + +# 只生成示例文件 +./generate.sh example + +# 显示帮助信息 +./generate.sh help +``` + +#### 脚本选项 + +| 选项 | 功能 | 生成文件 | +|------|------|----------| +| `all` (默认) | 生成所有文件 | `lib/src/yx_icon_fonts_data.dart` + `example/lib/icons.dart` | +| `icons` | 只生成图标数据 | `lib/src/yx_icon_fonts_data.dart` | +| `example` | 只生成示例文件 | `example/lib/icons.dart` | +| `help` | 显示帮助信息 | - | + +#### 使用示例 + +```bash +# 首次使用，确保脚本有执行权限 +chmod +x generate.sh + +# 生成所有文件 +./generate.sh + +# 只更新图标数据（当修改了 iconfont.json 时） +./generate.sh icons + +# 只更新示例文件（当修改了图标数据时） +./generate.sh example +``` + +#### 脚本输出示例 + +``` +ℹ️ 开始生成所有文件... + +ℹ️ 正在生成图标数据... +✅ 图标数据生成完成 + +ℹ️ 正在生成示例文件... +✅ 示例文件生成完成 + +✅ 所有文件生成完成！ +``` + +### 项目结构 + +``` +yx_icon_fonts/ +├── lib/ +│ ├── yx_icon_fonts.dart # 主库文件 +│ ├── main.dart # 库入口文件 +│ └── src/ +│ ├── yx_icon_data.dart # 图标数据类 +│ ├── yx_icon.dart # 图标组件 +│ └── yx_icon_fonts_data.dart # 图标常量定义（自动生成） +├── fonts/ +│ └── iconfont.ttf # 字体文件 +├── scripts/ +│ ├── generate_icons.dart # 图标数据生成脚本 +│ ├── generate_example.dart # 示例文件生成脚本 +│ └── utils.dart # 共享工具函数 +├── example/ +│ └── lib/ +│ ├── main.dart # 示例应用 +│ └── icons.dart # 示例图标文件（自动生成） +├── generate.sh # 自动化生成脚本 +├── iconfont.json # 图标配置数据 +├── pubspec.yaml # 包配置 +└── README.md # 项目文档 +``` + +### 更新图标 + +1. 替换 `fonts/iconfont.ttf` 文件 +2. 更新 `iconfont.json` 文件 +3. 运行生成脚本： + ```bash + ./generate.sh icons + ``` +4. 更新版本号 + +### 开发工作流 + +1. **修改图标源文件**： + - 更新 `fonts/iconfont.ttf` + - 更新 `iconfont.json` + +2. **生成代码**： + ```bash + ./generate.sh + ``` + +3. **测试**： + ```bash + flutter analyze + flutter test + cd example && flutter run + ``` + +4. **发布**： + ```bash + flutter pub publish + ``` + +## 许可证 + +MIT License + +## 贡献 + +欢迎提交Issue和Pull Request！ + +## 更新日志 + +### 1.0.0 +- 初始版本 +- 包含50+个图标 +- 支持Flutter 3.0+ +- 添加自动化生成脚本 +- 优化项目结构和文档 \ No newline at end of file