Flutter图标管理插件iconamoon的使用
Flutter图标管理插件iconamoon的使用
iconamoon 是一个用于 Flutter 的图标包。你可以通过以下方式安装和使用它。
安装
在你的 pubspec.yaml 文件的 dependencies: 部分添加以下行：
dependencies:
iconamoon: ^0.0.3
然后运行 flutter pub get 来获取依赖项。
导入
在你的 Dart 文件中导入 iconamoon 包：
import 'package:iconamoon/iconamoon.dart';
使用
以下是一个完整的示例，展示了如何在 Flutter 应用程序中使用 iconamoon 图标。
import 'package:flutter/material.dart';
import 'package:iconamoon/iconamoon.dart';
void main() {
runApp(App());
}
class App extends StatelessWidget {
[@override](/user/override)
Widget build(BuildContext context) {
return MaterialApp(
title: 'IconaMoon Example',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: Home(),
);
}
}
class Home extends StatefulWidget {
[@override](/user/override)
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
[@override](/user/override)
Widget build(BuildContext context) {
return Scaffold(
appBar: _appBar(),
body: _body(),
);
}
// 创建应用的顶部栏
_appBar() {
return AppBar(
title: Text('IconaMoon Example'),
);
}
// 创建应用的主体部分
_body() {
return Container(
child: GridView.count(
crossAxisCount: 5,
children: [
Icon(IconaMoon.zoomOut), // 放大镜缩小图标
Icon(IconaMoon.zoomIn), // 放大镜放大图标
Icon(IconaMoon.winkingFace), // 眨眼表情图标
Icon(IconaMoon.volumeUp), // 声音增加图标
Icon(IconaMoon.volumeOff), // 声音关闭图标
Icon(IconaMoon.volumeDown), // 声音减少图标
Icon(IconaMoon.upsideDownFace), // 倒立表情图标
Icon(IconaMoon.upload), // 上传图标
Icon(IconaMoon.unavailable), // 不可用图标
Icon(IconaMoon.type), // 类型图标
Icon(IconaMoon.trendUp), // 上升趋势图标
Icon(IconaMoon.trendDown), // 下降趋势图标
Icon(IconaMoon.trashSimple), // 简单垃圾桶图标
Icon(IconaMoon.trash), // 垃圾桶图标
Icon(IconaMoon.ticket), // 门票图标
Icon(IconaMoon.synchronize), // 同步图标
Icon(IconaMoon.swap), // 交换图标
Icon(IconaMoon.store), // 商店图标
Icon(IconaMoon.starOff), // 未点亮星星图标
Icon(IconaMoon.star), // 点亮星星图标
Icon(IconaMoon.squintingFace), // 斜视表情图标
Icon(IconaMoon.sortingRight), // 右侧排序图标
Icon(IconaMoon.sortingLeft), // 左侧排序图标
Icon(IconaMoon.sortingCenter), // 中心排序图标
Icon(IconaMoon.smilingFace), // 微笑表情图标
Icon(IconaMoon.slightlySmilingFace), // 轻微微笑表情图标
Icon(IconaMoon.signY), // Y 字图标
Icon(IconaMoon.signX), // X 字图标
Icon(IconaMoon.signF), // F 字图标
Icon(IconaMoon.signTimesSquare), // 时间方块图标
Icon(IconaMoon.signTimesCircle), // 时间圆圈图标
Icon(IconaMoon.signTimes), // 时间图标
Icon(IconaMoon.signRadical), // 根号图标
Icon(IconaMoon.signPlusSquare), // 加号方块图标
Icon(IconaMoon.signPlusMinus), // 加减号图标
Icon(IconaMoon.signPlusCircle), // 加号圆圈图标
Icon(IconaMoon.signPlus), // 加号图标
Icon(IconaMoon.signPi), // 圆周率图标
Icon(IconaMoon.signPercent), // 百分比图标
Icon(IconaMoon.signMinusSquare), // 减号方块图标
Icon(IconaMoon.signMinusCircle), // 减号圆圈图标
Icon(IconaMoon.signMinus), // 减号图标
Icon(IconaMoon.signLemniscate), // 无穷符号图标
Icon(IconaMoon.signFactorial), // 阶乘图标
Icon(IconaMoon.signEqual), // 等号图标
Icon(IconaMoon.signDivisionSquare), // 除号方块图标
Icon(IconaMoon.signDivisionSlash), // 除号斜线图标
Icon(IconaMoon.signDivisionCircle), // 除号圆圈图标
Icon(IconaMoon.signDivision), // 除号图标
Icon(IconaMoon.shoppingCardRemove), // 移除购物车图标
Icon(IconaMoon.shoppingCardAdd), // 添加购物车图标
Icon(IconaMoon.shoppingCard), // 购物车图标
Icon(IconaMoon.shoppingBag), // 购物袋图标
Icon(IconaMoon.shieldYes), // 屏蔽确认图标
Icon(IconaMoon.shieldOff), // 屏蔽关闭图标
Icon(IconaMoon.shieldNo), // 屏蔽拒绝图标
Icon(IconaMoon.shield), // 屏蔽图标
Icon(IconaMoon.share2), // 分享 2 图标
Icon(IconaMoon.share1), // 分享 1 图标
Icon(IconaMoon.settings), // 设置图标
Icon(IconaMoon.send), // 发送图标
Icon(IconaMoon.search), // 搜索图标
Icon(IconaMoon.screenNormal), // 正常屏幕图标
Icon(IconaMoon.screenFull), // 全屏图标
Icon(IconaMoon.scanner), // 扫描仪图标
Icon(IconaMoon.restart), // 重启图标
Icon(IconaMoon.relievedFace), // 如释重负的表情图标
Icon(IconaMoon.questionMarkSquare), // 问号方块图标
Icon(IconaMoon.questionMarkCircle), // 问号圆圈图标
Icon(IconaMoon.profileCircle), // 圆形个人资料图标
Icon(IconaMoon.profile), // 个人资料图标
Icon(IconaMoon.printer), // 打印机图标
Icon(IconaMoon.playlist), // 播放列表图标
Icon(IconaMoon.playlistShuffle), // 播放列表随机播放图标
Icon(IconaMoon.playlistRepeatSong), // 播放列表重复播放歌曲图标
Icon(IconaMoon.playlistRepeatList), // 播放列表重复播放列表图标
Icon(IconaMoon.playerStop), // 停止图标
Icon(IconaMoon.playerStart), // 开始图标
Icon(IconaMoon.playerPrevious), // 上一首图标
Icon(IconaMoon.playerPlay), // 播放图标
Icon(IconaMoon.playerPause), // 暂停图标
Icon(IconaMoon.playerNext), // 下一首图标
Icon(IconaMoon.playerEnd), // 结束图标
Icon(IconaMoon.playCircle), // 播放圆形图标
Icon(IconaMoon.phoneOff), // 电话关闭图标
Icon(IconaMoon.phone), // 电话图标
Icon(IconaMoon.pensiveFace), // 沉思表情图标
Icon(IconaMoon.pen), // 笔图标
Icon(IconaMoon.options), // 选项图标
Icon(IconaMoon.number9Square), // 数字 9 方块图标
Icon(IconaMoon.number9Circle), // 数字 9 圆圈图标
Icon(IconaMoon.number9), // 数字 9 图标
Icon(IconaMoon.number8Square), // 数字 8 方块图标
Icon(IconaMoon.number8Circle), // 数字 8 圆圈图标
Icon(IconaMoon.number8), // 数字 8 图标
Icon(IconaMoon.number7Square), // 数字 7 方块图标
Icon(IconaMoon.number7Circle), // 数字 7 圆圈图标
Icon(IconaMoon.number7), // 数字 7 图标
Icon(IconaMoon.number6Square), // 数字 6 方块图标
Icon(IconaMoon.number6Circle), // 数字 6 圆圈图标
Icon(IconaMoon.number6), // 数字 6 图标
Icon(IconaMoon.number5Square), // 数字 5 方块图标
Icon(IconaMoon.number5Circle), // 数字 5 圆圈图标
Icon(IconaMoon.number5), // 数字 5 图标
Icon(IconaMoon.number4Square), // 数字 4 方块图标
Icon(IconaMoon.number4Circle), // 数字 4 圆圈图标
Icon(IconaMoon.number4), // 数字 4 图标
Icon(IconaMoon.number3Square), // 数字 3 方块图标
Icon(IconaMoon.number3Circle), // 数字 3 圆圈图标
Icon(IconaMoon.number3), // 数字 3 图标
Icon(IconaMoon.number2Square), // 数字 2 方块图标
Icon(IconaMoon.number2Circle), // 数字 2 圆圈图标
Icon(IconaMoon.number2), // 数字 2 图标
Icon(IconaMoon.number1Square), // 数字 1 方块图标
Icon(IconaMoon.number1Circle), // 数字 1 圆圈图标
Icon(IconaMoon.number1), // 数字 1 图标
Icon(IconaMoon.number0Square), // 数字 0 方块图标
Icon(IconaMoon.number0Circle), // 数字 0 圆圈图标
Icon(IconaMoon.number0), // 数字 0 图标
Icon(IconaMoon.notificationOff), // 通知关闭图标
Icon(IconaMoon.notification), // 通知图标
Icon(IconaMoon.news), // 新闻图标
Icon(IconaMoon.neutralFace), // 中性表情图标
Icon(IconaMoon.musicArtist), // 音乐艺术家图标
Icon(IconaMoon.musicAlbum), // 音乐专辑图标
Icon(IconaMoon.music2), // 音乐 2 图标
Icon(IconaMoon.music1), // 音乐 1 图标
Icon(IconaMoon.move), // 移动图标
Icon(IconaMoon.mouse), // 鼠标图标
Icon(IconaMoon.modeLight), // 明亮模式图标
Icon(IconaMoon.modeDark), // 暗模式图标
Icon(IconaMoon.microphoneOff), // 麦克风关闭图标
Icon(IconaMoon.microphone), // 麦克风图标
Icon(IconaMoon.menuKebabVerticalSquare), // 垂直菜单图标
Icon(IconaMoon.menuKebabVerticalCircle), // 垂直菜单圆圈图标
Icon(IconaMoon.menuKebabVertical), // 垂直菜单图标
Icon(IconaMoon.menuKebabHorizontalSquare), // 水平菜单图标
Icon(IconaMoon.menuKebabHorizontalCircle), // 水平菜单圆圈图标
Icon(IconaMoon.menuKebabHorizontal), // 水平菜单图标
Icon(IconaMoon.menuBurguerVertical), // 垂直汉堡菜单图标
Icon(IconaMoon.menuBurguerHorizontal), // 水平汉堡菜单图标
Icon(IconaMoon.lockOff), // 锁关闭图标
Icon(IconaMoon.lock), // 锁图标
Icon(IconaMoon.locationPinOff), // 位置图钉关闭图标
Icon(IconaMoon.locationPin), // 位置图钉图标
Icon(IconaMoon.location), // 位置图标
Icon(IconaMoon.linkExternal), // 外部链接图标
Icon(IconaMoon.link), // 链接图标
Icon(IconaMoon.like), // 喜欢图标
Icon(IconaMoon.lightning2), // 闪电 2 图标
Icon(IconaMoon.lightning1), // 闪电 1 图标
Icon(IconaMoon.kissingFaceWithSmilingEyes), // 微笑亲吻表情图标
Icon(IconaMoon.kissingFace), // 亲吻表情图标
Icon(IconaMoon.invoice), // 发票图标
Icon(IconaMoon.informationSquare), // 信息方块图标
Icon(IconaMoon.informationCircle), // 信息圆圈图标
Icon(IconaMoon.home), // 家图标
Icon(IconaMoon.history), // 历史记录图标
Icon(IconaMoon.heartOff), // 心脏关闭图标
Icon(IconaMoon.heart), // 心脏图标
Icon(IconaMoon.headphone), // 耳机图标
Icon(IconaMoon.gift), // 礼物图标
Icon(IconaMoon.funnel), // 漏斗图标
Icon(IconaMoon.frowningFace), // 皱眉表情图标
Icon(IconaMoon.frame), // 框架图标
Icon(IconaMoon.folderVideo), // 视频文件夹图标
Icon(IconaMoon.folderRemove), // 删除文件夹图标
Icon(IconaMoon.folderMusic), // 音乐文件夹图标
Icon(IconaMoon.folderImage), // 图片文件夹图标
Icon(IconaMoon.folderDocument), // 文档文件夹图标
Icon(IconaMoon.folderClose), // 关闭文件夹图标
Icon(IconaMoon.folderCheck), // 检查文件夹图标
Icon(IconaMoon.folderAdd), // 添加文件夹图标
Icon(IconaMoon.folder), // 文件夹图标
Icon(IconaMoon.flag), // 旗帜图标
Icon(IconaMoon.fileVideo), // 视频文件图标
Icon(IconaMoon.fileRemove), // 删除文件图标
Icon(IconaMoon.fileImage), // 图片文件图标
Icon(IconaMoon.fileDocument), // 文档文件图标
Icon(IconaMoon.fileClose), // 关闭文件图标
Icon(IconaMoon.fileCheck), // 检查文件图标
Icon(IconaMoon.fileAudio), // 音频文件图标
Icon(IconaMoon.fileAdd), // 添加文件图标
Icon(IconaMoon.file), // 文件图标
Icon(IconaMoon.faceWithOpenMouth), // 张嘴表情图标
Icon(IconaMoon.faceWithoutMouth), // 无嘴表情图标
Icon(IconaMoon.eyeOff), // 眼睛关闭图标
Icon(IconaMoon.eye), // 眼睛图标
Icon(IconaMoon.expressionlessFace), // 无表情图标
Icon(IconaMoon.exit), // 退出图标
Icon(IconaMoon.enter), // 进入图标
Icon(IconaMoon.email), // 邮件图标
Icon(IconaMoon.edit), // 编辑图标
Icon(IconaMoon.download), // 下载图标
Icon(IconaMoon.undo), // 撤销图标
Icon(IconaMoon.redo), // 重做图标
Icon(IconaMoon.dislike), // 不喜欢图标
Icon(IconaMoon.discover), // 发现图标
Icon(IconaMoon.discount), // 折扣图标
Icon(IconaMoon.disappointedFace), // 失望表情图标
Icon(IconaMoon.deliveryFree), // 免费配送图标
Icon(IconaMoon.deliveryFast), // 快速配送图标
Icon(IconaMoon.delivery), // 配送图标
Icon(IconaMoon.cursor), // 光标图标
Icon(IconaMoon.creditCard), // 信用卡图标
Icon(IconaMoon.copy), // 复制图标
Icon(IconaMoon.coonfusedFace), // 困惑表情图标
Icon(IconaMoon.component), // 组件图标
Icon(IconaMoon.compare), // 比较图标
Icon(IconaMoon.commentRemove), // 删除评论图标
Icon(IconaMoon.commentDots), // 评论点图标
Icon(IconaMoon.commentClose), // 关闭评论图标
Icon(IconaMoon.commentCheck), // 检查评论图标
Icon(IconaMoon.commentAdd), // 添加评论图标
Icon(IconaMoon.comment), // 评论图标
Icon(IconaMoon.cloudYes), // 云确认图标
Icon(IconaMoon.cloudUpload), // 云上传图标
Icon(IconaMoon.cloudRemove), // 云删除图标
Icon(IconaMoon.cloudOff), // 云关闭图标
Icon(IconaMoon.cloudNo), // 云否图标
Icon(IconaMoon.cloudError), // 云错误图标
Icon(IconaMoon.cloudDownload), // 云下载图标
Icon(IconaMoon.cloudClock), // 云时钟图标
Icon(IconaMoon.cloudAdd), // 云添加图标
Icon(IconaMoon.cloud), // 云图标
Icon(IconaMoon.cloudSquare), // 云方块图标
Icon(IconaMoon.closeCircle2), // 关闭圆形 2 图标
Icon(IconaMoon.closeCircle1), // 关闭圆形 1 图标
Icon(IconaMoon.close), // 关闭图标
Icon(IconaMoon.clock), // 时钟图标
Icon(IconaMoon.cheque), // 支票图标
Icon(IconaMoon.checkSquare), // 对勾方块图标
Icon(IconaMoon.checkCircle2), // 对勾圆形 2 图标
Icon(IconaMoon.checkCircle1), // 对勾圆形 1 图标
Icon(IconaMoon.check), // 对勾图标
Icon(IconaMoon.certificateBadge), // 证书徽章图标
Icon(IconaMoon.category), // 分类图标
Icon(IconaMoon.cameraVideo), // 视频相机图标
Icon(IconaMoon.camerImage), // 图片相机图标
Icon(IconaMoon.calendarRemove), // 删除日历图标
Icon(IconaMoon.calendarAdd), // 添加日历图标
Icon(IconaMoon.calendar2), // 日历 2 图标
Icon(IconaMoon.calendar1), // 日历 1 图标
Icon(IconaMoon.calculator), // 计算器图标
Icon(IconaMoon.briefcase), // 公文包图标
Icon(IconaMoon.box), // 盒子图标
Icon(IconaMoon.bookmarkOff), // 书签关闭图标
Icon(IconaMoon.bookmark), // 书签图标
Icon(IconaMoon.bluetooth), // 蓝牙图标
Icon(IconaMoon.badge), // 徽章图标
Icon(IconaMoon.backspace), // 退格图标
Icon(IconaMoon.attentionSquare), // 注意方形图标
Icon(IconaMoon.attentionCircle), // 注意圆形图标
Icon(IconaMoon.attachment), // 附件图标
Icon(IconaMoon.apps), // 应用图标
Icon(IconaMoon.d), // D 图标
Icon(IconaMoon.arrowUp6Circle), // 向上箭头 6 圆形图标
Icon(IconaMoon.arrowUp5Circle), // 向上箭头 5 圆形图标
Icon(IconaMoon.arrowUp4Square), // 向上箭头 4 方形图标
Icon(IconaMoon.arrowUp3Square), // 向上箭头 3 方形图标
Icon(IconaMoon.arrowUp2), // 向上箭头 2 图标
Icon(IconaMoon.arrowUp1), // 向上箭头 1 图标
Icon(IconaMoon.arrowTopRight6Circle), // 右上方箭头 6 圆形图标
Icon(IconaMoon.arrowTopRight5Circle), // 右上方箭头 5 圆形图标
Icon(IconaMoon.arrowTopRight3Square), // 右上方箭头 3 方形图标
Icon(IconaMoon.arrowTopRight2), // 右上方箭头 2 图标
Icon(IconaMoon.arrowTopRight1), // 右上方箭头 1 图标
Icon(IconaMoon.arrowTopLeft6Circle), // 左上方箭头 6 圆形图标
Icon(IconaMoon.arrowTopLeft5Circle), // 左上方箭头 5 圆形图标
Icon(IconaMoon.arrowTopLeft4Square), // 左上方箭头 4 方形图标
Icon(IconaMoon.arrowTopLeft3Square), // 左上方箭头 3 方形图标
Icon(IconaMoon.arrowTopLeft2), // 左上方箭头 2 图标
Icon(IconaMoon.arrowTopLeft1), // 左上方箭头 1 图标
Icon(IconaMoon.arrowRight6Circle), // 右箭头 6 圆形图标
Icon(IconaMoon.arrowRight5Circle), // 右箭头 5 圆形图标
Icon(IconaMoon.arrowRight4Square), // 右箭头 4 方形图标
Icon(IconaMoon.arrowRight3Square), // 右箭头 3 方形图标
Icon(IconaMoon.arrowRight2), // 右箭头 2 图标
Icon(IconaMoon.arrowRight1), // 右箭头 1 图标
Icon(IconaMoon.arrowDownRight2), // 右下方箭头 2 图标
Icon(IconaMoon.arrowLeft6Circle), // 左箭头 6 圆形图标
Icon(IconaMoon.arrowLeft5Circle), // 左箭头 5 圆形图标
Icon(IconaMoon.arrowLeft4Square), // 左箭头 4 方形图标
Icon(IconaMoon.arrowLeft3Square), // 左箭头 3 方形图标
Icon(IconaMoon.arrowLeft2), // 左箭头 2 图标
Icon(IconaMoon.arrowLeft1), // 左箭头 1 图标
Icon(IconaMoon.arrowDown6Circle), // 向下箭头 6 圆形图标
Icon(IconaMoon.arrowDown5Circle), // 向下箭头 5 圆形图标
Icon(IconaMoon.arrowDown4Square), // 向下箭头 4 方形图标
Icon(IconaMoon.arrowDown3Square), // 向下箭头 3 方形图标
Icon(IconaMoon.arrowDown2), // 向下箭头 2 图标
Icon(IconaMoon.arrowDown1), // 向下箭头 1 图标
Icon(IconaMoon.arrowBottomUp4Square), // 底部向上箭头 4 方形图标
Icon(IconaMoon.arrowBottomRight6Circle), // 右下方箭头 6 圆形图标
Icon(IconaMoon.arrowBottomRight5Circle), // 右下方箭头 5 圆形图标
Icon(IconaMoon.arrowBottomRight4Square), // 右下方箭头 4 方形图标
Icon(IconaMoon.arrowBottomRight3Square), // 右下方箭头 3 方形图标
Icon(IconaMoon.arrowBottomRight1), // 右下方箭头 1 图标
Icon(IconaMoon.arrowBottomLeft6Circle), // 左下方箭头 6 圆形图标
Icon(IconaMoon.arrowBottomLeft5Circle), // 左下方箭头 5 圆形图标
Icon(IconaMoon.arrowBottomLeft4Square), // 左下方箭头 4 方形图标
Icon(IconaMoon.arrowBottomLeft3Square), // 左下方箭头 3 方形图标
Icon(IconaMoon.arrowBottomLeft2), // 左下方箭头 2 图标
Icon(IconaMoon.arrowBottomLeft1), // 左下方箭头 1 图标
],
),
);
}
}
更多关于Flutter图标管理插件iconamoon的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html
1 回复
更多关于Flutter图标管理插件iconamoon的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
iconamoon 是一个用于 Flutter 的图标管理插件，它提供了丰富的图标资源，并且方便集成到你的 Flutter 项目中。以下是如何使用 iconamoon 插件的步骤：
1. 添加依赖
首先，你需要在 pubspec.yaml 文件中添加 iconamoon 的依赖。
dependencies:
flutter:
sdk: flutter
iconamoon: ^1.0.0 # 请确保使用最新版本
然后运行 flutter pub get 来安装依赖。
2. 导入包
在你需要使用图标的 Dart 文件中，导入 iconamoon 包。
import 'package:iconamoon/iconamoon.dart';
3. 使用图标
iconamoon 提供了多种图标，你可以像使用 Flutter 内置图标一样使用它们。
Icon(Iconamoon.icon_name), // 将 icon_name 替换为你需要的图标名称
例如，使用一个名为 home 的图标：
Icon(Iconamoon.home),
4. 查找图标名称
你可以访问 iconamoon 的官方文档或源码来查找可用的图标名称。通常，这些图标名称会以常量的形式提供，你可以直接引用它们。
5. 自定义图标大小和颜色
你可以通过 Icon 小部件的属性来自定义图标的大小和颜色。
Icon(
Iconamoon.home,
size: 30.0,
color: Colors.blue,
),
6. 使用图标按钮
你也可以在 IconButton 中使用 iconamoon 的图标。
IconButton(
icon: Icon(Iconamoon.home),
onPressed: () {
// 处理按钮点击事件
},
),
7. 其他用法
iconamoon 还支持其他用法，比如在 Text 中使用图标，或者自定义图标的样式等。你可以根据项目需求进行探索。
8. 示例代码
以下是一个完整的示例，展示了如何在 Flutter 应用中使用 iconamoon 插件。
import 'package:flutter/material.dart';
import 'package:iconamoon/iconamoon.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
[@override](/user/override)
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Iconamoon Example'),
),
body: Center(
child: Icon(
Iconamoon.home,
size: 50.0,
color: Colors.red,
),
),
),
);
}
}