带有NavigationLinks的NavigationView替换了屏幕的不同部分?

时间:2020-07-05 12:41:09

标签: swiftui swiftui-navigationlink

我正在尝试使用SwiftUI实现一个主视图(用于游戏),该视图的底部带有广告横幅。当用户从主视图导航到设置视图时,相同的广告横幅应留在那里并继续展示广告。但是,当用户从主视图导航到游戏视图时,横幅应该不可见。

我正在努力用NavigationView实现这一点。根据我如何在视图层次结构中定位NavigationView,所有NavigationLink都将广告横幅保留在原处或将其隐藏。我尝试仅使用一个NavigationView,并且还使用了两个不同的嵌套和非嵌套的NavigationView,但是似乎没有任何正常工作...

下面是一个简单的代码段,该代码段不起作用,但可以为您提供一些帮助。这两个链接的底部都留下红色的“广告横幅”。如果我在内部VStack中移动“广告横幅”代码(Spacer和HStack),则两个链接都将转到没有广告的视图。

如何在同一个视图中显示不同的导航链接,一个替换整个屏幕,另一个替换在下面显示广告?

import SwiftUI

struct ContentView: View {
    var body: some View {
        VStack {
            NavigationView {
                VStack {
                    NavigationLink(destination: Text("No Ads")) {
                        Text("Link to a view with no Ads") // How to make this link to hide the Ad below?
                    }
                    NavigationLink(destination: Text("Ad visible")) {
                        Text("Link to a view with same Ad visible") // This link works as expected
                    } // Try moving the Ad banner right under here to see the other beavior
                }
            }
            Spacer() // This below is the Ad banner 
            HStack {
                Spacer()
                Text("Ad is shown here")
                    .padding()
                Spacer()
            }
            .background(Color.red)
        }
    }
}

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

1 个答案:

答案 0 :(得分:1)

您可以根据单击的导航链接显示广告横幅。

struct ContentView: View {
    @State var firstActive : Bool = false
    @State var secondActive : Bool = false

    var body: some View {
        VStack {
            NavigationView {
                VStack {
                    NavigationLink(destination: Text("No Ads"), isActive: self.$firstActive) {
                        Text("Link to a view with no Ads") // How to make this link to hide the Ad below?
                    }
                    NavigationLink(destination: Text("Ad visible"), isActive: self.$secondActive) {
                        Text("Link to a view with same Ad visible") // This link works as expected
                    } // Try moving the Ad banner right under here to see the other beavior
                }
            }
            
            if (secondActive || (!secondActive && !firstActive))
            {
                Spacer() // This below is the Ad banner
                HStack {
                    Spacer()
                    Text("Ad is shown here")
                        .padding()
                    Spacer()
                }
                .background(Color.red)
            }
        }
    }
}

使用两个在NavigationLink中用作绑定的状态将跟踪哪个NavigationLink是活动的。然后仅在非广告处于活动状态或仅第二个广告处于活动状态时显示广告横幅。