时间戳

首页 > 解决方案 > NavigationView 的内容未显示 SwiftUI

swift - NavigationView 的内容未显示 SwiftUI

问题描述

我正在尝试在 SwiftUI 中创建一个 NavigationView，其中包含一个 NavigationLink。到目前为止，我的代码是：

import SwiftUI

struct HomeView: View {
    var body: some View {
        NavigationView {
            NavigationLink(destination: PlayersView()) {
                Text("Players")
                    .foregroundColor(.white)
                    .padding(12)

            }
            .background(Color.black)
            .cornerRadius(12)


            .navigationBarTitle(Text("Home"))
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        HomeView()
    }
}

实时预览中或在模拟器上运行时没有显示任何内容。实时预览如下所示：

SwiftUI 实时预览示例 1

如果我稍微更改代码并复制 NavigationLink，那么我可以让其中一个 NavigationLink 出现。

struct HomeView: View {
    var body: some View {
        NavigationView {
            NavigationLink(destination: PlayersView()) {
                Text("Players")
                    .foregroundColor(.white)
                    .padding(12)

            }
            .background(Color.black)
            .cornerRadius(12)

            NavigationLink(destination: PlayersView()) {
                Text("Players")
                    .foregroundColor(.white)
                    .padding(12)

            }
            .background(Color.black)
            .cornerRadius(12)

            .navigationBarTitle(Text("Home"))
        }
    }
}

SwiftUI 实时预览示例 2

我正在尝试创建一个主页，其中包含指向其他 SwiftUI 屏幕视图文件的多个链接。任何帮助表示赞赏！

谢谢。

标签： swiftxcodeswiftui

解决方案

而不是这个

NavigationLink(destination: PlayersView()) {
    Text("Players")
        .foregroundColor(.white)
        .padding(12)

}
.background(Color.black)
.cornerRadius(12)

做这个

NavigationLink(destination: PlayersView()) {
    Text("Players")
        .foregroundColor(.white)
        .padding(12)
        .background(Color.black)
        .cornerRadius(12)
}

更新：我想我有你的问题，我一开始只是自动通过了。NavigationView 是特定于平台的。默认情况下，iPad 具有 Master/Details 导航样式，根据方向具有不同的呈现方式，因此您不会在 Preview 中看到您的链接，因为 Preview 是 Portrait 并且导航链接在 Sidebar 中，它是隐藏的。

如果你想在这样的 Preview 中看到它，你需要使用.navigationViewStyle(StackNavigationViewStyle())for NavigationView。或者，在您的变体中，只需在模拟器中运行应用程序并使用CMD-Left/Right arrow旋转模拟器。

注意：无法旋转预览或现在。以防万一。

推荐阅读