I've got multiple pages / views in my app (using Swift UI). But after I have navigated to my third view using navigation links the back button is coming further and further down the screen vertically. I am essentially losing space to work with in my views with every link I use. What is the solution to this?
Navigation View Problems
Maybe you are using NavigationView in a wrong way. Can you show all the codes of your views, from the root to the third view?
PAGE 1
import SwiftUI
struct LandingView: View {
@State private var isActive = false
var body: some View {
NavigationView{
VStack{
Text("FiTED")
.frame(width: 400, height: 120, alignment: .topLeading)
.font(.system(size: 100, weight: .medium))
.foregroundColor(.niceblueColor)
Text("Improve your health and fitness, while learning")
.frame(width: 400, height: 60, alignment: .topLeading)
.font(.system(size: 25))
.foregroundColor(.black)
Spacer().frame(height: 500)
NavigationLink(destination:
MainView(), isActive: $isActive){
Button(action: {
isActive = true
}){
HStack{
Text("Let's Go!")
Image(systemName: "arrow.right.circle.fill")
}
.font(.system(size: 24, weight: .semibold))
.foregroundColor(.white)
}
.buttonStyle(PrimaryButtonStyle())
}
}
}
}
}
import SwiftUI
struct LandingView: View {
@State private var isActive = false
var body: some View {
NavigationView{
VStack{
Text("FiTED")
.frame(width: 400, height: 120, alignment: .topLeading)
.font(.system(size: 100, weight: .medium))
.foregroundColor(.niceblueColor)
Text("Improve your health and fitness, while learning")
.frame(width: 400, height: 60, alignment: .topLeading)
.font(.system(size: 25))
.foregroundColor(.black)
Spacer().frame(height: 500)
NavigationLink(destination:
MainView(), isActive: $isActive){
Button(action: {
isActive = true
}){
HStack{
Text("Let's Go!")
Image(systemName: "arrow.right.circle.fill")
}
.font(.system(size: 24, weight: .semibold))
.foregroundColor(.white)
}
.buttonStyle(PrimaryButtonStyle())
}
}
}
}
}
PAGE 2
import SwiftUI
struct MainView: View {
@State private var isActive = false
var body: some View {
NavigationView{
VStack{
//Your Plan Button
NavigationLink(destination:
Text("YES"), isActive: $isActive){
Button(action: {
isActive = true
}){
VStack{
Image(systemName: "book.fill")
Text("Your Plan")
}
.font(.system(size: 30, weight: .semibold))
.foregroundColor(.niceblueColor)
.padding(.bottom, 40)
}
}
//TrainingSplit Button
NavigationLink(destination:
TrainingSplitView(), isActive: $isActive){
Button(action: {
isActive = true
}){
VStack{
Image(systemName: "flame.fill")
Text("Training Splits")
}
.font(.system(size: 30, weight: .semibold))
.foregroundColor(.niceblueColor)
.padding(.bottom, 40)
}
}
//Education Button
NavigationLink(destination:
Text("YES"), isActive: $isActive){
Button(action: {
isActive = true
}){
VStack{
Image(systemName: "textformat.123")
Text("Education")
}
.font(.system(size: 30, weight: .semibold))
.foregroundColor(.niceblueColor)
.padding(.bottom, 40)
}
}
//Nutrition Button
NavigationLink(destination:
Text("YES"), isActive: $isActive){
Button(action: {
isActive = true
}){
VStack{
Image(systemName: "chart.pie.fill")
Text("Nutrition")
}
.font(.system(size: 30, weight: .semibold))
.foregroundColor(.niceblueColor)
.padding(.bottom, 40)
}
}
//Your Coach Button
NavigationLink(destination:
Text("YES"), isActive: $isActive){
Button(action: {
isActive = true
}){
VStack{
Image(systemName: "person.fill")
Text("Your Coach")
}
.font(.system(size: 30, weight: .semibold))
.foregroundColor(.niceblueColor)
.padding(.bottom, 40)
}
}
Spacer().frame(height:100)
}
}
.navigationBarBackButtonHidden(true)
}
}
import SwiftUI
struct MainView: View {
@State private var isActive = false
var body: some View {
NavigationView{
VStack{
//Your Plan Button
NavigationLink(destination:
Text("YES"), isActive: $isActive){
Button(action: {
isActive = true
}){
VStack{
Image(systemName: "book.fill")
Text("Your Plan")
}
.font(.system(size: 30, weight: .semibold))
.foregroundColor(.niceblueColor)
.padding(.bottom, 40)
}
}
//TrainingSplit Button
NavigationLink(destination:
TrainingSplitView(), isActive: $isActive){
Button(action: {
isActive = true
}){
VStack{
Image(systemName: "flame.fill")
Text("Training Splits")
}
.font(.system(size: 30, weight: .semibold))
.foregroundColor(.niceblueColor)
.padding(.bottom, 40)
}
}
//Education Button
NavigationLink(destination:
Text("YES"), isActive: $isActive){
Button(action: {
isActive = true
}){
VStack{
Image(systemName: "textformat.123")
Text("Education")
}
.font(.system(size: 30, weight: .semibold))
.foregroundColor(.niceblueColor)
.padding(.bottom, 40)
}
}
//Nutrition Button
NavigationLink(destination:
Text("YES"), isActive: $isActive){
Button(action: {
isActive = true
}){
VStack{
Image(systemName: "chart.pie.fill")
Text("Nutrition")
}
.font(.system(size: 30, weight: .semibold))
.foregroundColor(.niceblueColor)
.padding(.bottom, 40)
}
}
//Your Coach Button
NavigationLink(destination:
Text("YES"), isActive: $isActive){
Button(action: {
isActive = true
}){
VStack{
Image(systemName: "person.fill")
Text("Your Coach")
}
.font(.system(size: 30, weight: .semibold))
.foregroundColor(.niceblueColor)
.padding(.bottom, 40)
}
}
Spacer().frame(height:100)
}
}
.navigationBarBackButtonHidden(true)
}
}
PAGE 3
import SwiftUI
struct TrainingSplitView: View{
var body: some View{
NavigationView{
VStack{
Text("YES")
}
}
}
}
import SwiftUI
struct TrainingSplitView: View{
var body: some View{
NavigationView{
VStack{
Text("YES")
}
}
}
}
Thanks for showing your code, but please use the Code block feature (see icon <>) of this site.
NavigationView{...} is only needed in the root view. Remove it from the second and third view.
NavigationView{...} is only needed in the root view. Remove it from the second and third view.
That happens because your are stacking many navigation bars using nested NavigationView.the back button is coming further and further down the screen vertically.
Sorry first time using forums, thank you so much. You've saved me a lot of hassle :)
I am also getting this in the console?
SwiftUI encountered an issue when pushing aNavigationLink. Please file a bug.
2021-03-04 16:04:02.992353+0000 FiTED1[9178:552144] [Assert] displayModeButtonItem is internally managed and not exposed for DoubleColumn style. Returning an empty, disconnected UIBarButtonItem to fulfill the non-null contract.
SwiftUI encountered an issue when pushing aNavigationLink. Please file a bug.
2021-03-04 16:04:02.992353+0000 FiTED1[9178:552144] [Assert] displayModeButtonItem is internally managed and not exposed for DoubleColumn style. Returning an empty, disconnected UIBarButtonItem to fulfill the non-null contract.
Seems to be a different issue than the problem in your opening post of this thread.SwiftUI encountered an issue when pushing aNavigationLink. Please file a bug.
Better start a new thread for the new issue, please keep one thread one topic.
But as the error message is suggesting, it may be caused by some bugs of the current implementation of SwiftUI.
If you find some weird behavior which might be related to the message, you may need to find some workarounds until Apple fix it.