flutter pub add icon_picker基于插件公开信息、社区数据与项目使用情况整理的选型参考。
Icon Picker 是一个 Flutter 包，提供了一个对话框小部件，用于轻松显示图标集合以供选择。它允许用户选择一个图标，并以 JSON 格式返回所选图标的数据显示。设计简洁且易于集成，支持自定义图标集，非常适合需要在表单或设置中进行图标选择的应用程序。该包轻量且专注于可用性，使 UI 工作流程中的实现变得简单直接。
以下为关联源码仓库的 README 原文快照，最新内容请访问源码仓库。
A Flutter widget to show an icon collection to pick.
This widget extend TextField and has a similar behavior as TextFormField
In the pubspec.yaml of your flutter project, add the following dependency:
dependencies:
...
icon_picker: "^2.1.0"
In your library add the following import:
import 'package:icon_picker/icon_picker.dart';
For help getting started with Flutter, view the online documentation.
IconPicker use an internal MaterialIcon collection by default, but you can set your own icon collection.
You just need to pass in iconCollection param a Map<String, IconData>.
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),
);
The result of val in onChanged, validator and onSaved will be a json String.
So, if you tap the icon ac_unit in the dialog window, the result value will be:
'{"iconName": "ac_unit", "codePoint": 60219, "fontFamily": "MaterialIcons"}'
Transforming the String result of IconPicker in an IconData:
String value = '{"iconName": "ac_unit", "codePoint": 60219, "fontFamily": "MaterialIcons"}'
var iconDataJson = jsonDecode(value);
IconData icon = IconData(iconDataJson['codePoint'], fontFamily: iconDataJson['fontFamily']);
Icon(icon);
暂无相关数据。