Flutter 自定义矢量图标

使用系统的自带的 Icon

const Icon(Icons.star, color: Colors.red,)

Icons 是系统图标的集合

自定义 Icon

1. 去阿里图标库搜索对应的图标，选择之后然后点击下载代码 https://www.iconfont.cn/
2. 解压之后就是图标的一些文件，里面包含字体文件(ttf) 和 json 配置文件
3. 项目新建一个 fonts 文件夹，将 iconfont.ttf 字体文件拖入 fonts 文件夹
4. 在 pubspac.yaml 文件中配置 fonts

   fonts:
   - family: AppIcons
     fonts:
       - asset: fonts/iconfont.ttf
   

   然后执行 flutter pub get
5. 在 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,)