如何让Flutter的MultiSelectDialogField仅支持单选？求替代组件推荐

一、改造现有MultiSelectDialogField实现单选 #

MultiSelectDialogField本身支持通过maxSelections参数限制最大选择数为1，直接设置这个参数就能实现单选效果，同时保留原有搜索功能。修改后的代码如下：

MultiSelectDialogField(
  searchable: true,
  items: _itensStudent,
  title: const Text("学生"),
  selectedColor: Colors.black,
  maxSelections: 1, // 关键：限制最多选择1个选项
  decoration: BoxDecoration(
    border: Border.all(
      color: theme.primaryColor,
      width: 2,
    ),
  ),
  isDismissible: false,
  buttonText: Text(
    "选择学生",
    style: TextStyle(
      color: theme.primaryColor,
      fontSize: 16,
    ),
  ),
  chipDisplay: MultiSelectChipDisplay.none(),
  onConfirm: (results) {
    if (results.isNotEmpty) {
      // 取唯一选中的选项
      final selectedStudent = results.first;
      // 这里处理选中后的业务逻辑
    }
  },
),

设置后弹窗内用户只能选中一个选项，再次点击其他选项会自动取消之前的选择，完全符合单选需求。

二、推荐的替代组件 #

如果觉得用多选组件改单选不够直观，推荐以下两种方案：

1. Flutter原生自定义弹窗 #

用showDialog配合原生组件实现带搜索的单选弹窗，样式和逻辑完全可控：

TextButton(
  onPressed: () async {
    final selected = await showDialog<String>(
      context: context,
      builder: (context) {
        String searchText = '';
        return StatefulBuilder(
          builder: (context, setState) {
            // 根据搜索词过滤选项
            final filteredItems = _itensStudent.where((item) =>
              item.label.toLowerCase().contains(searchText.toLowerCase())
            ).toList();
            return AlertDialog(
              title: const Text("选择学生"),
              content: Column(
                mainAxisSize: MainAxisSize.min,
                children: [
                  TextField(
                    onChanged: (value) => setState(() => searchText = value),
                    decoration: const InputDecoration(hintText: "搜索学生"),
                  ),
                  const SizedBox(height: 10),
                  Expanded(
                    child: ListView.builder(
                      shrinkWrap: true,
                      itemCount: filteredItems.length,
                      itemBuilder: (context, index) {
                        final item = filteredItems[index];
                        return ListTile(
                          title: Text(item.label),
                          onTap: () => Navigator.pop(context, item.value),
                        );
                      },
                    ),
                  ),
                ],
              ),
            );
          },
        );
      },
    );
    if (selected != null) {
      // 处理选中后的业务逻辑
    }
  },
  child: Text(
    "选择学生",
    style: TextStyle(
      color: Theme.of(context).primaryColor,
      fontSize: 16,
    ),
  ),
)

这种方式无需依赖第三方包，适合需要高度定制样式的场景。

2. 第三方单选弹窗组件 #

可以使用single_select_flutter这类专门的单选弹窗组件，默认支持搜索、自定义样式，用法更贴合单选场景，无需额外配置限制规则。

内容的提问来源于stack exchange，提问作者Lucas Barreto Luz