注册

iOS SwiftUI 框架集成 1.0

框架集成

混合使用SwiftUI框架和平台相关的其它UI框架(视图和视图控制器)

framework and integeration

包含章节

与UIKIT交互

SwiftUI可以在苹果全平台上无缝兼容现有的UI框架。例如,可以在SwiftUI视图中嵌入UIKit视图UIKit视图控制器,反过来在UIKit视图UIKit视图控制器中也可以嵌入SwiftUI视图。

本篇教程展示如何把landmark应用的主页混合使用UIPageViewControllerUIPageControl。使用UIPageViewController来展示由SwiftUI视图构成的轮播图,使用状态变量和绑定来操作用户界面数据的更新。

跟着教程一步步走,可以下载工程文件进行实践。

 项目文件

第一节 创建一个用来展示UIPageViewController的SwiftUI视图

为了在SwiftUI视图中展示UIKit视图和UIKit视图控制器,需要创建遵循UIViewRepresentableUIViewControllerRepresentable协议的类型。创建的自定义视图类型,用来创建和配置所要展示的UIKit类型,SwiftUI框架来管理UIKIt类型的生命周期并在适当的时机更新它们。

section 1

步骤1 创建一个新的SwiftUI视图文件,命名为PageViewController.swift,并且声明PageViewController类型遵循UIViewControllerRepresentable。这个页面视图控制器存放一个UIViewController实例数组,数组中的每一个元素代表在地标滚动过程中的一页视图。

section 1 step 1

下一步添加UIViewControllerRepresentable协议的两个实现, 目前因为协议方法没有完成实现,会有报错提示。

步骤2 添加一个makeUIViewController(context:)方法,方法内部以指定的配置创建一个UIPageViewControllerSwiftUI会在准备显示视图时调用一次makeUIViewController(context:)方法创建UIViewController实例,并管理它的生命周期。

section 1 step 2

由于还缺少一个协议方法没有实现,所以目前还是会报错。

步骤3 添加updateUIViewController(_:context:)方法,这个方法里调用setViewControllers(_:direction:animated:)方法展示数组中的第一个视图控制器

section 1 step 3

创建另一个SwiftUI视图展示遵循UIViewControllerRepresentable协议的视图

步骤4 创建一个名为PageView.swift的视图,声明一个PageViewController作为子视图。初始化时使用一个视图数组来初始化,并把每一个视图都嵌入在一个UIHostingController中。UIHostingController是一个UIViewController的子类,用来在UIKit环境中表示一个SwiftUI视图。

section 1 step 4

步骤5 更新预览视图,并传入视图数组,预览视图就会开始工作了

section 1 step 5

步骤6 在继续下面的步骤前,先把PageView的预览视图固定住,以避免在文件切换时不能实现预览到PageView的改变。

section 1 step 6

第二节 创建视图控制器的数据源

短短几个步骤就做了很多事,PageViewController使用UIPageViewController去展示来自SwiftUI内容。现在是时候添加挥动手势进行页面之间的翻动了。

section 2

一个展示UIKit视图控制器的SwiftUI视图可以定义一个Coordinator类型,这个Coordinator类型由SwitUI管理,用来作为视图展示的环境

步骤1 在PageViewControlelr中定义一个嵌套类型CoordiantorSwiftUI管理UIViewController Representable类型的coordinator,并在调用方法时把它作为环境的一部分。

section 2 step 1

步骤2 在PageView Controller中添加另一个方法,创建coordinatorSwiftUI在调用makeUIViewController(context:)前会先调用makeCoordinator()方法,因此在配置视图控制器时是可以访问到coordiantor对象的。可以使用coordinator为实现通用的Cocoa模式,例如:代理模式数据源以及目标-动作

section 2 step 2

步骤3 让Coordinator类型添加UIPageViewControllerDataSource协议遵循,并且实现两个必要方法。这两个必要方法会建立起视图控制器之间的联系,因此可以实现页面之前的前后切换。

section 2 step 3

步骤4 把coordiantor作为UIPageViewController的数据源

section 2 step 4

步骤5 打开实时预览,并测试一下前后页面切换的功能是否正常

swipe landmarks

0 个评论

要回复文章请先登录注册