美文网首页
SwiftUI-NavigationStack

SwiftUI-NavigationStack

作者: xiaofu666 | 来源:发表于2023-02-26 10:34 被阅读0次

使用导航堆栈在根视图上显示视图堆栈。人们可以通过单击或点击NavigationLink将视图添加到堆栈顶部,并使用内置的、适合平台的控件(如后退按钮或滑动手势)删除视图。堆栈始终显示最近添加的尚未删除的视图,并且不允许删除根视图。
要创建导航链接,请在堆栈的视图层次结构中添加navigationDestination(for:destination:)修饰符,将视图与数据类型相关联。然后初始化一个Navigation,该Link显示相同类型数据的实例。以下堆栈显示显示Park视图,用于显示Park类型数据的导航链接:

NavigationStack {
    List(parks) { park in
        NavigationLink(park.name, value: park)
    }
    .navigationDestination(for: Park.self) { park in
        ParkDetails(park: park)
    }
}

在本例中,List充当根视图,并且始终存在。从列表中选择导航链接会将ParkDetails视图添加到堆栈中,使其覆盖列表。返回导航会删除详细信息视图并再次显示列表。当堆栈为空且根视图(即列表)可见时,系统会禁用向后导航控件。

管理导航状态

默认情况下,导航堆栈管理状态以跟踪堆栈上的视图。但是,您的代码可以通过绑定到您创建的数据值集合来初始化堆栈来共享状态的控制。堆栈在向堆栈添加视图时将项目添加到集合中,并在删除视图时删除项目。例如,您可以创建一个State属性来管理公园详细信息视图的导航:

@State private var presentedParks: [Park] = []

将状态初始化为空数组表示没有视图的堆栈。init(path:root:)初始化器创建堆栈时,使用美元符号$)前缀提供此状态属性的Binding

NavigationStack(path: $presentedParks) {
    List(parks) { park in
        NavigationLink(park.name, value: park)
    }
    .navigationDestination(for: Park.self) { park in
        ParkDetails(park: park)
    }
}

与以前一样,当有人点击或单击公园的导航链接时,堆栈使用关联的公园数据显示Park视图。然而,现在堆栈还将公园数据放在presented的Parks数组中。您的代码可以观察此数组来读取当前堆栈状态。它还可以修改数组以更改堆栈上的视图。例如,您可以创建一个方法,用一组特定的公园配置堆栈:

func showParks() {
    presentedParks = [Park("Yosemite"), Park("Sequoia")]
}

show方法将堆栈的显示替换为显示红杉的详细信息的视图,红杉是新presentedParks数组中的最后一个项目。从该视图返回将从数组中删除红杉,该数组会显示显示Yosemite详细信息的视图。使用路径支持深度链接、状态恢复或其他类型的编程导航。

导航到不同的视图类型

要创建可以显示多种视图的堆栈,您可以在堆栈的视图层次结构中添加多个navigationDestination(for:destination:)修饰符,每个修饰符呈现不同的数据类型。该堆栈根据导航链接各自的数据类型将导航链接与导航目的地匹配。

要创建包含多种数据的编程导航路径,您可以使用Navigation实例作为路径。

相关文章

  • SwiftUI-NavigationStack

    使用导航堆栈在根视图上显示视图堆栈。人们可以通过单击或点击NavigationLink将视图添加到堆栈顶部,并使用...

网友评论

      本文标题:SwiftUI-NavigationStack

      本文链接:https://www.haomeiwen.com/subject/cvmfldtx.html