swiftUI navigationTitle,navigationBarTitle,navigationBarItems基本使用及效果展示

基本代码

import SwiftUI

struct ContentView: View {
    var body: some View {
        NavigationView{
            NavigationLink(destination:PageOneView()) {
                Text("Hello, world!")
                    .padding()
            }
        }
    }
}

跳转目标页

import SwiftUI

struct PageOneView: View {
    var body: some View {
        VStack{
            RoundedRectangle(cornerRadius: 8)
                .fill(Color.orange)
                .frame(width:UIScreen.main.bounds.width - 20, height:45)
            Spacer()
        }
//        .navigationTitle("Page One")
//        .navigationBarTitle(Text("Page"), displayMode: .inline)
//        .navigationBarItems(trailing: Button(action: {
//            print("hello  swift")
//        }) {
//            Text("按钮")
//        })
    }
}

下面是navigationTitle,navigationBarTitle,navigationBarItems使用的效果说明和效果图

1，不对顶部做任何设置
效果：页面内容上方会留出一段空白区域
2，对顶部设置navigationTitle
效果：空白区域内容被 navigationTitle 文本内容填充
3，对顶部设置navigationBarTitle
效果：空白区域消失，navigationBarTitle文本内容出现在最顶部（位置可参数调整）
4，对顶部设置navigationBarItems
效果：空白区域依然存在，navigationBarItems可同时设置多个，示例仅设置 一个
5，对顶部同时设置navigationBarTitle和navigationBarItems（或navigationTitle和navigationBarItems）
效果：各自展示在各自位置，没有冲突
6，对顶部同时设置navigationTitle,navigationBarTitle,navigationBarItems
效果：navigationTitle内容不填充空白区域，而是覆盖原navigationBarTitle内容展示位置，空白区域消失