NavigationView 的内容未显示 SwiftUI

Question

I am attempting to create a NavigationView in SwiftUI with a single NavigationLink inside. My code so far is:

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()
    }
}

Nothing gets displayed in the live preview or when I run on a simulator. The live preview looks like this:

If I change the code a little bit and duplicate the NavigationLink then I can get one of the NavigationLinks to appear.

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"))
        }
    }
}

I am trying to make a home page with multiple links to other SwiftUI screen view files. Any help is appreciated!

Thanks.

Answer 1

Instead of this

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

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

do this

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

Update : I assume I've got your issue, which I at first just passed automatically. NavigationView is platform specific. By default iPad has Master/Details navigation style, which has different presentation depending on orientation, so you don't see in Preview your link, because Preview is in Portrait and navigation link is in Sidebar, which is hidden.

If you want to see it in such Preview, you need to use .navigationViewStyle(StackNavigationViewStyle()) for NavigationView . Or, in your variant, just run application in Simulator and using CMD-Left/Right arrow rotate Simulator.

Note : It's not possible to rotate Preview or now. Just in case.

Answer 2

如果您使用的是 iPad，我想说第一个navigationLink用作草图/索引视图，您可以通过向右滑动将其取出。

Answer 3

Try this, I am also having issues initially but trying this way works for me !!

  var body: some View 
  {
      NavigationView 
     {
           VStack(alignment: .center)
              {
                  //Your ui designs
              } 
       .navigationBarTitle(Text("Forgot 
        Password").font(.largeTitle).fontWeight(.medium), displayMode: .inline)

      }
  }