如何停止推送视图暂时呈现隐藏的导航栏?
How to stop pushed view from temporarily rendering hidden navigationBar?
出乎意料的是,SwiftUI 的推送视图在转换时暂时使用 space 为隐藏的导航栏呈现其内容。片刻之后它重新正确呈现。我该如何防止这种行为?
对于GIF屏幕录制,请点击下图。
ContentView.swift
import SwiftUI
struct ContentView: View {
@State var goToNextView = false
var body: some View {
NavigationView { ZStack {
/*@START_MENU_TOKEN@*/Color.yellow/*@END_MENU_TOKEN@*/.edgesIgnoringSafeArea(.all)
NavigationLink(destination: SecondView(), isActive: $goToNextView) {Text("")}
.navigationBarTitle("")
.navigationBarHidden(true)
.navigationBarBackButtonHidden(true)
VStack {
Button(action: {
print("Button clicked")
self.goToNextView = true
}) { Text("Go to second view") }
.padding()
Text("This is the first view.")
}
}
.foregroundColor(Color.blue)
}
}
}
SecondView.swift
struct SecondView: View {
var body: some View {
ZStack {
Color.purple
.edgesIgnoringSafeArea(.all)
.navigationBarBackButtonHidden(true)
.navigationBarHidden(true)
VStack { Text("Pushed view") }
}
.foregroundColor(Color.white)
}
}
即使您想隐藏导航栏,SwiftUI 也需要设置 NavigationBar Title。在您的第一个视图中,您这样做了。在第二个你没有。
将此添加到您的 SecondView 可解决问题:
.navigationBarTitle("")
和 SecondView 总共:
struct SecondView: View {
var body: some View {
ZStack {
Color.purple
.edgesIgnoringSafeArea(.all)
.navigationBarTitle("")
.navigationBarBackButtonHidden(true)
.navigationBarHidden(true)
VStack { Text("Pushed view") }
}
.foregroundColor(Color.white)
}
}
我通过使用受 影响的视图修改器删除了此行为。
内联评论解释了我所做的更改。
import SwiftUI
struct ContentView: View {
@State var goToNextView = false
var body: some View {
NavigationView { ZStack {
/*@START_MENU_TOKEN@*/Color.yellow/*@END_MENU_TOKEN@*/.edgesIgnoringSafeArea(.all)
NavigationLink(destination: SecondView(), isActive: $goToNextView) {Text("")}
// Removed all nav config code here
VStack {
Button(action: {
print("Button clicked")
self.goToNextView = true
}) { Text("Go to second view") }
.padding()
Text("This is the first view.")
}
}
// Added this to hide bar
.hiddenNavigationBarStyle()
.foregroundColor(Color.blue)
}
}
}
struct SecondView: View {
var body: some View {
ZStack {
Color.purple
.edgesIgnoringSafeArea(.all)
// Added this to hide bar
.hiddenNavigationBarStyle()
VStack { Text("Pushed view") }
}
.foregroundColor(Color.white)
}
}
这是取自先前答案的视图修饰符:
struct HiddenNavigationBar: ViewModifier {
func body(content: Content) -> some View {
content
.navigationBarTitle("", displayMode: .inline)
.navigationBarHidden(true)
}
}
extension View {
func hiddenNavigationBarStyle() -> some View {
ModifiedContent(content: self, modifier: HiddenNavigationBar())
}
}
出乎意料的是,SwiftUI 的推送视图在转换时暂时使用 space 为隐藏的导航栏呈现其内容。片刻之后它重新正确呈现。我该如何防止这种行为?
对于GIF屏幕录制,请点击下图。
ContentView.swift
import SwiftUI
struct ContentView: View {
@State var goToNextView = false
var body: some View {
NavigationView { ZStack {
/*@START_MENU_TOKEN@*/Color.yellow/*@END_MENU_TOKEN@*/.edgesIgnoringSafeArea(.all)
NavigationLink(destination: SecondView(), isActive: $goToNextView) {Text("")}
.navigationBarTitle("")
.navigationBarHidden(true)
.navigationBarBackButtonHidden(true)
VStack {
Button(action: {
print("Button clicked")
self.goToNextView = true
}) { Text("Go to second view") }
.padding()
Text("This is the first view.")
}
}
.foregroundColor(Color.blue)
}
}
}
SecondView.swift
struct SecondView: View {
var body: some View {
ZStack {
Color.purple
.edgesIgnoringSafeArea(.all)
.navigationBarBackButtonHidden(true)
.navigationBarHidden(true)
VStack { Text("Pushed view") }
}
.foregroundColor(Color.white)
}
}
即使您想隐藏导航栏,SwiftUI 也需要设置 NavigationBar Title。在您的第一个视图中,您这样做了。在第二个你没有。
将此添加到您的 SecondView 可解决问题:
.navigationBarTitle("")
和 SecondView 总共:
struct SecondView: View {
var body: some View {
ZStack {
Color.purple
.edgesIgnoringSafeArea(.all)
.navigationBarTitle("")
.navigationBarBackButtonHidden(true)
.navigationBarHidden(true)
VStack { Text("Pushed view") }
}
.foregroundColor(Color.white)
}
}
我通过使用受
内联评论解释了我所做的更改。
import SwiftUI
struct ContentView: View {
@State var goToNextView = false
var body: some View {
NavigationView { ZStack {
/*@START_MENU_TOKEN@*/Color.yellow/*@END_MENU_TOKEN@*/.edgesIgnoringSafeArea(.all)
NavigationLink(destination: SecondView(), isActive: $goToNextView) {Text("")}
// Removed all nav config code here
VStack {
Button(action: {
print("Button clicked")
self.goToNextView = true
}) { Text("Go to second view") }
.padding()
Text("This is the first view.")
}
}
// Added this to hide bar
.hiddenNavigationBarStyle()
.foregroundColor(Color.blue)
}
}
}
struct SecondView: View {
var body: some View {
ZStack {
Color.purple
.edgesIgnoringSafeArea(.all)
// Added this to hide bar
.hiddenNavigationBarStyle()
VStack { Text("Pushed view") }
}
.foregroundColor(Color.white)
}
}
这是取自先前答案的视图修饰符:
struct HiddenNavigationBar: ViewModifier {
func body(content: Content) -> some View {
content
.navigationBarTitle("", displayMode: .inline)
.navigationBarHidden(true)
}
}
extension View {
func hiddenNavigationBarStyle() -> some View {
ModifiedContent(content: self, modifier: HiddenNavigationBar())
}
}