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

SwiftU:在循环中创建视图

通常在一个循环中创建多个SwiftUI视图。例如,我们可能想要遍历一系列名称,并让每个名称成为文本视图,或者遍历一系列菜单项,并将每个名称显示为图像。...SwiftUI为此提供了一个专用的视图类型,称为ForEach。这可以在数组和范围上循环,根据需要创建尽可能多的视图。更妙的是,ForEach不会像我们手动输入视图一样被10个视图限制所影响。....< 100) { Text("Row \($0)") } } ForEach在使用SwiftUIPicker视图时特别有用,它允许我们显示各种选项供用户选择。...3、创建一个Picker视图,要求用户选择他们最喜欢的,并将选择的和@State属性双向绑定。 4、使用ForEach循环遍历所有可能的学生姓名,将其转换为文本视图。...4、Picker与selectedStudent有双向绑定,这意味着它将开始显示0的选择,但是在用户滑动选择器时更新属性。 5、在ForEach中,我们0数到(但不包括)数组中的学生数。

2.2K20

SwiftUI:使用 @EnvironmentObject 环境中读取自定义

SwiftUI的环境使我们可以使用来自外部的,这对于读取Core Data上下文或视图的展示模式等很有用。...如果我们使用@ObservedObject,则需要将我们的对象每个视图传递到下一个视图,直到它最终到达可以使用该视图视图E,这很烦人,因为B,C和D不在乎它。...使用@EnvironmentObject,视图A可以将对象放入环境中,视图E可以环境中读取对象,而视图B,C和D不必知道发生了什么。...在向您展示一些代码之前,还有最后一件事:环境对象使用您已经学过的ObservableObject协议,SwiftUI将自动确保共享同一环境对象的所有视图在更改时都会更新。...接下来,我们可以定义两个SwiftUI视图以使用我们的新类。

9.6K20
您找到你想要的搜索结果了吗?
是的
没有找到

深入了解 SwiftUI 5 中 ScrollView 的新功能

它只影响滚动视图的初始状态,一次性设置。通常用于实现类似初始状态底部显示的 IM 应用、 trailing 开始显示数据等情况。通过 UnitPoint 可以同时设置两个轴向的初始位置。...可采用 优化在 SwiftUI List 中显示大数据集的响应效率[5] 一文中介绍的方式来解决。 scrollPostion(id:) 使用此修饰符可以让滚动视图滚动到特定的位置。...) 不支持锚点设定,固定锚点为子视图的 center 正如 优化在 SwiftUI List 中显示大数据集的响应效率[6] 一文所提到的,当数据集很大时,也会出现性能问题。...通过这个坐标系,开发者可以非常容易地获取子视图与滚动视图之间的位置关系。利用这些信息,我们可以轻松地实现很多效果,尤其是配合另一个新 API,visualEffect 修饰符。...苹果为我们提供了另一个 API,可以简化上述过程。 当子视图滑入和滑出包含它的滚动视图的可视区域时,scrollTransition 会对该视图应用给定的过渡动画,并在不同阶段之间平滑地过渡。

73820

SwiftUI 的方式进行布局

padding-offset 二、AlignmentGuide 在 SwiftUI 中,开发者可以使用 alignmentGuide 修饰器来修改视图某个对齐指南的( 设置显式 )。...有关建议尺寸、需求尺寸等内容,请参阅 SwiftUI 布局 —— 尺寸( 上 )[5] 一文 三、NameSpace 3.0 版本( iOS 15 )开始,SwiftUI 提供了新的 NameSpace...SwiftUI 在进行布局时,当布局容器给出的建议尺寸无法满足全部子视图的需求尺寸时,会根据子视图的 Priority,优先满足级别较高的视图的布局需求。...某种逻辑上来说,这种方式与 offset 类似,都需要获取到明确的位移才能满足需要。 在本例中,尽管仍使用 AlignmentGuide,但无需获取具体尺寸,便可达成目标。...七、Transition 通过为视图设定 Transition( 转场 ),在视图插入或将其移出视图树时,SwiftUI 将自动生成对应的动画效果。

3.2K00

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

,在其与任意视图关联后,该为 true。...ContextView 的 body 进行求值并渲染.fullScreenCover 的闭包此时并未被调用,但捕获视图当前的 n ( n = 1 )点击 Button 后,尽管 n 的内容发生变化...但捕获视图当前的 n ( n = 1 )点击 Button 后,由于 n 发生了变化,ContextView 重新求值( 重新解析 DSL 代码 )在重新求值的过程中,.fullScreenCover...的闭包捕获了新的 n ( n = 2 )创建 Sheet 视图并渲染由于 .fullScreenCover 闭包已经毕竟捕获了新,因此 Sheet 的 Text 显示为 n = 2也就是说,通过添加...Text,让 ContextView 与 n 创建了关联,在 n 变化后,ContextView 进行了重新求值,从而让 fullScreenCover 的闭包捕获了变化后的 n ,并呈现了预期中的结果

1.9K20

SwiftUI 的方式进行布局

图片 二、AlignmentGuide 在 SwiftUI 中,开发者可以使用 alignmentGuide 修饰器来修改视图某个对齐指南的( 设置显式 )。...有关建议尺寸、需求尺寸等内容,请参阅 SwiftUI 布局 —— 尺寸( 上 ) 一文 三、NameSpace 3.0 版本( iOS 15 )开始,SwiftUI 提供了新的 NameSpace...SwiftUI 在进行布局时,当布局容器给出的建议尺寸无法满足全部子视图的需求尺寸时,会根据子视图的 Priority,优先满足级别较高的视图的布局需求。...某种逻辑上来说,这种方式与 offset 类似,都需要获取到明确的位移才能满足需要。 在本例中,尽管仍使用 AlignmentGuide,但无需获取具体尺寸,便可达成目标。...七、Transition 通过为视图设定 Transition( 转场 ),在视图插入或将其移出视图树时,SwiftUI 将自动生成对应的动画效果。

4.8K80

了解 SwiftUI 的 onChange

了解 SwiftUI 的 onChange 请访问我的博客 www.fatbobman.com[1] 获得更好的阅读体验 iOS 14 开始,SwiftUI视图提供了 onChange 修饰器,...如何获取被观察的 OldValue onChange 允许我们通过闭包捕获的方式获取被观察的旧(oldValue)。...多个 onChange 的执行顺行 严格按照视图树的渲染顺序,下面的代码中,onChange 的执行顺序为内到外: struct ContentView: View { @State var text...task(id:) SwiftUI 3.0 中新增了 task 修饰器,task 将在视图出现时以异步的方式运行闭包中的内容,同时在 id 发生变化时,重启任务。...但有一点需要特别注意,由于 task 的闭包是异步运行的,理论上其并不会对视图的渲染造成影响,因此 SwiftUI 将不会限制它的执行次数。

2.8K20

SwiftUI 中的内容边距

前言SwiftUI 引入了一组视图修饰符,使我们能够有效地管理视图中的安全区域。在许多情况下,安全区域是你希望放置内容的地方。...字面上看,它是另一个安全区域,适应屏幕大小,但仅适用于文本内容。不幸的是,我们在 SwiftUI 中无法访问 readableContentGuide。...200 : 0) } }}我们通过使用 horizontalSizeClass 环境和 safeAreaPadding 视图修饰符,将内容移动到了 iPad 上的中心。...幸运的是,SwiftUI 引入了新的 contentMargins 视图修饰符,使我们能够在视图中移动特定类型的内容。...总结本文介绍了 SwiftUI 中的内容边距管理,通过对比安全区域的概念,解释了内容边距的重要性。文章创建示例开始,展示了在列表视图中如何处理内容边距的问题。

14832

SwiftUI 的动画机制

SwiftUI 采用了声明式语法来描述不同状态下的 UI 呈现,动画亦是如此。官方文档将 SwiftUI 的动画(Animations)定义为:创建从一个状态到另一个状态的平滑过渡。...在 SwiftUI 中,我们不能命令某个视图从一个位置移动到另一个位置,为了实现上述效果,我们需要声明该视图在状态 A 时所处的位置以及状态 B 时所处的位置,当由状态由 A 转到 B 时,SwiftUI...状态、视图标识、动画 既然 SwiftUI 的动画是创建从一个状态到另一个状态的平滑过渡,那么我们必须对状态(依赖项)的改变可能导致的结果有正确的认识。...-05-09 15_14_45 有关视图的结构性标识的内容可以参阅 ViewBuilder 研究(下) —— 模仿中学习[7] 显式标识 在 SwiftUI 中,为视图设置显式识别有两种方式:ForEach...当修饰符 id 的发生变化时,SwiftUI 将其作用的视图当前的视图结构中移除,并创建新的视图添加到原先所在的视图层次位置。因此,可以影响到它的动画部件也是 AnyTransaction 。

14.7K40

打造可适配多平台的 SwiftUI 应用

另一个角度来看,用 SwiftUI 编写的代码,尽管大部分可以运行在不同的平台上,但有一部分则只能运行在特定平台上,而且往往这部分有平台限定的功能,最能体现平台所具有的特点和优势。...我们在视图代码中依赖这个环境越多,将来需要做的调整也就越多。...在 SwiftUI 中,除了环境外,另一个具备较多平台“限制”的部分就是视图的 Modifier。...当我们将“电影猎手” iPhone 移植到 iPad 或 Mac 上时,除了屏幕可用空间更大之外,另一个显着的变化是使用者可以同时打开多个窗口,并可以在不同的窗口中对“电影猎手”进行独立的操作。...因此,在 macOS 中,我们需要单独为 Settings 视图来调整颜色和语言的环境

3.1K80

SwiftUI 布局协议 - Part2

让我们写一个圆形布局的视图容器开始吧。...当我们改变角度时,SwiftUI 会计算好每个视图最初和最终的位置,然后在动画期间内修改它们的位置,A点到B点成一条直线。...wrappedValue = .radians(angle) } 使用双向自定义还有另一个潜在的问题,那就是你的视图必须在不影响别的布局的前提下使用该,否则的话你将会陷入布局循环。...这与双向自定义无关。这是你在写任何布局都必须要考虑的。我们提到 SwiftUI 可能会多次调用 sizeThatFits 去测试视图的灵活性。在这些调用中,你返回的应该是合理的。...在本例中,我创建了两个 UUID 布局,一个标识视图另一个作为父视图的 ID。

2.7K30

打造可适配多平台的 SwiftUI 应用

另一个角度来看,用 SwiftUI 编写的代码,尽管大部分可以运行在不同的平台上,但有一部分则只能运行在特定平台上,而且往往这部分有平台限定的功能,最能体现平台所具有的特点和优势。...我们在视图代码中依赖这个环境越多,将来需要做的调整也就越多。...在 SwiftUI 中,除了环境外,另一个具备较多平台“限制”的部分就是视图的 Modifier。...当我们将“电影猎手” iPhone 移植到 iPad 或 Mac 上时,除了屏幕可用空间更大之外,另一个显着的变化是使用者可以同时打开多个窗口,并可以在不同的窗口中对“电影猎手”进行独立的操作。...因此,在 macOS 中,我们需要单独为 Settings 视图来调整颜色和语言的环境

2K10

老人新兵 —— 一款 iOS APP 的开发手记

去年( 2019 年 )十一开始进入到学习状态,到 11 月底,用了两个月的时间,达到了基本具备构建一个完整 app 的能力( 个人认为 ), 11 月 24 开始( Git 上第一个 commit...很难实现直接返回到根视图,通过 dissmiss 只能返回到上层视图。在 Xcode 11 的 beta 版本中还可以采用一些非常规手段实现这一功能,不过目前已被屏蔽了。...环境和环境对象必须显式注入,否则会运行错误。从这一点来看 Sheet 应该和其他的 view 在数据环境上是隔绝的。...如果 TextField 在 ScrollView 中,当在不同的 Segment Picker 中切换时,使用系统自带中文输入会闪退。英文和第三方中文输入没有问题。...Picker种类基本够用,细节还需要进一步加强。Segment 必须动画显示完才转换,有粘滞感。Date 占地较大。ForEach视图声明中唯一的循环控制方式,控制力有待加强。

2.5K40

SwiftUI 布局 —— 尺寸( 上 )

但由于 SwiftUI视图并没有提供尺寸这一属性,因此即使在 SwiftUI 诞生了数年后的今天,如何获取视图的尺寸仍然是网络上的热门问题。...SwiftUI 布局过程速览 SwiftUI 的布局就是布局系统通过为视图树上的节点提供必要的信息,最终计算出每个视图( 矩形 )所需的尺寸以及摆放位置的行为。...经过该阶段的协商,SwiftUI 将确定视图所在屏幕上的位置和尺寸。...尽管 Layout 协议的主要用途是让开发者创建自定义布局容器,且在 SwiftUI 中仅有少数的视图符合该协议,但从 SwiftUI 1.0 开始,SwiftUI 视图的布局机制便基本与 Layout...( 已处理动态尺寸视图 )的总尺寸,详情请参阅 SwiftUI 布局 —— 对齐[4] 其他控件例如 TextField、TextEditor、Picker 等 需求尺寸取决于建议尺寸和实际显示尺寸 在

4.7K20

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

是否有任何建议用来检测列表中的行选择,类似于 “NavigationLink”,但不导航到另一个视图(例如,显示 Sheet 或列表中选择一个选项 )?...在单元测试中,很难对 SwiftUI 视图中的依赖( 符合 DynamicProperty 协议 )进行测试。这也是 Redux-like 框架的优势之一( 将状态视图中抽离出来,方便测试 )。...在我的例子中,不拖动时 0 到 75,拖动时 0 到 100。有什么办法可以阻止这种情况吗?A:你可以用 .chartYScale(domain: 0 ... 75) 锁定 Y 轴的刻度域。...提问者应该是想通过在父视图中不断修改 id 的参数值,来重新初始化 State 的。...从父视图通过环境进行传递应该可以满足提问者当前的需求:父视图可以传入新,当前视图也可以在视图范围内改变该。总结我忽略掉了没有获得结论的问题。希望上述的整理能够对你有所帮助。

12.2K20

SwiftUI中使用UIKit视图

如果你已经对如何使用UIViewRepresentable有所掌握,可以直接SwiftUI风格化部分阅读 基础 在具体演示包装代码之前,我们先介绍一些与在SwiftUI中使用UIKit视图有关的基础知识...生命周期 SwiftUI同UIKit和AppKit的主要区别之一是,SwiftUI视图(View)是类型,并不是对屏幕上绘制内容的具体引用。...SwiftUI视图,本身没有清晰(可适当描述)的生命周期,它们是、是声明。SwiftUI提供了几个修改器(modifier)来实现类似UIKit中钩子方法的行为。...该方法在UIViewRepresentable的生命周期中会多次调用,直到视图被移出视图树(更准确地描述是切换到另一个不包含该视图视图树分支)。...在绘制屏幕时,会视图树的顶端开始对视图的body求值,如果其中还包含子视图则将递归求值,直到获得最终的结果。

8.2K22

AnyView 对 SwiftUI 性能的影响

前言AnyView 是一种类型擦除的视图,对于 SwiftUI 容器中包含的异构视图非常方便。在这些情况下,你不需要指定视图层次结构中所有视图的具体类型。...如果是 AnyView(基本上是一个包装类型),SwiftUI 将很难确定视图的身份和结构,并且它将重新绘制整个视图,这并不是真正高效的。...在浏览数据时修改我们可以进行的另一个测试是性能测试 - 向列表发送大量内容并强制更新视图(例如,响应消息),同时我们也浏览数据。这将在较短的时间间隔内触发视图的多次重绘。...这也是预期的,因为 SwiftUI 知道视图的标识和结构。当需要更新视图时,仅对其进行更改(例如,向视图添加另一个反应)。...其中一些视图相当昂贵(例如 GIF),因此重新绘制可能是一项相当昂贵的操作。通过使用 AnyView,效果类似于将 id 修饰符的设置为 UUID() - 这将在发生更改时始终更新视图项目。

9600

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

标识为随时间推移而变化的视图提供了一个坚固的锚,它应该是稳定且唯一的。...在 SwiftUI 应用代码中,绝大多数的视图标识都是通过结构性标识 (有关结构性标识的内容可以参阅 ViewBuilder 研究(下) —— 模仿中学习[4])来实现的 —— 通过视图层次结构(视图树...通过它,开发者可以使用任何符合 Hashable 协议的视图设置显式标识。ScrollViewProxy 的 scrollTo 方法就是通过该来找到对应的视图。...另外如果 id 的标识发生变化,SwiftUI 将丢弃原视图(生命周期终止及重置状态)并重新创建新的视图。...解决方案一 iOS 15 开始,SwiftUI 为 List 添加了更多的定制选项,尤其是解除了对列表行分割线设置的屏蔽且添加了官方的实现。

9.1K20
领券