Learn Courses My Dashboard

Using NavigationStack Leaves a big gap between content and navigation bar

Hi

I am trying to experiment on using NavigationStack to replace NavigationView
But I could not figure out yet how to remove the big gap

//
//  SampleGenericView.swift
//  GenericViewLayout
//
//  Created by Michael Javier on 10/31/22.
//

import SwiftUI

struct SampleGenericView: View {
    
    @Binding var text: String
    
    var body: some View {
        
        
        NavigationStack {
            //VStack{
                
            ZStack {
                RoundedRectangle(cornerRadius: 8)
                    .fill(Color(red: 239 / 255,
                                green: 239 / 255,
                                blue: 241 / 255))
                    .frame(height: 36)
                HStack(spacing: 6) {
                    Spacer()
                        .frame(width: 0)
                    Image(systemName: "magnifyingglass")
                                            .foregroundColor(.gray)
                    TextField("Search", text: $text)
                    
                    if !text.isEmpty {
                        Button {
                            text.removeAll()
                        } label: {
                            Image(systemName: "xmark.circle.fill")
                                .foregroundColor(.gray)
                        }
                        .padding(.trailing, 6)
                    }
                }
            }.padding(.horizontal)
                
//                List {
//                    Text("Content of Collection 1")
//                    Text("Content of Collection 2")
//                    Text("Content of Collection 3")
//                }
                Text("Hello")
                Spacer()
            //}
            
        }
        .navigationTitle("title")
        .navigationBarTitleDisplayMode(.inline)
        .toolbar {
            Button {
                print("Todo Add Action")
            } label: {
                Image(systemName: "plus")
            }

        }
    }
}

//struct SampleGenericView_Previews: PreviewProvider {
//    static var previews: some View {
//        SampleGenericView()
//    }
//}

I tried other tutorial from google but so far there are gaps also

Hi I will answer my problem
Just incase other find them self on same issue

It turnout that the parent view that calling the view I posted above which is using NavigationStack is still using NavigationView

changing it from NavigationView to NavigationStack also

upon running, can now get rid of the huge gap