在 SwiftUI 的 TabView 上方显示 BottomPlayerView

Question

我正在学习 swiftUI，我想制作一个音乐应用。

我创建了一个位于 tabView 上方的视图，但我希望它仅在用户开始播放音乐时显示。

我的应用程序，我将 ZStack 用于 bottomPlayer，并通过 .environmentObject(bottomPlayer) 共享 bottomPlayer 变量，以便子视图可以使用它：

class BottomPlayer: ObservableObject {
    var show: Bool = false
}

@main
struct MyCurrentApp: App {
    var bottomPlayer: BottomPlayer = BottomPlayer()
    var audioPlayer = AudioPlayer()

    var body: some Scene {
        WindowGroup {
            ZStack(alignment: Alignment(horizontal: .center, vertical: .bottom)) {
                TabBar()
                if bottomPlayer.show {
                    BottomPlayerView()
                        .offset(y: -40)
                }
            }
            .environmentObject(bottomPlayer)
        }
    }
}

BottomPlayerView（在 TabView 之上）

struct BottomPlayerView: View {
        var body: some View {
            HStack {
                Image("cover")
                    .resizable()
                    .frame(width: 50, height: 50)
                VStack(alignment: .leading) {
                    Text("Artist")
                        .foregroundColor(.orange)
                    Text("Song title")
                        .fontWeight(.bold)
                }
                Spacer()
                Button {
                    print("button")
                } label: {
                    Image(systemName: "play")
                }
                .frame(width: 60, height: 60)
            }
            .frame(maxWidth: .infinity, maxHeight: 60)
            .background(Color.white)
            .onTapGesture {
                print("ontap")
            }
        }
    }

我的标签视图：

struct TabBar: View {
    var body: some View {
        TabView {
            AudiosTabBarView()
            VideosTabBarView()
            SearchTabBarView()
        }
    }
}

并且在我的 SongsView 中，我使用 EnvironmentObject 来打开 bottomPlayerView

struct SongsView: View {

    @EnvironmentObject var bottomPlayer: BottomPlayer

    var body: some View {
        NavigationView {
            VStack {
                Button {
                    bottomPlayer.show = true
                } label: {
                    Text("Show Player")
                }
            }
            .listStyle(.plain)
            .navigationBarTitle("Audios")
        }
    }
}

问题是 bottomPlayer.show 实际上设置为 true，但没有出现... 我哪里错了？

Answer 1

在您的 BottomPlayer 中，在显示布尔值之前添加 @Published 属性。这将创建这种类型的发布者。 apple documentation

在 SwiftUI 的 TabView 上方显示 BottomPlayerView

Show BottomPlayerView above TabView in SwiftUI

tabbar

swiftui