iOS SwiftUI：使用 ScrollView 和 ZStack 正確堆疊 NavigationView？

Question

所以我一直在玩 SwiftUI 並且我似乎無法使用ScrollView和ZStack正確堆疊NavigationView 。

我正在嘗試使用.black背景實現視圖。 代碼如下：

主視圖.swift

var body: some View {
    NavigationView {
        ChildView()
    }
}

子視圖.swift

var body: some View {
    ZStack {
        Color.black.edgesIgnoringSafeArea(.all)
        ScrollView {
            ...
        }
    }
} 

上面的代碼給了我一個黑色背景，但破壞了導航欄的行為。

它的外觀：

它應該是什么樣子：

因此，滾動時導航似乎不會從scrollEdgeAppearance轉到standardAppearance 。

有任何想法嗎？

Answer 1

ScrollView盡量放上去，不然header動畫就不行了。 以下代碼執行您想要的操作：

struct ChildView: View {
    var body: some View {
        ScrollView {
            VStack(spacing: 20) {
                ForEach(0..<40) { _ in
                    Text("Hello, World!")
                        .frame(maxWidth: .infinity)
                }
            }
            .background(Color.green.edgesIgnoringSafeArea(.all))
        }
        .navigationBarTitle("Discover")
    }
}

struct ContentView: View {
    var body: some View {
        NavigationView {
            ChildView()
        }
    }
}

要實現完全黑色的背景，即使向上滾動底部，也必須在UINavigationController擺弄。 在那里，我還更改了導航欄顏色以實現您的外觀和感覺。 請注意，這不會跟蹤用戶是否啟用了暗模式。

extension UINavigationController {
    override open func viewDidLoad() {
        super.viewDidLoad()

        overrideUserInterfaceStyle = .dark

        let appearance = UINavigationBarAppearance()
        appearance.backgroundColor = UIColor.black
        appearance.titleTextAttributes = [.foregroundColor: UIColor.white]
        appearance.largeTitleTextAttributes = [.foregroundColor: UIColor.white]
        
        navigationBar.standardAppearance = appearance
        navigationBar.compactAppearance = appearance
        navigationBar.scrollEdgeAppearance = appearance
    }
}