可选列表

显示一个可选择项目列表的小部件

当选中列表中的某一项时，列表中的其他元素会动画移出，只留下选中的值。再次点击该值时，其他值会动画移回列表中。

Example app

特点

  • 当您想允许用户从列表中选择一个元素，并且在选中时只显示该元素时，请使用此包。

  • 基于 Flutter AnimatedList 小部件

用法

导入包

import 'package:selectable_list/selectable_list.dart';

使用小部件

class _ScrollableListExampleState extends State<_ScrollableListExample> { final persons = [ Person("Ella", 3), Person("James", 25), Person("Gertrude", 99) ]; String? selectedName; @override Widget build(BuildContext context) { return SelectableList<Person, String?>( items: persons, itemBuilder: (context, person, selected, onTap) => ListTile( title: Text(person.name), subtitle: Text('${person.age.toString()} 岁'), selected: selected, onTap: onTap), valueSelector: (person) => person.name, selectedValue: selectedName, onItemSelected: (person) => setState(() => selectedName = person.name), onItemDeselected: (person) => setState(() => selectedName = null), ), } }

使用示例

Forms

在移动设备上让表单更整洁、更紧凑非常有用

Example in a form

GitHub

查看 Github