首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何通过在SwiftUI中点击列表中的行元素从子视图返回到父视图?

在SwiftUI中,可以通过使用NavigationLink来实现从子视图返回到父视图。NavigationLink是一个用于导航的视图,它可以在列表中的行元素上创建一个可点击的链接。

要在SwiftUI中实现这个功能,可以按照以下步骤进行操作:

  1. 在父视图中创建一个列表,并使用ForEach循环来显示行元素。每个行元素都应该包含一个NavigationLink,并设置目标视图为子视图。
代码语言:txt
复制
struct ParentView: View {
    var body: some View {
        NavigationView {
            List {
                ForEach(items) { item in
                    NavigationLink(destination: ChildView(item: item)) {
                        Text(item.name)
                    }
                }
            }
        }
    }
}
  1. 创建子视图,并在子视图中添加一个按钮或其他触发返回操作的视图元素。
代码语言:txt
复制
struct ChildView: View {
    var item: Item
    
    var body: some View {
        VStack {
            Text(item.name)
            Button(action: {
                // 在这里执行返回操作
                // 可以使用presentationMode.wrappedValue.dismiss()来关闭当前视图
                presentationMode.wrappedValue.dismiss()
            }) {
                Text("返回")
            }
        }
    }
}

在上述代码中,presentationMode.wrappedValue.dismiss()用于关闭当前视图并返回到父视图。

通过以上步骤,当用户在父视图中点击列表中的行元素时,将会跳转到子视图。在子视图中,用户可以点击返回按钮来返回到父视图。

这是一个基本的实现方式,具体的实现可能会根据项目的需求和架构而有所不同。关于SwiftUI的更多信息和示例,可以参考腾讯云的SwiftUI开发指南

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Ask Apple 2022 与 SwiftUI 有关问答(上)

是否有任何建议用来检测列表选择,类似于 “NavigationLink”,但不导航到另一个视图(例如,显示 Sheet 或从列表中选择一个选项 )?...假设我们想创建一个类似于 iMessage 视图,在那里你可以看到一个信息列表(与本例无关),视图底部有一个文本框。当用户点击文本字段时,键盘会在其工具栏中出现一个文本字段。...比如说我可以视图中拥有 StateObject,并通过 EnvironmentObject 传递该对象。然而,如果里面的 @Published 属性改变了,视图和它子树也都被重新计算。...对于苹果工程师给予建议有一点请注意,那就是如果有视图中修改该环境对象实例需求,须确保视图不会被反复重构( SwiftUI 重新创建视图类型实例 )。...提问者应该是想通过视图中不断修改 id 参数值,来重新初始化 State 值。

12.2K20

SwiftUI 布局协议 - Part 1

简介 今年 SwiftUI 新增最好功能之一必须是布局协议。它不但让我们参与到布局过程,而且也给了我们一个很好机会去更好理解布局 SwiftUI 作用。...早在2019年,我写了一篇文章SwiftUI frame 表现[1],其中,我阐述了视图和子视图如何协调形成最终视图效果。那里描述许多情况需要通过观察不同测试结果去猜测。...就像我以前文章 SwiftUI frame 表现 所描述那样,布局过程视图给子视图提供一个尺寸,但最终还是由子视图决定如何绘制自己。然后,它将此传达给视图,以便采取相应动作。...,然而,通过调用 frame(width:100) 子视图只得到了 100pt,视图就没有办法只能听从子视图做法吗?...无论如何没有缓存情况下编写我们布局更简单一点,当我们以后需要时再添加。SwiftUI 已经做了一些缓存。例如,从子视图代理获得值会自动存储缓存。相同参数反复调用将会使用缓存结果。

3.3K10

SwiftUI数据流之State&Binding

SwiftUI,以单一数据源(single source of truth)为核心,构建了数据驱动状态更新机制。...,为了简化内容说明核心问题,只有两行内容,视图是ProductsView,其中嵌套着子视图FilterView和列表元素,为了能够使得FilterView对showFavorited修改能够传递回视图...: 注释1,showFavorited使用@State修饰 注释2,body通过$showFavorited获得showFavorited对应Binding传递给子视图FilterView 注释3...,anotherFlag是没有使用属性包装器普通变量,同时增加了一个mutating方法changeAnotherFlag被设计修改anotherFlag; body通过几种方式对两个变量进行修改...为了分析变量状态,16,User结构体init方法;39,ContentViewinit方法结束;47,按钮点击执行函数部分,都加入了断点 由于@State针对值类型,为了打印出struct地址

4K30

解析 SwiftUI 两处由状态更新滞后引发严重 Bug

原文发表博客 肘子Swift记事本视图变化在前、状态变化在后 SwiftUI ,某些可编程控件执行一定操作时,会先更新视图,待视图变化完成后再修改与其对应状态。...通过手势取消 Sheet 后,快速右滑导航容器会导致应用锁死这是一个 SwiftUI 所有版本存在错误,你可以众多论坛或聊天室里看到不少开发者都在寻找解决方法。...它复现条件非常简单:真机上测试( 模拟器上不容易复现 )点击 “GO” 按钮进入下一层视图点击 “Show Sheet” 按钮弹出 Sheet通过下滑手势取消 Sheet Sheet 取消后(动画结束时...,以确保用户只能在 showSheet 为否时通过滑动返回到上一层视图。...它复现条件如下:iOS 16 系统,真机或模拟器上测试点击视图列表按钮,可以进入下一级视图

606110

解析 SwiftUI 两处由状态更新滞后引发严重 Bug

视图变化在前、状态变化在后 SwiftUI ,某些可编程控件执行一定操作时,会先更新视图,待视图变化完成后再修改与其对应状态。这些控件基本上都是对 UIkit(AppKit)二次包装。...通过手势取消 Sheet 后,快速右滑导航容器会导致应用锁死 这是一个 SwiftUI 所有版本存在错误,你可以众多论坛或聊天室里看到不少开发者都在寻找解决方法。...它复现条件非常简单: 真机上测试( 模拟器上不容易复现 ) 点击 “GO” 按钮进入下一层视图 点击 “Show Sheet” 按钮弹出 Sheet 通过下滑手势取消 Sheet Sheet 取消后...,以确保用户只能在 showSheet 为否时通过滑动返回到上一层视图。...它复现条件如下: iOS 16 系统,真机或模拟器上测试 点击视图列表按钮,可以进入下一级视图

28620

优化 SwiftUI List 显示大数据集响应效率

本文将通过一个优化列表视图案例,展现在 SwiftUI 查找问题、解决问题思路,其中也会对 SwiftUI 视图显式标识、@FetchRequest 动态设置、List 运作机制等内容有所涉及... SwiftUI 视图生命周期研究[3] 一文,我对 List 如何对子视图显示进行优化做了一定介绍。...标识( Identity )是 SwiftUI 程序多次更新识别相同或不同元素手段,是 SwiftUI 理解你 app 关键。... SwiftUI 应用代码,绝大多数视图标识都是通过结构性标识 (有关结构性标识内容可以参阅 ViewBuilder 研究(下) —— 从模仿中学习[4])来实现 —— 通过视图层次结构(视图树...虽然我们已经找到了导致进入列表视图卡顿原因,但如何在不影响效率情况下通过 scrollTo 来实现到列表端点滚动呢?

9.1K20

鸿蒙应用开发-初见:ArkUI

想了解更多Flutter布局原理可以查看 深入理解 Flutter 布局约束 SwiftUIView布局原理参考SwiftUI布局原理可以参考下图。...想了解细节,可参考 SwiftUI 布局工作原理小结声明式布局想要布局子视图都会经历由上到下一个过程,只有知道了子视图大小之后才能根据对齐方式将子视图放置准确位置。...声明式布局几乎都是下面这个套路视图给子视图一个布局约束(作为Root视图默认是充满屏幕,它给子视图约束就是屏幕大小)子视图渲染并将自身大小返回给视图视图根据子视图大小和设定对齐方式计算要放置位置子视图布局也遵循以上三步进行递归...后续布局、绘制都是Render树上进行⑤ 实现真正渲染并显示绘制结果按钮点击到更新显示(⑥~⑪)⑥ 点击事件传递到组件,组件onClick事件方法被触发执行⑦ 由于onClick事件方法@State...,子视图上报给视图自身大小值是指 组件内容区大小ArkUI中常用布局容器如何选择使用哪种布局线性布局(Row/Column)线性布局元素在线性方向上(水平方向和垂直方向)依次排列线性布局容器包括

13310

SwiftUI 实现视图居中若干种方法

欢迎大家 Discord 频道[2] 中进行更多地交流将某个视图视图中居中显示是一个常见需求,即使对于 SwiftUI 初学者来说这也并非难事。...那么 HStack、VStack 会在明确了所有固定尺寸子视图需求尺寸后,将所剩可用尺寸( HStack、VStack 视图给他们建议尺寸 - 固定尺寸子视图需求尺寸 )平均分配( 优先级相同情况下...万变不离其宗,掌握了 SwiftUI 布局原理,无论需求如何变化都可轻松应对。...我为本文这种通过多种方法来解决一个问题方式添加了【小题大作】标签,目前使用该便签文章还有: Core Data 查询和使用 count 若干方法[6]、 SwiftUI 视图中打开 URL...每周也会对当周博客上新文章以及 Twitter 上发布 Tips 进行汇总,并通过邮件列表形式发送给订阅者。订阅下方 邮件列表[10],可以及时获得每周 Tips 汇总。

6.6K40

AVKit框架详细解析(四) —— 基于AVKit 和 AVFoundation框架视频流App构建

在此过程,您将学习 AVKit 和 AVFoundation 框架基础知识。 本教程,您将学习如何: 添加本地视频。 添加流媒体视频。 启用播放控件。 实现循环。 实现画中画。...这就是应用程序如何用数据填充现有列表方式。 视频本身来自嵌入应用程序包 JSON 文件。 如果您好奇,您可以查看 Video.swift 以了解它们是如何获取。...问题是你不能直接在 SwiftUI 中使用这个层。 毕竟 SwiftUI 没有 CALayer概念。 为此,您需要回到 UIKit。...() } 构建并运行,然后点击列表项之一以打开全屏播放器。...缺点是,撰写本文时,iOS 14.5是可用最新版本,VideoPlayer SwiftUI 视图未显示画中画按钮。

6.9K10

SwiftUI 布局 —— 尺寸( 上 )

本文将从布局角度入手,为你揭开盖 SwiftUI 尺寸概念上面纱,了解并掌握 SwiftUI 众多尺寸含义与用法;并通过创建符合 Layout 协议 frame 和 fixedSize 视图修饰器复制品...但由于 SwiftUI 视图并没有提供尺寸这一属性,因此即使 SwiftUI 诞生了数年后今天,如何获取视图尺寸仍然是网络上热门问题。...因此,为了简化文字,我们文章中会将视图与具备布局能力容器等同起来。 不过需要注意是, SwiftUI ,有一类视图是会在视图树上显示为视图,但并不具备布局能力。... SwiftUI 通过设置或调整建议模式而进行二次布局场景很多,比较常用有:frame、fixedSize 等。...视图尺寸 视图渲染后屏幕上呈现尺寸,也是热门提问 —— 如何获取视图尺寸中所指尺寸。 视图中可以通过 GeometryReader 获取特定视图尺寸及位置。

4.7K20

Ask Apple 2022 与 SwiftUI 有关问答(下)

Table 中上下文菜单Q:如果我 TABLE 上添加了一个上下文菜单,我如何确定哪一导致了菜单显示(无需选择该行)?...快速检索数组元素Q:为什么没有简单方法将 TABLE 选择映射到提供表内容数组元素上?似乎唯一方法是在数组搜索匹配 id 值,这对于大表来说似乎效率很低。...Swiftcord[12] 代码展示了如何SwiftUI 下实现倒置列表。阅读 优化 SwiftUI List 显示大数据集响应效率[13] 一文,了解苹果工程师推荐方法。...macOS APIQ:对于运行 Monterey Mac,能否如何SwiftUI 实现下面需求建议:打开一个窗口该窗口中初始化数据找到所有打开窗口确定一个窗口是否打开从不在该窗口视图中关闭一个窗口...连锁动画Q: SwiftUI 如何实现连锁动画?例如,我想先给一个视图做动画,当动画完成后立即启动另一个动画。A:不幸是,目前不可能实现连锁动画。

14.7K30

聊一聊可组装框架( TCA )

IdentifiedArray 确保了将组件状态( State )某个序列属性切分成独立子组件状态时系统稳定性。避免出现因使用 index 修改元素而导致异常甚至应用崩溃情况。...通过 WithViewStore ,开发者可以视图中进一步控制当前视图所要关注状态以及操作,不仅改善了视图中代码纯粹性,也一定程度减少了不必要视图刷新,提高了性能。...由于调整了 Reducer 组装构成角度,将从子 Reducer pullback 至 Reducer 方式修改为从父 Reducer 上 scope 子 Reducer 逻辑。...如何学习 TCA尽管 TCA 很大程度上减少了视图中使用其他依赖项( 符合 DynamicProperty 协议 )机会,但开发者仍应对 SwiftUI 提供原生依赖方案有深刻认识和掌握。...每周也会对当周博客上新文章以及 Twitter 上发布 Tips 进行汇总,并通过邮件列表形式发送给订阅者。订阅下方 邮件列表[18],可以及时获得每周 Tips 汇总。

1.7K20

SwiftUI geometryGroup() 指南:从原理到实践

本文将介绍 geometryGroup() 概念、用法,以及低版本 SwiftUI 不使用 geometryGroup() 情况下如何处理异常。...这是因为 SwiftUI ,每个可动画视图根据 transaction 信息自行决定自身动画行为。...出现 “Some Cases” 条件 至此,我们就可以将官方文档 “In some cases” 条件补充完整: 视图几何属性发生改变,且改变是动画化 视图改变同时( 几何属性变化...视图几何信息发生变化时,不要同时视图中创建新内容 如果一定要在变化时为子视图增加新元素( 比如上面基于 GeometryReader 示例,可以将所需元素视图变化前便让其存在,通过透明度来调整其可见性...对于 iOS 16,文字变化较多且较大情况下,应尽量避免视图几何信息调整时切换文字内容。 总结 本文中,我们深入探讨了 SwiftUI geometryGroup() 重要性和实用性。

25510

SwiftUI 与 Core Data —— 数据定义

今后文章我们将尝试用新思路来创建一个 SwiftUI + Core Data app,看看能否避免并改善之前一些问题。本文将首先探讨如何定义数据。...使用者可以 Todo 创建将要完成工作( Task ),并可以通过 Task Group 以实现更好地管理。可以 此处[3] 获得 Todo 代码。...元素 SwiftUI 视图[4])。...这个类型除了用于为 SwiftUI 视图提供数据外,同时也会被用于为其他数据流提供有效信息,例如,类 Redux 框架通过 Action 为 Reducer 提供所需数据。..._wrappedValue = wrappedValue }}现在, SwiftUI 视图中,MockGroup 将具备与 C_Group 几乎一样能力,唯一不同是,它是通过一个 TodoGroup

2.4K40

SwiftUI 布局协议 - Part2

简单说,通过添加 animatableData 属性到我们布局,我们要求 SwiftUI 动画每一帧重新计算布局。但是,每个布局传递,角度都会收到一个内插值。...视图缩放和旋转要再一次使用双向自定义值实现。 在这个例子容器中一共有44个视图,所以我们新容器将会分别以12,12,12和8为一圈。 注意本案例如何使用缓存与子视图通信。...本例,我创建了两个 UUID 布局值,一个标识视图,另一个作为视图 ID。...注意这是基本实现,仅用于说明如何实现。还有许多潜在优化,但制作树布局所需关键元素都在这里。...一个有用调试工具 回到SwiftUI 刚发布时候,我尽力搞清楚布局是如何工作,我希望我有一个像我今天要介绍这种工具 。直到现在,它都是最好工具,用来添加围绕视图边框观察视图边缘。

2.7K30

onAppear 调用时机

创建实例、求值、布局、渲染在 SwiftUI ,一个视图生命周期中通常会经历四个阶段:创建实例视图,处于可显示分支视图基本上都会经历一个阶段。...布局计算好当前需要显示视图所有的视图值后,SwiftUI 将进入到布局阶段。通过视图向子视图提供建议尺寸,子视图返回需求尺寸这一过程,最终计算出完整布局结果。...SwiftUI 视图生命周期研究 一文时,我们只能通过现象来推断 onAppear 调用时机,随着版本不断提高,SwiftUI 4 为我们提供了足够工具让我们可以获得更加确实证据。...,视图询问其需求尺寸时将通过控制台报告给我们。...sizeThatFits 与 Layout 协议 sizeThatFits 调用时机一致,都是布局过程视图向子视图询问需求尺寸时访问。

2K20

onAppear 调用时机

创建实例、求值、布局、渲染 SwiftUI ,一个视图生命周期中通常会经历四个阶段: 创建实例 视图,处于可显示分支视图基本上都会经历一个阶段。...布局 计算好当前需要显示视图所有的视图值后,SwiftUI 将进入到布局阶段。通过视图向子视图提供建议尺寸,子视图返回需求尺寸这一过程,最终计算出完整布局结果。... 4.0 版本SwiftUI 提供了 Layout 协议,允许我们创建自定义布局容器,通过创建符合该协议实例,我们便可以判断当前视图是否正处于布局阶段。...,视图询问其需求尺寸时将通过控制台报告给我们。...sizeThatFits 与 Layout 协议 sizeThatFits 调用时机一致,都是布局过程视图向子视图询问需求尺寸时访问。

1.1K10

使用 SwiftUI 创建一个灵活选择器

前言 最近,我正在开发一个 Dribbble 上找到设计 SwiftUI 实现时,我想到了一个点子,可以通过一些酷炫筛选器扩展该项目以缩小结果列表。...使用 UIKit 时,我总是将这种类型视图实现为具有特定 UICollectionViewFlowLayout UICollectionView。但在 SwiftUI 如何实现呢?...如果结果小于 0,这意味着我们无法将下一个元素放入给定,因此我们将 singleLineResult 附加到 allLinesResult ,将 singleLineResult 设置为仅由当前元素组成数组...(不能适应上一元素),并通过减去当前项宽度来更新 HStack 行宽。...然后,详细介绍了实现该选择器逻辑,包括如何处理选项布局、宽度和高度,以及如何处理用户与按钮交互。 最后,提供了一个简单视图实现,可以 SwiftUI 中使用该选择器。

25620

一段因 @State 注入机制所产生“灵异代码”

State 注入优化机制 SwiftUI ,对于引用类型,开发者可以通过 @StateObject、@ObservedObject 或 @EnvironmentObject 将其注入到视图中。...这意味着,即使我们定义视图结构体声明了使用 @State 标注变量,但只要 body 没有使用该属性( 通过 ViewBuilder 支持语法 ),即使该属性发生变化,视图也不会刷新。...,只有模态视图进行显示时,SwiftUI 才执行 .sheet 闭包函数,创建 Sheet 视图。...也就是说 Sheet 视图与原有视图分别处于不同上下文中。 SwiftUI 早期版本,对于分别位于不同上下文独立视图树,开发者需要显式为 Sheet 视图树注入环境依赖。...但捕获了视图当前 n 值 ( n = 1 )点击 Button 后,由于 n 值发生了变化,ContextView 重新求值( 重新解析 DSL 代码 )重新求值过程,.fullScreenCover

1.9K20

Xcode 11 初体验

SwiftUI、storyboad其中我有两篇博客也介绍到了SwiftUI:SwiftUI - 百代码变十,Swift再创辉煌 和 WWDC - SwiftUI - 初恋般感觉 代码块 代码块也做了调整...Editor and Canvas:代码编辑器和SwiftUI预览视图。 Editor and Assistant:代码编辑器和辅助视图。...当你项目关联了版本控制工具时,比如 Git, Xcode 会检测出当前文件哪些地方相对于上次递交版本有更改,并且会通过左边显示一个蓝色线条标记出来: Change Bar 点击左键还可以选择 show...Git Tab页面,会展示出当前本地 Branches 列表、Stash Changes 列表、Tags 列表、Remotes 远程仓库列表。...关于Swift UI 更新 其中我有两篇博客也介绍到了 SwiftUI : SwiftUI - 百代码变十,Swift再创辉煌 WWDC - SwiftUI - 初恋般感觉 参考:Apple 官方文档一线搬砖工人

3.2K10
领券