图标系统
Kkbar 提供完整的图标管理系统，支持 6 种图标来源，满足不同场景需求。
图标来源
| 来源 | 数量 | 离线可用 | 可着色 | 文档 |
|---|---|---|---|---|
| 📦 内置 SVG | 5 个 | ✅ | ✅ | 内置图标 |
| 🎨 FontAwesome | 675+ 个 | ✅ | ✅ | FontAwesome |
| 🅱️ Bootstrap Icons | 300+ 个 | ✅ | ✅ | Bootstrap Icons |
| 📥 导入图片 | 自定义 | ✅ | ❌ | 导入图标 |
| ✏️ SVG 生成器 | 自定义 | ✅ | ✅ | SVG 生成器 |
| 🎨 图标颜色 | - | - | - | 图标颜色 |
图标选择器
在创建或编辑按钮或分类时，点击图标区域会弹出图标选择器。
工具栏按钮
| 按钮 | 功能 |
|---|---|
| 🔗 Iconfont | 打开 iconfont.cn 图标库（需联网） |
| 🔗 FontAwesome | 打开 fontawesome.com 官方图标库（需联网） |
| 📥 导入 | 导入本地图片文件 |
| ✏️ 生成 | 打开 SVG 文字图标生成器 |
| 📋 粘贴 | 粘贴 SVG 代码导入 |
| ✕ 关闭 | 关闭图标选择器 |
过滤按钮
图标大小控制栏右侧有四个过滤按钮：
| 按钮 | 功能 |
|---|---|
| FA | 显示/隐藏 FontAwesome 图标 |
| BI | 显示/隐藏 Bootstrap Icons 图标 |
| 内置 | 显示/隐藏内置 SVG 图标 |
| 导入 | 显示/隐藏用户导入的图标 |
点击按钮切换显示/隐藏状态，多个按钮可以同时激活组合筛选。
搜索功能
- 支持关键词搜索，实时过滤
- 搜索不区分大小写
- 输入图标名称（如
play、save、search）即可快速定位
图标大小
拖动图标大小滑块调整显示大小（32px - 128px，步长 4px），点击 重置 恢复默认大小（72px）。
设置图标
为按钮设置图标
- 在设置面板中添加或编辑按钮
- 点击按钮的图标区域
- 在图标选择器中选择图标
- 点击确认
为分类设置图标
- 在设置面板中找到要设置图标的分类
- 点击分类的图标区域
- 在图标选择器中选择图标
- 点击确认
图标操作
| 操作 | 说明 |
|---|---|
| 左键点击 | 选中图标 |
| 右键点击 | 删除导入的图标（内置/FA/BI 不可删除） |
| 长按 | 打开颜色编辑器（仅支持着色的图标类型） |
| 拖拽调整大小 | 滑块控制图标显示尺寸 |