使用系統(tǒng)的自帶的 Icon
const Icon(Icons.star, color: Colors.red,)
Icons 是系統(tǒng)圖標的集合
自定義 Icon
- 去阿里圖標庫搜索對應的圖標,選擇之后然后點擊下載代碼 https://www.iconfont.cn/
- 解壓之后就是圖標的一些文件,里面包含字體文件(ttf) 和 json 配置文件
- 項目新建一個 fonts 文件夾,將 iconfont.ttf 字體文件拖入 fonts 文件夾
- 在 pubspac.yaml 文件中配置 fonts
然后執(zhí)行fonts: - family: AppIcons fonts: - asset: fonts/iconfont.ttfflutter pub get - 在 lib 文件夾下面新建一個 icons.dart 文件(名稱隨意), 創(chuàng)建一個 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,)