开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

SwiftUI自定义视图永远重复动画显示为意外

SwiftUI是一种用于构建用户界面的现代化框架，它是苹果公司推出的一种声明式UI编程范式。SwiftUI的核心理念是通过简洁的代码实现复杂的用户界面，同时提供了丰富的视图和控件库，以及强大的动画和效果支持。

在SwiftUI中，自定义视图是一种重要的概念。通过自定义视图，开发者可以根据自己的需求创建具有特定功能和样式的视图组件。然而，有时候在使用自定义视图时会遇到一个问题，即视图的动画显示会出现意外的重复。

这种意外的重复动画显示通常是由于视图的状态变化不正确或动画的触发条件不准确导致的。为了解决这个问题，我们可以采取以下几个步骤：

检查视图的状态变化：首先，我们需要确保视图的状态变化是正确的。在SwiftUI中，视图的状态通常由@State或@Binding属性来管理。如果状态变化不正确，可能会导致动画重复显示。因此，我们需要仔细检查视图的状态变化逻辑，确保它们按照预期进行更新。
检查动画的触发条件：其次，我们需要检查动画的触发条件是否准确。在SwiftUI中，动画可以通过添加.animation修饰符来触发。如果动画的触发条件不准确，可能会导致动画重复显示。因此，我们需要仔细检查动画的触发条件，确保它们按照预期进行触发。
使用动画修饰符：如果以上步骤都没有解决问题，我们可以尝试使用.animation修饰符来显式地指定动画的类型和参数。通过使用不同的动画类型和参数，我们可以调整动画的行为，从而避免重复显示的问题。

总结起来，当SwiftUI自定义视图永远重复动画显示为意外时，我们应该检查视图的状态变化、动画的触发条件，并尝试使用动画修饰符来解决问题。如果问题仍然存在，我们可以查阅SwiftUI官方文档或社区资源，寻求更多的帮助和解决方案。

腾讯云相关产品和产品介绍链接地址：

腾讯云开发者平台：https://cloud.tencent.com/developer
腾讯云云原生服务：https://cloud.tencent.com/product/cns
腾讯云数据库服务：https://cloud.tencent.com/product/cdb
腾讯云服务器运维：https://cloud.tencent.com/product/cvm
腾讯云音视频服务：https://cloud.tencent.com/product/tcav
腾讯云人工智能服务：https://cloud.tencent.com/product/ai
腾讯云物联网服务：https://cloud.tencent.com/product/iotexplorer
腾讯云移动开发服务：https://cloud.tencent.com/product/mobdev
腾讯云存储服务：https://cloud.tencent.com/product/cos
腾讯云区块链服务：https://cloud.tencent.com/product/baas
腾讯云元宇宙服务：https://cloud.tencent.com/product/mu

相关搜索:SwiftUI -动画视图扩展(显示/隐藏)在显示.sheet时制作SwiftUI视图动画如何在SwiftUI中停止显示动画视图？SwiftUI:显示带有动画延迟的特定视图 SwiftUI -按下按钮时为视图设置动画 SwiftUI |使用ScrollViewReader为scrollTo()自定义动画？你能在消失时为SwiftUI视图设置动画吗？在SwiftUI中完成动画后隐藏和显示视图 SwiftUI:如何保持动画的隐藏和显示按钮(视图)？SwiftUI显示带延迟的自定义视图从目标视图返回时，SwiftUI NavigationLink显示为突出显示 SwiftUI -希望在保持视图方向不变的同时为圆周设置动画如何在SwiftUI中显示警报视图或自定义覆盖实现自定义动画以在iPad上显示指定视图的模态视图如何在SwiftUI中将视图添加到层次结构时为过渡设置动画如何在SwiftUI中为通过自定义结构传递的@State值设置动画如果操作未立即完成，则绑定到@Published var时SwiftUI视图不会显示动画如何将SwiftUI工具栏设置为显示在视图中心如何根据文本编辑器的文本更改来为SwiftUI视图提供动画效果？SwiftUI:如何将视图显示为在背景中模糊的当前视图顶部的弹出窗口？

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

SwiftUI：视图的显示和隐藏动画

SwiftUI最强大的功能之一是能够自定义视图的显示和隐藏方式。以前，您已经了解了如何使用常规if条件有条件地包含视图，这意味着当条件更改时，我们可以从视图层次结构中插入或移除视图。...转换控制插入和删除的方式，我们可以使用内置转换，以不同的方式组合它们，甚至创建完全自定义的转换。...没有动画；它只是突然出现和消失。...通过使用withAnimation（）包装状态更改，我们可以获得SwiftUI的默认视图转换，如下所示： withAnimation { self.isShowingRed.toggle() }...一个有用的方法是不对称，它允许我们在显示视图时使用一个转换，在视图消失时使用另一个转换。

4.6K3 0

在 SwiftUI 中的作用域动画

我们将动画视图修饰符附加到整个堆栈，以动画堆栈内的任何更改。当我们按下按钮时，堆栈会动画显示内部的任何更改。...但是，动画视图修饰符不连接到 isHidden 属性，这意味着它将动画显示可能发生的任何更改。其中一些更改可能是意外的，比如环境值的变化。...动画视图修饰符我们可以通过使用动画视图修饰符的另一个版本来消除意外动画，在这个版本中，我们可以绑定到特定值，并且仅在值更改时进行动画处理。...总结这篇文章介绍了在SwiftUI中构建动画的新方法，重点解决了在多步动画或特定视图层次结构中控制动画的挑战。...最后，介绍了在 SwiftUI 中构建有作用域的事务的新方法，以维护更具精确性和可控性的动画。这些新功能在最新的平台上可用，为SwiftUI开发者提供了更强大的动画工具。

1711 0

Ask Apple 2022 与 SwiftUI 有关的问答（下）

，只提取你需要的属性，并依靠 SwiftUI 的 equality 检查来提前中止无效计算苹果工程师给出的答案与避免 SwiftUI 视图的重复计算[5] 一文中的很多建议都一致。...这个技巧对于处于屏幕的顶部或底部的视图十分有用。详情请参阅推文[15] 。动画转场Q：为什么下面的代码没有显示动画转场。...连锁动画Q：在 SwiftUI 中，如何实现连锁动画？例如，我想先给一个视图做动画，当动画完成后立即启动另一个动画。A：不幸的是，目前不可能实现连锁动画。...在 Cell 视图中，通过创建 request 从私有上下文中提取数据并转换成图片。另外，可以考虑为原始图片创建缩略图，进一步提高显示的效率。...5] 避免 SwiftUI 视图的重复计算: https://www.fatbobman.com/posts/avoid_repeated_calculations_of_SwiftUI_views/[

14.8K3 0

Ask Apple 2022 与 SwiftUI 有关的问答（上）

在有些情况下，我想根据视图是否折叠来做决定（例如，如果展开，在详细视图中显示一条信息，如果折叠，则显示一个警告或其他指示）。...有关下划线的含义和用法，请参阅为自定义属性包装类型添加类 @Published 的能力[17] 。...这就涉及到了所有符合 DynamicProperty 协议的属性包装器的一个特点：在视图的生存期内仅有第一次初始化的实例会与视图创建关联。详细请阅读避免 SwiftUI 视图的重复计算[22] 。...: https://developer.apple.com/documentation/swiftui/openwindowaction/[17] 为自定义属性包装类型添加类 @Published 的能力.../10022/[22] 避免 SwiftUI 视图的重复计算: https://www.fatbobman.com/posts/avoid_repeated_calculations_of_SwiftUI_views

12.3K2 0

WWDC 23 ，SwiftUI 5 和 SwiftData 的初印象

革命性的动画和视觉效果升级 SwiftUI 原本欠缺一些高级的动画和视觉功能在本次升级中一并被补上了，而且苹果大幅更新了动画、转场、Shape、效果等方面的内部实现。...、全新的 CustomAnimation 协议（支持自定义动画函数）、弹簧动画等众多新功能。...，直接定位到滚动视图的特定位置，只能使用一次）、全新的滚动条控制（闪烁）、可自定义行视图在滚动区域的顶端和显示区域的显示状态（例如可用其实现类似 watchOS 中的滚动到顶端子视图缩小的视觉效果...）、支持分页滚动（开发者长期盼望的）、自定义滚动内容的缩进、为滚动内容（非滚动容器）添加安全区域等众多功能。...为配合 SwiftData，Core Data 做了很小幅度的升级，其中一个值得关注的功能是 自定义 composite 类型。

1.1K2 0

WWDC 23 ，SwiftUI 5 和 SwiftData 的初印象

革命性的动画和视觉效果升级 SwiftUI 原本欠缺一些高级的动画和视觉功能在本次升级中一并被补上了，而且苹果大幅更新了动画、转场、Shape、效果等方面的内部实现。...、全新的 CustomAnimation 协议（支持自定义动画函数）、弹簧动画等众多新功能。...，直接定位到滚动视图的特定位置，只能使用一次）、全新的滚动条控制（闪烁）、可自定义行视图在滚动区域的顶端和显示区域的显示状态（例如可用其实现类似 watchOS 中的滚动到顶端子视图缩小的视觉效果...）、支持分页滚动（开发者长期盼望的）、自定义滚动内容的缩进、为滚动内容（非滚动容器）添加安全区域等众多功能。...为配合 SwiftData，Core Data 做了很小幅度的升级，其中一个值得关注的功能是 自定义 composite 类型[4]。

3841 0

SwiftUI 的动画机制

SwiftUI 采用了声明式语法来描述不同状态下的 UI 呈现，动画亦是如此。官方文档将 SwiftUI 的动画（Animations）定义为：创建从一个状态到另一个状态的平滑过渡。...当状态的改变导致视图树的分支发生变化时，SwiftUI 将使用其包裹的可动画部件对视图进行动画处理。使用转场同样需要满足 SwiftUI 动画的三要素。...自定义转场在 SwiftUI 中实现自定义转场并不困难，除非需要创建炫酷的视觉效果，大多数情况下都可以通过使用 SwiftUI 已提供的可动画部件组合而成。...) } } .frame(width: 400, height: 500) } } 修饰符 id 需要使用转场修饰符 id 是另一种为视图提供显示标识的方式...有关显性标识方面的内容可以参阅优化在 SwiftUI List 中显示大数据集的响应效率[8] 一文遗憾与展望理论上，一旦你掌握了 SwiftUI 的动画机制，就应该能轻松地驾驭代码，自由地控制动画

14.8K4 0

SheetKit——SwiftUI模态视图扩展库

[1] SheetKit的Github地址为 https://github.com/fatbobman/SheetKit SheetKit是什么 SheetKit[2]是一个SwiftUI模态视图的增强库...•新的半高模态视图在WWDC 2021中，苹果为大家带来了期待已久的半高模态视图。或许推出的比较仓促，这种很受欢迎的交互方式并没有提供SwiftUI版本，仅支持UIKit。...使用下面语句将关闭显示动画 SheetKit().present(animated: false) Sheet类型目前SheetKit支持三种模态视图类型：sheet、fullScreenCover、...().dismiss() 同样支持动画控制如果在视图外执行SheetKit方法，请务必保证代码运行在主线程上。...在SwiftUI3.0中，已经可以使用原生API生成各种毛玻璃效果了。但只有将模态视图的背景设置为透明，毛玻璃效果才能显现出来。

2.9K2 0

SwiftUI Overlay Container 2 —— 可定制、高效、便捷的视图管理器

仅需简单配置，SwiftUI Overlay Container 即可帮你完成从视图组织、队列处理、转场、动画、交互到显示样式配置等基础工作，让开发者可以将精力更多地投入到应用程序视图的实现本身。...在 SwiftUI 中，描述视图已经变得十分的容易，因此我们完全可以将上述场景中的显示逻辑提炼出来，创建出一个可以覆盖更多使用场景的库，帮助开发者组织视图的显示风格和交互逻辑。...所有的 SwiftUI 视图都可以在容器内显示。...shadowStyle 为视图添加阴影 dismissGesture 为视图添加取消手势，目前支持单击、双击、长按、左划、右划、上划、下划、自定义。...) 撤销除了指定的容器外其他所有容器中的视图，当 onlyShow 为真时，仅撤销正在显示的视图。

2.1K2 0

用 SwiftUI 的方式进行布局

但如果为视图分别设定不同的动画曲线（例如：一个 linear、一个 easeIn ），状态切换时便无法保证视图之间的完全紧密。...（不显示），并将其底边与屏幕底边对齐。...七、Transition 通过为视图设定 Transition（转场），在视图插入或将其移出视图树时，SwiftUI 将自动生成对应的动画效果。...转场是 SwiftUI 提供的强大能力之一，可以极大地简化动画实现的难度。我写的视图管理器 SwiftUI Overlay Container[7] ，便是建立在对转场功能的充分应用之上。...有关转场动画的更多内容，请参阅 SwiftUI 的动画机制[8] 一文八、Layout 协议在 4.0 版本中，SwiftUI 增加了 Layout 协议，通过该协议，开发者可以针对特定的场景，创建自定义布局容器

3.3K0 0

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

在 WWDC 2023 中，苹果为 SwiftUI 添加了一个新的修饰器：geometryGroup()。它可以解决一些之前无法处理或处理起来比较困难的动画异常。...默认情况下，SwiftUI 视图会将位置和大小的变化沿视图层级向下传递，以至于只有绘制内容的视图（称为叶子视图）将当前动画应用到它们的框架矩形上。...这是因为在 SwiftUI 中，每个可动画视图根据 transaction 中的信息自行决定自身的动画行为。...由此可见，geometryGroup() 中 Group 的含义为父视图统一处理并动画化其几何属性变化后，再传递给子视图。子视图不再各自独立处理上述信息。...geometryGroup() 确保子视图在统一的几何信息环境中，以实现预期的布局效果。它为子视图提供了一个连续的几何信息更新过程。总结上述条件后，我们就很容易创建出其它会导致意外行为的代码。

2891 0

SwiftUI 布局协议 - Part2

AnyLayout 切换布局结语 Part 2 - 高级布局：前言 自定义动画双向自定义值避免布局循环和崩溃递归布局布局组合插入两个布局使用绑定参数一个有用的调试工具最后的思考 自定义动画...当我们改变角度时，SwiftUI 会计算好每个视图最初和最终的位置，然后在动画期间内修改它们的位置，从A点到B点成一条直线。...开始的位置和结束的位置是一样的，因此就 SwiftUI 而言，没有动画。如果这就是你要找的东西，那就太好了，但由于我们将视图围绕一个圆圈放置，如果视图沿着那个假想的圆圈移动不是更有意义吗？...这与双向自定义值无关。这是你在写任何布局都必须要考虑的。我们提到 SwiftUI 可能会多次调用 sizeThatFits 去测试视图的灵活性。在这些调用中，你返回的值应该是合理的。...视图的缩放和旋转要再一次使用双向自定义值实现。在这个例子中在容器中一共有44个视图，所以我们的新容器将会分别以12，12，12和8为一圈。注意本案例中如何使用缓存与子视图通信。

2.7K3 0

【visionOS】从零开始创建第一个visionOS程序

每个场景都包含要显示的视图和控件，场景类型决定内容是采用2D还是3D外观。SwiftUI为visionOS添加了3D场景类型，还为所有场景类型添加了3D元素和布局选项。...你也可以用它来为你的内容构建和测试自定义的RealityKit动画和行为。修改现有的窗口页面链接使用标准的SwiftUI视图构建初始接口。...视图为您的界面提供基本内容，您可以使用SwiftUI修饰符自定义视图的外观和行为。...根据需要将深度效果合并到自定义视图中，并使用3D布局选项来安排窗口中的视图。为视图应用shadow(color:radius:x:y:) 或visualEffect(_:)修饰符。...加载现有的USDZ资产或在Reality Composer Pro中创建场景，为您的内容合并动画，物理，灯光，声音和自定义行为。

9424 0

SwiftUI 动画进阶 — Part4：TimelineView

SwiftUI 没有理由重新计算视图的主体。2021 年 WWDC 的一个精彩演讲是 Demystify SwiftUI。它解释了视图标识、生命周期和依赖关系。...但为动画的每一帧编写所有代码给了我们带来了很多负担。笔者将在本节中介绍的技术，使用我们已熟知的动画并且热衷于视图动画从一个时间线更新到下一个时间线。...MetronomeBack 和 Metronome Front 的代码非常简单，它们使用了一种称为圆形梯形的自定义形状。为避免使此页面过长，自定义形状的代码在此 gist 。...我们在整个动画中定义了几个关键点，在这里我们改变了我们视图的参数，并让 SwiftUI 动画这些点之间的过渡。以下示例将尝试概括该想法，并使其更加明显。...如果在某个时候，你想要/需要告诉你的视图刷新，你可以随时调用 objectWillChange.send() 匹配动画持续时间和偏移量：在关键帧示例中，我们为每个动画片段使用不同的动画。

3.8K3 0

掌握 Transaction，实现 SwiftUI 动画的精准控制

SwiftUI 会在以下情况下调用隐式动画创建 transaction：当前视图分支在状态变化时会发生变化当前视图分支上声明了隐式动画下面的代码将展示隐式动画是如何创建 transaction 并向下传递的...几点提示： SwiftUI 可能会在应用初始阶段为部分视图设置 transaction（值为 nil ），即使没有设置，也不影响视图在状态变化时获取正确的 transaction。...SwiftUI 可能会在状态改变后为部分视图重置 transaction（值为 nil ），即使没有重置，也不影响下次的动画（下次状态变化时，会生成新的 transaction ）。...如果该属性为 true，则不创建新的 transaction。这个自定义实现完全仿照了 SwiftUI 提供的 animation 修饰器的实现逻辑。...TransactionKey 在 WWDC 2023 上，苹果为 SwiftUI 添加了 TransactionKey。这允许开发者在 transaction 中携带一些自定义信息。

5072 0

用 SwiftUI 的方式进行布局

但如果为视图分别设定不同的动画曲线（例如：一个 linear、一个 easeIn ），状态切换时便无法保证视图之间的完全紧密。...（不显示），并将其底边与屏幕底边对齐。...七、Transition 通过为视图设定 Transition（转场），在视图插入或将其移出视图树时，SwiftUI 将自动生成对应的动画效果。...转场是 SwiftUI 提供的强大能力之一，可以极大地简化动画实现的难度。我写的视图管理器 SwiftUI Overlay Container ，便是建立在对转场功能的充分应用之上。...有关转场动画的更多内容，请参阅 SwiftUI 的动画机制一文八、Layout 协议在 4.0 版本中，SwiftUI 增加了 Layout 协议，通过该协议，开发者可以针对特定的场景，创建自定义布局容器

4.8K8 0

解析SwiftUI布局细节（二）循环轮播+复杂布局

这篇我们还是说我们关于SwiftUI的东西，再提一下Demo代码我已经提交上Git了，目前Demo进度为一级页面基本上结束，地图点击大头针的添加也刚处理完，代码有需要的小伙伴可以去Git看看，项目地址...GeometryReader 的主要作用就是能够获取到父View建议的尺寸，这就是它的主要作用，要没有它我们面临的可能就是无休止的传值了，SwiftUI 既然是声明式的UI,按我的理解你就没有办法去获取某一个视图的父视图之类的...有一个还得说明一下，GeometryReader 改变了它显示内容的方式。在 iOS 13.5 中，内容放置方式为 .center。在 iOS 14.0 中则为：.topLeading。...3、再提一点关于上面说的滚动视图，在UIKit中我们可以用UICollectionView搞定一切，但是在SwiftUI中没有这个控件，我建议采用的方式是 ScrollView + HStack + VStack...之GeometryReader 理解SwiftUI关键字 State Binding ObservesOgiect EnvironmentObje SwiftUI 自定义实现旋转木马轮播效果

12.1K2 0

高级 SwiftUI 动画 — Part 1：Paths

这些都是被官方文档完全忽略的主题，在SwiftUI 的帖子和文章中也几乎没有提及。不过，它们还是为我们提供了创建一些相当不错的动画的工具。...每当视图上的可动画参数发生变化时，SwiftUI 就会从旧值到新值制作动画。一些可动画的参数包括大小(size)、偏移(offset)、颜色(color)、比例(scale)等。...当给一个视图制作动画时，SwiftUI 实际上是多次重新生成该视图，并且每次都修改动画参数。这样，它就会从原点值渐渐走向最终值。假设我们为一个视图的不透明度创建一个线性动画。...SwiftUI 已经为不透明度制作了动画，而不需要我担心这一切。是的，这是真的，但只要 SwiftUI 知道如何将数值从原点插值到终点。对于不透明度，这是一个直接的过程，SwiftUI 知道该怎么做。...你只需要添加 .drawingGroup() 修饰符: FlowerView().drawingGroup() 根据 WWDC 2019, Session 237（用SwiftUI构建自定义视图）：绘图组是一种特殊的渲染方式

3.8K2 0

AnyView 对 SwiftUI 性能的影响

前言AnyView 是一种类型擦除的视图，对于 SwiftUI 容器中包含的异构视图非常方便。在这些情况下，你不需要指定视图层次结构中所有视图的具体类型。...我们将使用动画卡顿仪器配置文件以及这个开源 FPS 计数器。动画卡顿苹果建议使用动画卡顿作为衡量应用性能的指标。卡顿基本上是指在屏幕上显示的帧比预期晚的帧。...这是有道理的，因为 SwiftUI 不知道它已经显示过此视图一次（因为它隐藏在 AnyView 下）。因此，它会再次绘制它，同时还可能缓存（但不使用）该视图的旧版本。...其中一些视图相当昂贵（例如 GIF），因此重新绘制可能是一项相当昂贵的操作。通过使用 AnyView，效果类似于将 id 修饰符的值设置为 UUID() - 这将在发生更改时始终更新视图项目。...总结总而言之，在这些情景中（包含异构视图的可滚动列表），最好为容器中的不同视图使用具体类型。这可能听起来更复杂一些，但实际上你可以使其更简单，而不必过多地处理泛型。

1420 0

WWDC 23 之后的 SwiftUI 有哪些新功能

前言 WWDC 23 已经到来，SwiftUI 框架中有很多改变和新增的功能。在本文中将主要介绍 SwiftUI 中数据流、动画、ScrollView、搜索、新手势等功能的新变化。...动画动画始终是 SwiftUI 框架中最重要的部分。在 SwiftUI 中轻松实现任何动画，但之前的框架版本缺少一些现在具有的功能。...框架引入了新的 PhaseAnimator 视图，它遍历阶段序列，允许为每个阶段提供不同的动画，并在阶段更改时更新内容。...isPresented 参数来显示/隐藏搜索字段。...#Preview { ContentView() } 还有一个新的 Preview 宏，可以让我们轻松地为 UIKit 和 SwiftUI 构建预览，只需几行代码。

3842 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭