I’ve a TabView
that comprises a customized PageView
which is merely a ScrollView
and that ScrollView
comprises a number of some View
objects. Your entire factor is wrapped in a NavigationStack
, and for each web page, there’s a new view added to my TabView
.
NavigationStack {
TabView(choice: $selectedPageIndex) {
ForEach(appConfig.pages.indices, id: .self) { index in
let web page = appConfig.pages[index]
PageView(topPadding: $navBarHeight,
bottomPadding: $tabBarHeight,
web page: web page)
.toolbar(.hidden, for: .tabBar)
.tag(index)
}
}
.overlay {
VStack {
navBar
.getHeight(peak: $navBarHeight)
Spacer()
TabBar(selectedPageIndex: $selectedPageIndex)
.getHeight(peak: $tabBarHeight)
}
}
I’ve this bizarre habits, the place if I alter the selectedPageIndex
just a few occasions, the .toolbar
reappears. This occurs on the canvas, simulator, or actual machine. As pictured right here.
The second drawback I am working into is that I want this TabView
to be “Fullscreen” as I am utilizing it to host my pages, and in impact making a customized NavigationBar
and TabBar
with it is personal gadgets. Every time I try so as to add .ignoresSafeArea()
together with .tabViewStyle(.web page(indexDisplayMode: .by no means))
altering the selectedPageIndex
“Typically” works, however principally simply would not do something.
.ignoresSafeArea()
.tabViewStyle(.web page(indexDisplayMode: .by no means))
.overlay {
As a substitute now, the underlying view, is clipped in an surprising method, moderately than extending the complete peak of the view. It is also current within the canvas, simulator, and actual machine.
Oddly, at any time when I load it for the primary time, every little thing renders as you’d count on, the underside is just not clipped. I can use drag gestures to swap the tab, and even choose the brand new tab with the TabBar, nevertheless instantly, the view jumps up and begins clipping, as if the body modified on it is personal. As a way to repair it, I need to reset the view.