swiftUI use ScalePageView NavigationBar always showing

[harveyjhuang]

SwiftUI has setting navigationBarHidden(false) , still showing navigationBar if use ScalePageView. ~ Test phone：iPhone Xs Max version：15.6.1

appreciate the development team

` import SwiftUI import CollectionViewPagingLayout

struct SubjectsScreen: View {

@StateObject private var vm = SubjectsViewModel()
private var subjectsOptions: ScaleTransformViewOptions {
    .layout(.easeOut)
}

init() {
    UIScrollView.appearance().keyboardDismissMode = .onDrag
}

var body: some View {
    NavigationView {
        ScrollView {
            VStack(alignment: .leading, spacing: 10) {
                ScalePageView(vm.occSubjectsItem) { subjects in
                    Button {
                        // TODO: open subjects info
                    } label: {
                        ZStack(alignment: .center) {
                            Image("placeholder_subjects5")
                                .resizable()
                                .cornerRadius(8)
                            Text(subjects.name)
                                .fontSystemBold(color: .background, size: 14)
                                .fixedSize(horizontal: false, vertical: true)
                                .multilineTextAlignment(.leading)
                                .padding(.horizontal, 16)
                        }
                    }
                    .buttonStyle(.plain)
                    .frame(width: 150, height: 150)
                }
                .options(subjectsOptions)
                .pagePadding(
                    vertical: .absolute(0),
                    horizontal: .absolute(100)
                )
                .frame(height: 150)
            }
        }
        .navigationBarHidden(false)
    }
    .navigationViewStyle(.stack)
}

} `

[daver234]

Hi, did you solve this? I'm seeing this also now on iOS 15.6.1 and iOS 14.8

[daver234]

I found a solution using: https://github.com/siteline/SwiftUI-Introspect.

On your VStack above, use this: .introspectNavigationController(customize: { NavController in NavController.navigationBar.isHidden = true navBar? = NavController.navigationBar navBar?.isHidden = true })

And add a State variable for the Nav Bar: @State private var navBar: UINavigationBar?

In onAppear, add, navBar?.isHidden = true

And I added it in a onChange modifier to. I think anywhere the view could get redrawn hide the nav bar.

[daver234]

The above approach solve the issue in SwiftUI where the view with a ScalePageView shifts down randomly. I found it is because the Nav Bar is being added, even if you have it turned off in your code above in SwiftUI. Somehow this framework is showing it's own nav bar and so that has to be hidden.

[dharam-cotech]

@harveyjhuang @daver234 I had the quick fix in the fork

[daver234]

Great thanks. Are you maintaining this fork or are you proposing to merge it back to master here?

[amirdew]

@harveyjhuang Hi, I'm just looking at your code and something seems incorrect. In order to hide the navigation bar we should use ".navigationBarHidden(true)" in your code and the description it's ".navigationBarHidden(false)" which means the navigation bar should be hidden but you expect the navigation bar to be hidden.

[daver234]

@amirdew So do you have an alternative fix for this issue?

[amirdew]

I can't reproduce the error, could you share a simple project that shows the bug?

[daver234]

It is part of our bigger app so I can't easily extract to show the bug. A key difference is that I am using SwiftUI TabView and showing and hiding tab view at various points. A key area we have a problem is that we load a web view, full screen, with TabView hidden, then when exist out of the web view, the resulting view has content shifted down and in the debugging the view hierarchy I see a nav bar at the top.

[amirdew]

That seems like a different problem than what is described in the issue. A simple NavigationView doesn't have a problem with hiding the navigation bar:

extension UUID: Identifiable {
    public var id: String {
        uuidString
    }
}

struct ContentView: View {
    let items: [UUID] = [
        .init(),
        .init(),
        .init()
    ]

    var body: some View {
        NavigationView {
            ScalePageView(items) { item in
                Text(item.uuidString)
            }
            .pagePadding(horizontal: .absolute(100))
            .navigationTitle("Title")
            .navigationBarHidden(true)
        }
    }
}

[daver234]

Our use case is more complicated as I am using ScalePageView (for image display) on a view with multiple stacks and at different Z values. Our version should be live within the week then I could send you a video to show you more specifically what I am seeing. Thanks.

[daver234]

An update. I know longer think that nav bar is the issue I am seeing so I don't think there is a bug here. Hiding nav bar removed much of my issue but it came back in a different case. After further debugging, it seems that my complicated view, where content was shifting down randomly was more easily fixed by making the view ignore safe areas such that the view under the tab bar extended to the bottom of the screen. Then on redraws, it would always fit to the bottom of the screen and I just made sure all the content shows above the tab bar.

I am hiding and showing the tab bar and that creates this odd behavior in SwiftUI which doesn't look like it is well tested for this case.

Anyway, if anyone else has the issue, try my approach. Amir thanks for your consideration on this.