ListView Flutter 的单选

2024-02-15

我正在尝试实施一个listView在我的应用程序中进行单选,这样一旦点击列表中的项目,按下的项目颜色状态就会与其他项目不同。我已经做了我所知道的一切,但效果并不好。问题是,即使我的实现在按下时更新每个项目的状态,它也不会将其他项目重置为其初始状态。

class BoxSelection{
  bool isSelected;
  String title;
  String options;
  BoxSelection({this.title, this.isSelected, this.options});
}


class _AddProjectState extends State<AddProject> {
  List<BoxSelection> projectType = new List();
  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    projectType
        .add(BoxSelection(title: "Building", isSelected: false, options: "A"));
    projectType
        .add(BoxSelection(title: "Gym House", isSelected: false, options: "B"));
    projectType
        .add(BoxSelection(title: "School", isSelected: false, options: "C"));
  }

  child: ListView.builder(
                      itemCount: projectType.length,
                      itemBuilder: (BuildContext context, int index) {
                        return GestureDetector(
                          onTap: () {
                            setState(() {
       //here am trying to implement single selection for the options in the list but it don't work well
                              for(int i = 0; i < projectType.length; i++) {
                                if (i == index) {
                                  setState(() {
                                    projectType[index].isSelected = true;
                                  });
                                } else {
                                  setState(() {
                                    projectType[index].isSelected = false;
                                  });
                                }
                              }
                            });
                          },
                          child: BoxSelectionButton(
                            isSelected: projectType[index].isSelected,
                            option: projectType[index].options,
                            title: projectType[index].title,
                          ),
                        );
                      },
                    ),

你的问题是你正在使用index访问projectType元素,但你应该使用i

if (i == index) {
    setState(() {
    projectType[i].isSelected = true;
    });
} else {
    setState(() {
    projectType[i].isSelected = false;
    });
}  

无论如何,我认为您的代码可以改进,因为它没有达到应有的效率。您正在迭代整个列表并调用setState每次迭代都会重复两次,当可以一次性完成时,会不必要地多次重新创建小部件树。

  1. 将当前选择保存在类级别变量中

    BoxSelection _selectedBox
    
  2. 简化代码以直接对当前选择进行操作,而不是迭代整个列表

     onTap: () =>
       setState(() {
         if (_selectedBox != null) {
             _selectedBox.isSelected = false;
         }
         projectType[index].isSelected = !projectType[index].isSelected;
         _selectedBox = projectType[index];
       });   
    
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

ListView Flutter 的单选 的相关文章

  • Android listview数组适配器选择

    我正在尝试向列表视图添加上下文操作模式 但如果我做了一个选择 我会遇到一些问题List1 setSelection position 它不会选择任何东西 如果我做List1 setItemChecked position true 它可以工
  • 天文台服务器启动失败 - 无法创建套接字服务器

    我正在为自己构建一些内部工具 以使用我设置的一些模板以及可以在应用程序之间共享的一些附加功能来生成 Flutter 应用程序 目前 代码可以编译 构建并部署 但它会卡在第一个视图 空白屏幕 上 并在失败之 前重试启动 Observatory
  • Flutter:在 Android 上获取本地 IP 地址

    如何在 Flutter 中获取我的 Android 设备的本地 IP 地址 这应该是 当连接到 WIFI 时 我的路由器通过 DHCP 分配的本地 IP 地址 如果连接到 VPN 则由我的 VPN 服务器分配的 VPN 网络中的本地 IP
  • 在 Xamarin Android 中将图像从 URL 异步加载到 ImageView 中

    我有一个包含多个项目的 ListView 列表中的每个项目都应该有一个与之关联的图像 我创建了一个数组适配器来保存每个列表项并具有我希望加载的图像的 url 我正在尝试使用 Web 请求异步加载图像 并设置图像并在加载后在视图中更新它 但视
  • 如何使用 Dart 构建枚举? [复制]

    这个问题在这里已经有答案了 Dart 语言没有枚举 还没有 至少在语言功能出现之前 构建枚举的正确或惯用的方法是什么 Dart 现在支持枚举 这个答案的其余部分适用于 Dart 1 8 请使用 Dart 对枚举的正式支持 在另一个答案中进行
  • Riverpod - ref.refresh。应该使用“刷新”的值

    我正在将 Riverpod 与 flutter 一起使用 在我的主屏幕上 我有一个 FutureProvider 它调用 API 服务器 并在页面上显示结果 在应用程序的不同点 不同屏幕上的用户进行更改 然后我从另一个屏幕刷新提供程序 像这
  • 如何使用 Dart 将列表拆分或分块为相等的部分?

    假设我有一个类似的列表 var letters a b c d e f g h 我想要一个列表 每个列表包含 2 个元素 var chunks a b c d e f g h 使用 Dart 执行此操作的好方法是什么 这是另一种方法 var
  • 如何使用baseadapter自定义listview

    我想创建一个定制的ListView像这样 我想我必须使用BaseAdapter但我对此一无所知 主要 xml
  • Flutter如何post json数组

    如何在 json 数组下面发布 LstUserOptions OptionID ca339e40 10cc 4459 b9ec 07f7df0f4c69 我找到了解决方案 List
  • 如何在React-Native中选择ListView的一项?

    我是 React Native 的新手 我想使用 ListView 选择一项 当我第一次按下 item 时 ListView renderRow 被调用 但终究不起作用 我该如何修复这个错误 我的问题出在哪里 我写了一个演示here htt
  • android listactivity onCheckedChangeListener

    我正在开发一款应用程序 并且我有一个ListActivity 其选择模式设置为choice mode multiple 现在我想重写方法 当一项被调用时调用该方法选中 未选中 我发现onCheckChanged 方法仅针对RadioGrou
  • 如何在 Flutter Web 应用程序中保存和下载文本文件

    我是 Flutter 新手 正在使用 Flutter Web 应用程序 我的要求是创建和下载文本文件 像下面这样 void getData List
  • 如何检测颤振中的滑动

    我尝试使用 flutter 的滑动检测器插件来实现向右滑动导航到新屏幕 但它不起作用 不会引发任何错误 并且在调试它时永远不会命中断点 我研究了 GestureDector 但我不确定它是否适用于向右滑动的场景 我们希望它在屏幕上的任何位置
  • Android - 我无法刷新/重绘 ListView

    我有一个列出一组书籍的 ListView 用户可以添加一本新书 然后使用 onActivityResult 方法再次显示该书集 在添加一本新书后 我一直在尝试几个小时来刷新这套书 但根本没有运气 这是我尝试过的代码 public class
  • 如何检测flutter网站是否在浏览器后台运行?

    WidgetsBindingObserver 不适用于我的 flutter web 项目 是否有类似的东西可以检测用户何时关闭浏览器 例如使用 widgetbinding 关闭本机设备应用程序 我想在每次重建浏览器后重建整个网站 无论网站之
  • 如何在flutter中自定义Steppers并通过内容中的小部件进行控制?

    我在视图中创建了一系列步骤 我想使用 Flutter 中的 Stepper Widget 来实现这些步骤 不过 我希望这些步骤由内容中的小部件触发 而不是继续和取消 我尝试使用controlsBuilder 但是它为每个步骤创建相同的控件小
  • Android:动态更改Listview中的图像

    我有一个由以下 xml 定义的列表视图 我需要切换图像当用户单击任何行时 在运行时会出现在列表中 我怎样才能实现这个目标 非常感谢任何帮助 谢谢 list item xml
  • 在 Flutter 中将 base64 字符串转换为 PDF 文件

    我正在尝试显示 PDF 文件 但是我从服务器接收到 Base64 字符串格式的 PDF 文件 有什么方法可以直接将 Base64 字符串显示到 PDF 查看器或 WebView 中 而不将其保存到 File 中 检查一下 https sta
  • 有没有办法直接在 Dart 中的类上添加静态扩展方法?

    我读过一个comment https stackoverflow com questions 3629368 way to add an extension method comment3813313 3629368关于 C 的类似问题 扩
  • 水平翻转动画 ImageWidget Flutter

    I want to do Horizontal flip animation for CircularAvatar widget like below animation Like this i want to flip circularA

随机推荐

  • Fluent NHibernate - 如何将外键列映射为属性

    我确信这是一个简单的问题 但请考虑以下问题 我对公司和部门之间的参考如下 public class Company public Guid ID get set public Sector Sector get set public Gui
  • 原声音频比较库

    我需要一个处理音频比较的软件或库 但不使用 mp3 内部的标签 它应该比较 2 个音频文件之间的相似性或置信度 或者如果我从音频文件中剪切一段 该软件应该指出它在哪里来自主音频文件的文件令牌 我希望我足够清楚 那么我怎么听说这项技术被称为音
  • 将 Jquery 手风琴扩展到表的行

    我有一张带有可折叠行的桌子 请检查here http jsfiddle net soumyazyx 8Xyjy 10 我只想使用 Jquery UI 手风琴 如图所示here http jqueryui com accordion 我正在尝
  • 在 ui-sref 中动态更改状态和参数

    使用 ui router 我想在 ng repeat 内动态设置 ui sref 指令 如下所示 a a Where steps是一个 状态对象 数组 每个对象都有自己的状态和参数对象 var steps state foo param i
  • 使用jquery设置输入html字符串的值

    我在字符串中有 HTML 片段 如下所示 var htmlString
  • NSSpeechSynthesizer 更改语言

    我正在编写一个基于 Cocoa Book 示例的简单程序 该程序使用 NSSpeechSynthesizer 来说出短语 我想知道如何更改用于合成阶段的语言 import PHAppDelegate h implementation PHA
  • 缺少 pdb 文件

    我正在 wince7 设备上调试我的应用程序 几分钟后 我收到一个错误 没有为任何调用堆栈帧加载任何符号 无法显示源代码 我注意到模块列表中有 1 个 dll 缺少 pdb 文件 它的名称是 System Drawing dll 我注意到在
  • 中止读取文件时 PHP 页面超时

    我有一个简单的 php 视图 如下所示 header Content Type image png readfile this gt image exit 在这个例子中 this gt image例如 data pictures thumb
  • 获取 Quicktime 视频信息

    有没有办法获取 QuickTime 视频信息 在谷歌搜索中 我发现 QT 的一个 cl 选项已损坏 我正在寻找 pasp 长度 音频通道 音频分配 拍手以及经常使用程序 Dumpster 找到的各种其他属性 使用 ffmpeg 无法获得大部
  • 如何使用 Webpack 创建与容器应用程序共享库的微前端捆绑包?

    我有一个任务 拥有具有单 Spa 框架的微前端 门户 主应用程序 通过 url 加载所有其他 js 代码 微前端 1 基于 React 微前端 2 基于 React 所以我的问题只有一个 我不想重复供应商库 如react react dom
  • 存储下拉值,什么是好方法

    想象一下 您有一个网站 其中有多个下拉菜单 这些下拉菜单是从后端数据库填充的 目标是将这些值存储在数据库中 并在渲染表单时检索它们 我见过使用两种方法 1 每种列表类型一张表 profession type id value hobby t
  • ASP.NET MVC 从 C# 代码创建绝对 url

    如何从 C 代码生成绝对 url 我想生成一个像这样的网址 localhost controller action id 有没有办法在 C 中做到这一点 就像在视图中完成它一样 它不会在控制器内部生成 而是在 ViewModel 内部生成
  • $.getJSON 获取 JSONP 数据

    我通过以下方式使用 getJSON 来接收警报 但没有运气 这是代码 并且ticker js文件只有以下行 ticket IBM price 14 57 它应该收到警报 14 57 但我没有收到警报 如果您想查看它的实际效果 可以尝试该链接
  • java.awt.Robot 的本机源代码

    我正在尝试找到 Java Robot 函数的本机实现 我找到了Windows的实现here http cr openjdk java net ohair openjdk7 jdk7 build copyright webrev jdk sr
  • “MongoDB Compass”无法打开,因为苹果无法检查它是否有恶意软件

    当我尝试在 macOS Catalina 上安装 MongoDB Compass 时 出现以下情况 MongoDB Compass can t be opened because Apple cannot check it for mali
  • 可以处理 HTTPS 的 WebBrowser 控件

    我正在寻找 NET 中可以处理 HTTPS 的 WebBrowser 控件的替代品 这个问题 https stackoverflow com questions 790542 replacing net webbrowser control
  • 使用 dash python 更改 bootstrap nav-pills 样式

    Dash 允许使用我们自己的 CSS 样式表 但是 如果您在科学领域并且不熟悉 CSS 则可以使用 Bootstrap 组件 这使得样式和页面布局非常容易组合在一起 这是在 dash 中创建侧边栏的标准示例 This app creates
  • Android 6.0 Marshmallow 停止显示垂直 SeekBar 拇指

    我一直在使用这个基本的包装器 https stackoverflow com a 28397530 250340在 SeekBar 周围 但发现它隐藏了拇指 或者做了一些时髦的事情 比如在棉花糖下的白色背景上将其变成白色 我使用 AS Bl
  • 企业报告解决方案[关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • ListView Flutter 的单选

    我正在尝试实施一个listView在我的应用程序中进行单选 这样一旦点击列表中的项目 按下的项目颜色状态就会与其他项目不同 我已经做了我所知道的一切 但效果并不好 问题是 即使我的实现在按下时更新每个项目的状态 它也不会将其他项目重置为其初