为SwiftUI Apple Watch App实现基于页面的导航 [英] Implementing Page Based Navigation for SwiftUI Apple Watch App

问题描述

我正在SwiftUI中构建一个Apple Watch应用程序，并且希望实现基于页面的导航，以便当用户在主屏幕上向左滑动时，他们会被带到另一个视图.

I'm building an Apple Watch app in SwiftUI and would like to implement page based navigation so when users swipe left on the home screen, they are taken to another view.

我了解如何使用NavigationLink使用户从一个屏幕移动到另一屏幕，但不了解如何通过向左或向右滑动来使用户在屏幕之间导航.

I understand how to use NavigationLink to let users move from one screen to another, but not how to let users navigate from screen to screen by swiping left or right.

有人知道该怎么做吗?

推荐答案

此处是如何使用SwiftUI为watchOS实现基于页面的导航的指南.该说明基于使用watchOS，SwiftUI版本的问题:

Here is a guide how to implement page-based navigation for watchOS using SwiftUI. The description is based on Hacking with watchOS, SwiftUI edition:

首先，创建一个新的SwiftUI视图，例如称为CounterView.

First, create a new SwiftUI view, for example called CounterView.

第二，创建WKHostingController的子类以显示新的SwiftUI视图.只需复制HostingController.swift中已经存在的控制器，并将其名称更改为CounterHostingController.然后，文件HostingController.swift包含以下两个控制器:

Secondly, create a subclass of WKHostingController to show that new SwiftUI view. Just copy the controller already existing in HostingController.swift and change its name to CounterHostingController. The file HostingController.swift then contains these two controllers:

class HostingController: WKHostingController<ContentView> {
    override var body: ContentView {
        return ContentView()
    }
}

class CounterHostingController: WKHostingController<CounterView> {
    override var body: CounterView {
        return CounterView()
    }
}

第三，通过打开文件Interface.storyboard并单击Xco​​de窗口右上角的+按钮，创建一个故事板场景来存储该新创建的托管控制器.在搜索框中输入主机控制器"，拖出新的主机控制器并将其移到现有主机控制器旁边.在身份检查器中(单击Xco​​de窗口右侧顶部第二个菜单中的第四项，在该菜单中显示一个文档，该文档的左上角有图片，文本周围浮动)，将Class更改为"CounterHostingController"，然后选中从目标继承模块"框.

Thirdly, create a storyboard scene to store that newly created hosting controller by opening the file Interface.storyboard and clicking the + button in the top right of the Xcode window. Type in "Hosting Controller" in the search box, drag out a new Hosting Controller and move it next to the existing Hosting Controller. In the identity inspector (click on the fourth item in the second menu from the top on the right side of the Xcode window, the one showing a document with a picture on the top left corner and text floating around it), change Class to "CounterHostingController", then check the "Inherit Module From Target" box.

第四，为了将这两个屏幕连接为同一用户界面的页面，请在情节提要中按Ctrl键，然后在原始主机控制器上用鼠标单击并按住键，同时将鼠标指针拖到新控制器上，然后，松开鼠标键后，选择下一页"进行关联.

Fourth, in order to connect these two screens as pages of the same user interface, in the storyboard press Ctrl and click with the mouse on the original hosting controller and hold the keys while dragging the mouse pointer onto the new controller and, after releasing the mouse button, select "next page" for the relationship segue.

这篇关于为SwiftUI Apple Watch App实现基于页面的导航的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！