我有一个ListView.builder,它返回一个InkWell,其子Container保存一个数组的值,我在onTap _selectedIndex = index;内部实现了这样做,以 Select 所单击的数组中的每一项,并在另一项被单击时取消 Select ,这非常有效,但现在我喜欢一种可以使我在一行中 Select 多项的变通方法(例如:如果我有一个项[1,2,3]的数组,则允许单击1-2-2-3,但当try 单击1-3时,它不应该被允许并显示错误消息).以下是我的代码:


String time_slot;
int _selectedIndex = -1;

 Container(
            height: 50,
            child:new ListView.builder(
                    scrollDirection: Axis.horizontal,
                    itemCount: dataSchedule == null ? 0 : dataSchedule.length,
                    itemBuilder: (BuildContext context, int index){
                      return  InkWell(onTap: (){ setState(() {
                                                              time_slot = dataSchedule[index]['time_slot'];

                                                                _selectedIndex= index;
                                                            

                                                            });
                                                          },

                                                          child: Container(

                                                          padding: EdgeInsets.all(0),
                                                          child: Card(
                                                              color: Colors.white,
                                                              elevation: 0,
                                                              semanticContainer: true,
                                                              shape: RoundedRectangleBorder(
                                                                  borderRadius: BorderRadius.circular(5.0),

                                                              ),
                                                              child: Container(
                                                                  decoration:
                                                                  BoxDecoration(
                                                                      color: Colors.white,
                                                                      borderRadius:
                                                                      BorderRadius
                                                                          .circular(
                                                                          3.0),
                                                                      border:Border.all(color:scheduleField=="field require"?Colors.red: index== _selectedIndex  ?
                                                                      colorBlue :
                                                                      Colors.grey[200],width: 2)),
                                                                padding: EdgeInsets.all(10),
                                                                  child:Center(
                                                                    child: Text(
                                                                      dataSchedule[index]['time_slot'],style:TextStyle(fontFamily: 'Montserrat',
                                                                      color: colorBlack, fontWeight: FontWeight.bold,
                                                                      fontSize: 15),
                                                                      textAlign: TextAlign.center,
                                                                    ),
                                                                  ),))));
                                                    }
                                                ),


                                              ),

我将非常感谢任何贡献,如果有任何需要的信息,我将很乐意提供.先谢谢你.

推荐答案

经过这么多的研究后,我能够通过使用FIFTER包来解决这个问题 flutter_multi_select_items,我用以下代码实现了它:

 MultiSelectContainer(
    itemsPadding: const EdgeInsets.all(10),
    textStyles: const MultiSelectTextStyles(
    textStyle: TextStyle(fontFamily: 'Montserrat', 
     fontWeight:FontWeight.bold,)),
     showInListView: true,
     listViewSettings: ListViewSettings( scrollDirection: Axis.horizontal,
                        separatorBuilder: (_, __) => const SizedBox(
                                                          width: 10,
                                                        )),
                                                    items: List.generate(dataSchedule == null ? 0 : dataSchedule.length,
                                                            (index) => MultiSelectCard(value: dataSchedule[index]['time_slot'], label: dataSchedule[index]['time_slot'],)),
                                                    onChange: (allSelectedItems, selectedItem) {


                                                    })

Flutter相关问答推荐

在Flutter 中将参数从一个类传递到另一个类

来自FutureProvider的数据只打印两个不同的变量,它们对一个实例只有一次相同的值,为什么?

如何在Flutter 中不从getX库中初始化GetxController中的变量

TextFormfield无法与自动路由一起正常工作

有没有一种正确的方法可以通过上下滑动在两个小部件(在我的情况下是应用程序栏)之间切换?

Firebase动态链接已弃用,不应在新项目中使用.Flutter 替代方案

Flutter 渲染HTML和数学(LaTeX和Katex)

使索引[0]在ListViewBuilder中返回字符串1

如何给按钮的边框半径?

Flutter:注册 UI 出现 UI 问题(将注册框提升到顶部并向电话号码 pin 码添加一个框)

Flutter Dismissible 不会在 startToEnd 滑动时被关闭

Flutter屏幕适配 - 在模拟器和真实手机上文本尺寸不同

在 Flutter 中显示有关提供者通知的对话框

通过一个具体的例子理解Flutter约束的本质

如何在 Flutter 执行通知时运行后台代码?

单元测试中如何比较NaN和NaN是否相等

如何使用列Flutter 中文本占用的空间来控制svg宽度

在 Flutter 中,如何使用文本字段和方形图像进行行布局

是否可以在 Flutter 中使用 ToggleButtons 在页面 PageView 之间切换?

Flutter Bloc Todo 示例 - 收听存储库中的单个 todo