SwiftUI Foreach中如何使用Toggle组件
创始人
2025-05-30 21:37:55
0

最近有一个需求,在一个界面中显示一个列表,列表中多个cell的右边要显示一个Toggle,也就是UIKit中的UISwitch开关,我们知道Toggle组件需要绑定一个变量的,但是列表数据是从服务器取的,要用多少个Toggle组件不可知,所以如何记住这些Toggle的值呢?

如果用一个变量绑定所有的Toggle,那么这些Toggle就是同开同关了,显然不行。下面来看一下具体实现。

Foreach组件

Foreach组件是SwiftUI中的一个非常强大的组件。它可以用来遍历一个集合,并为集合中的每个元素创建一个视图。以下是一个使用Foreach组件的示例:

struct ContentView: View {let books = ["Book1", "Book2", "Book3"]var body: some View {ForEach(books, id: \.self) { book inText(boks)}}
}

在上面的示例中,我们创建了一个名为books的字符串数组,并使用Foreach组件遍历了该数组。我们还指定了id参数,用于确定集合中每个元素的唯一性。

Toggle组件

Toggle组件是SwiftUI中的另一个非常有用的组件。它可以用来创建一个开关,使用户可以切换某个设置的状态。以下是一个使用Toggle组件的示例:

struct ContentView: View {@State var isOn = falsevar body: some View {Toggle("Toggle", isOn: $isOn)}
}

在上面的示例中,我们创建了一个名为isOn的布尔值状态,并使用Toggle组件来创建了一个开关。我们还使用了$符号来绑定Toggle组件的值到我们的状态变量上。

在Foreach中使用Toggle组件

现在我们已经了解了如何在SwiftUI中使用Foreach和Toggle组件,让我们来看看如何将它们结合起来。以下是一个在Foreach中使用Toggle组件的示例:

struct ContentView: View {@State var books = [BookModel(name: "Book1", isSelected: false),BookModel(name: "Book2", isSelected: false),BookModel(name: "Book3", isSelected: false)]var body: some View {VStack {ForEach(0..

在上面的示例中,我们创建了一个名为books的BookModel数组,并在Foreach中遍历它。我们还为每个Toggle组件提供了一个状态变量,以便用户可以更改每个book的isSelected状态。

注意,这里在遍历的时候我们使用的索引遍历,而非直接遍历books,如果直接遍历boos,那么在闭包里面获取到的book,我们无法直接将book的isSelected绑定到Toggle上,系统会报错的。因此我们通过`$books[index].isSelected`进行绑定。

结论

在SwiftUI中,我们可以使用Foreach和Toggle组件来创建动态的UI界面。在本文中,我们介绍了如何在Foreach中使用Toggle组件,并为每个book提供了一个状态变量。

希望这篇文章能够帮助你更好地理解SwiftUI中的Foreach和Toggle组件。

相关内容

热门资讯

【MySQL】锁 锁 文章目录锁全局锁表级锁表锁元数据锁(MDL)意向锁AUTO-INC锁...
【内网安全】 隧道搭建穿透上线... 文章目录内网穿透-Ngrok-入门-上线1、服务端配置:2、客户端连接服务端ÿ...
GCN的几种模型复现笔记 引言 本篇笔记紧接上文,主要是上一篇看写了快2w字,再去接入代码感觉有点...
数据分页展示逻辑 import java.util.Arrays;import java.util.List;impo...
Redis为什么选择单线程?R... 目录专栏导读一、Redis版本迭代二、Redis4.0之前为什么一直采用单线程?三、R...
【已解决】ERROR: Cou... 正确指令: pip install pyyaml
关于测试,我发现了哪些新大陆 关于测试 平常也只是听说过一些关于测试的术语,但并没有使用过测试工具。偶然看到编程老师...
Lock 接口解读 前置知识点Synchronized synchronized 是 Java 中的关键字,...
Win7 专业版安装中文包、汉... 参考资料:http://www.metsky.com/archives/350.htm...
3 ROS1通讯编程提高(1) 3 ROS1通讯编程提高3.1 使用VS Code编译ROS13.1.1 VS Code的安装和配置...
大模型未来趋势 大模型是人工智能领域的重要发展趋势之一,未来有着广阔的应用前景和发展空间。以下是大模型未来的趋势和展...
python实战应用讲解-【n... 目录 如何在Python中计算残余的平方和 方法1:使用其Base公式 方法2:使用statsmod...
学习u-boot 需要了解的m... 一、常用函数 1. origin 函数 origin 函数的返回值就是变量来源。使用格式如下...
常用python爬虫库介绍与简... 通用 urllib -网络库(stdlib)。 requests -网络库。 grab – 网络库&...
药品批准文号查询|药融云-中国... 药品批文是国家食品药品监督管理局(NMPA)对药品的审评和批准的证明文件...
【2023-03-22】SRS... 【2023-03-22】SRS推流搭配FFmpeg实现目标检测 说明: 外侧测试使用SRS播放器测...
有限元三角形单元的等效节点力 文章目录前言一、重新复习一下有限元三角形单元的理论1、三角形单元的形函数(Nÿ...
初级算法-哈希表 主要记录算法和数据结构学习笔记,新的一年更上一层楼! 初级算法-哈希表...
进程间通信【Linux】 1. 进程间通信 1.1 什么是进程间通信 在 Linux 系统中,进程间通信...
【Docker】P3 Dock... Docker数据卷、宿主机与挂载数据卷的概念及作用挂载宿主机配置数据卷挂载操作示例一个容器挂载多个目...