Flutter图标

1.Flutter自带图标

Flutter自带图标使用方式：通过Icon类，其中必选参数是icon: IconData，可以用Icons类来选择图标：

Icon(Icons.xxx)

Icon类的主要参数

参数名称	功能
icon: IconData	必选参数，可以用Icons.xxx来指定图标
size: double	指定图标尺寸
color: Color	指定图标颜色

2.使用自定义图标（iconfont）

这里演示了从iconfont中导入多个图标素材的方式

• 将图标素材加入iconfont的购物车中
• 点击下载，会下载一个压缩包，压缩包中包含.ttf文件，图标都在这里，可以通过引入这个.ttf来使用图标

1.下面是导入.ttf到flutter项目中的步骤

• 将.ttf放入项目目录下
• 在pubspec.yaml中添加font的选项，如下：

  fonts:
  - family: MyIconFonts
    fonts:
      - asset: fonts/iconfont.ttf
        style: italic

其中，family是导入的字体的名称，asset是导入字体的地址

2.编写font.dart，即自定义图标的文件

import 'package:flutter/material.dart';

class Font {
  static const IconData a1 = IconData(
    //codePoint是图标的unicode编码，iconfont会在压缩包中的json中提供。注意0x开头
    0xe63b,
    //字体名称，是在pubspec.yaml中配置的font->family名称
    fontFamily: "MyIconfonts",
    //根据文字方向绘制图标（从左向右-从右向左）
    matchTextDirection: true,
  );

  static const IconData a2 = IconData(
    0xe63c,
    fontFamily: "MyIconfonts",
    matchTextDirection: true,
  );
}

以上部分内容总结自课程 https://www.bilibili.com/video/BV1S4411E7LY