为您提供一个文本框和配套控制器,用户可以通过它以视觉方式键入分隔列表,例如电子邮件收件人列表。

特点

  • 输入即创建列表的文本框
  • 可用于其他文本框以实现更多自定义的便捷控制器。
  • 使用正常的退格键从列表中删除。

screenshot

demo video

入门

将包添加到您的项目 pubspec.yaml

    listtextfield: any

在项目文件中导入包

    import "package:listtextfield/listtextfield.dart";

用法

使用用户应键入的列表分隔符创建ListTextEditingController

 final _controller = ListTextEditingController(',');

您还可以通过提供可选的字符串集来用列表中的一些项初始化您的控制器。

 final _controller = ListTextEditingController(',', {'InitialItem1', 'InitialItem2',});

ListTextField小部件添加到您的窗口小部件树并提供控制器

 Widget build(BuildContext context){
    return Column(
        children: [
            ListTextField(
                controller: _controller, 
                itemBuilder: (ctx, item){
                    // Build how items in the list should appear
                    return Chip(
                    label: Text(value),
                    onDeleted: () => _controller.removeItem(value),
                    );
                }
            ),
        ],
    );
 }

通过在控制器上调用items来访问键入的列表

    final myItems = _controller.items; 

有关更多信息,请参阅示例

附加信息

欢迎贡献。发现问题?报告它。如果您发现此包有用或有趣,请在GitHub上点赞??或给个⭐️。

MajorE ?♦️

GitHub

查看 Github