select_form_field

一个 Flutter 选择字段小部件。它在下拉菜单中显示选项列表。
此小部件扩展了 TextField，其行为与 TextFormField 相似。

用法

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

dependencies:
  ...
  select_form_field: "^1.0.0"

在您的库中添加以下导入

import 'package:select_form_field/select_form_field.dart';

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

示例

通过传递 List map 来设置项目

  • value: [String],
  • textStyle: [TextStyle | null],
  • label: [String | null],
  • icon: [Widget | null],
  • enable: [bool | null],
final List<Map<String, dynamic>> _items = [
  {
    'value': 'boxValue',
    'label': 'Box Label',
    'icon': Icon(Icons.stop),
  },
  {
    'value': 'circleValue',
    'label': 'Circle Label',
    'icon': Icon(Icons.fiber_manual_record),
    'textStyle': TextStyle(color: Colors.red),
  },
  {
    'value': 'starValue',
    'label': 'Star Label',
    'enable': false,
    'icon': Icon(Icons.grade),
  },
];

SelectFormField(
  initialValue: 'circle',
  icon: Icon(Icons.format_shapes),
  labelText: 'Shape',
  items: _items,
  onChanged: (val) => print(val),
  onSaved: (val) => print(val),
);

onChanged、validator 和 onSaved 中 val 的结果将是一个 String。
因此，如果您在 select 菜单中点击 Box Label 项目，结果将是 boxValue。

select_form_field

GitHub

https://github.com/m3uzz/select_form_field