使用系统的自带的 Icon
const Icon(Icons.star, color: Colors.red,)
Icons 是系统图标的集合
自定义 Icon
- 去阿里图标库搜索对应的图标,选择之后然后点击下载代码 https://www.iconfont.cn/
- 解压之后就是图标的一些文件,里面包含字体文件(ttf) 和 json 配置文件
- 项目新建一个 fonts 文件夹,将 iconfont.ttf 字体文件拖入 fonts 文件夹
- 在 pubspac.yaml 文件中配置 fonts
然后执行fonts: - family: AppIcons fonts: - asset: fonts/iconfont.ttf
flutter pub get
- 在 lib 文件夹下面新建一个 icons.dart 文件(名称随意), 创建一个 AppIcons 类(名称随意)
使用import 'package:flutter/material.dart'; class AppIcons { // 对应图标的名称,随便你怎么起名 static const IconData konglong = IconData( 0xe6eb, fontFamily: 'AppIcons', ); }
IconData
自定义图标,第一个参数是字体编码,在 json 配置文件中找到 unicode,这个就是对应的字体编码。fontFamily 是这个图标字体属于哪一个字体文件,AppIcons 是在 pubspac.yaml 文件中定义的 family 标识。
使用自定义的图标
const Icon(AppIcons.konglong, color: Colors.green,)