CODEWITHSUNDEEP
swiftswiftui
Seungjun
Seungjun

Reputation: 984

In swiftUI, How to remove ONLY safe area of NavigationBarTitle?

enter image description hereMy Objective is embedding navigationBaritems(for buttons) at the same line with nabigationBarTitle(for title). But navigationBarTitle goes underline of the navigationBarItems.

So Instead of using navigationBarTitle, I modified code like this: navigationBarItems(leading: Text("Title"), trailing: Button(action: {}) {Text("Button1")})

Now title and button are aligned at the same line, but the problem is a safe area of NavigationBarTitle.

Things I have tried: I tried to remove it by using navigationBarHidden(true) But it removes all of navigationBarItems and esgesIgnoringSafeArea removes the safearea of navigationBarItems also. And also considered using displaymode: .inline but it doesn't look good.

How can I remove only the safearea of navigationBarTitle here?

My current code:

struct ContentView: View {
    var body: some View {



        NavigationView{
            VStack{

                HStack{
                Text("dd")
                    }.frame(width: 500, height: 300)
                    .background(Color.blue)
                Spacer()

            }
            .navigationBarItems(leading: Text("Title"), trailing: Button(action: {
                //some action
            })
            {
                Text("Button")
            })
        }
    }
}

Upvotes: 1

Views: 1218

Answers (2)

electromaggot
electromaggot

Reputation: 675

Sometimes I think SwiftUI can be non-intuitive, but here are some suggestions:

Try putting the following line after your .background(Color.blue) line:

.navigationBarTitle("", displayMode: .inline)

Change the title to a non-empty string to see what .inline is doing. Try taking the , displayMode: .inline out too. That big title is what's trying to fill all the empty space you're seeing atop your VStack. You can also experiment with .navigationBarHidden(true) if you want a custom nav bar (although you probably don't want that, but still interesting to try).

Edit: I know you said you tried some of those things. The key is where you put that line I list above. It needs to modify an element inside the VStack (like your HStack or Spacer), so like I said, put that line below the one where you set the HStack's background color to blue. It's trying to put an empty title above your HStack, which is what you're not wanting.

Upvotes: 4

workingdog support Ukraine
workingdog support Ukraine

Reputation: 36304

you could try something like this:

struct ContentView: View {
var body: some View {
    NavigationView {
        VStack {
            HStack {
                Text("dd")
            }
            .frame(width: 500, height: 300)
            .background(Color.blue)
            Spacer()
        }.padding(.top, 88)  // <--- adjust to your needs
            .navigationBarItems(leading: Text("Title"), trailing: Button(action: {
                //some action
            })
            {
                Text("Button")
            }).edgesIgnoringSafeArea(.top)   // <--- add this

    }
}
}

Upvotes: 1

Related Questions