icon_picker

一个用于显示图标集合以供选择的Flutter小部件。该小部件扩展了TextField，其行为与TextFormField类似。

用法

在您的 flutter 项目的 pubspec.yaml 文件中，添加以下依赖项

dependencies:
  ...
  icon_picker: "^1.1.0"

在您的库中添加以下导入

import 'package:icon_picker/icon_picker.dart';

要开始使用 Flutter，请查看在线 文档。

示例

IconPicker默认使用内部的MaterialIcon集合，但您可以设置自己的图标集合。
您只需将Map<String, IconData>传递给iconCollection参数即可。

final Map<String, IconData> myIconCollection = {
  'favorite': Icons.favorite,
  'home': Icons.home,
  'android': Icons.android,
  'album': Icons.album,
  'ac_unit': Icons.ac_unit,
  ...
}

IconPicker(
  initialValue: 'favorite',
  icon: Icon(Icons.apps),
  labelText: "Icon",
  title: "Select an icon",
  cancelBtn: "CANCEL",
  enableSearch: true,
  searchHint: 'Search icon',
  iconCollection: myIconCollection,
  onChanged: (val) => print(val),
  onSaved: (val) => print(val),
);

onChanged、validator和onSaved中的val结果将是一个json字符串。
因此，如果您在对话框中点击ac_unit图标，结果值将是

'{"iconName": "ac_unit", "codePoint": 60219, "fontFamily": "MaterialIcons"}'

将IconPicker的String结果转换为IconData

String value = '{"iconName": "ac_unit", "codePoint": 60219, "fontFamily": "MaterialIcons"}'
var iconDataJson = jsonDecode(value);
IconData icon = IconData(iconDataJson['codePoint'], fontFamily: iconDataJson['fontFamily']);
Icon(icon);

icon_picker

GitHub

https://github.com/m3uzz/icon_picker