0

I'm having some weird glitches when trying to have a ScrollView as one of my tab-views. This is my sample code:

import SwiftUI

struct ContentView: View {
    
    // hack to set unselected tab item color
    init() {
        UITabBar.appearance().unselectedItemTintColor = UIColor.black
    }
    
    var body: some View {
        
        TabView {
        
            // first tab - just a color
            Color.red.ignoresSafeArea()
                .tabItem {
                    Image(systemName: "star")
                }
            
            // second tab - a ScrollView
            ScrollView {

                // fill the ScrollView with something
                Rectangle()
                    .fill(.white)
                    .frame(height: 1000)

            }
            .background(Color.red)
            .tabItem {
                Image(systemName: "flag")
            }
            
        }
        .tint(.white) // selected tab item = white
        
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

The problem is when I switch between first and second tab, the background of the TabView changes to white when I've selected the ScrollView-tab. Then it won't change back to red when selecting the first tab. But if I select the ScrollView-tab, and scroll all the way down until the TabView-background turns red again, then going back it stays red. Am I doing something wrong in my code? Is it a bug? Any workaround?

Example

irrbloss
  • 207
  • 2
  • 9
  • There is no glitch, and the background has not turned to white. You are seeing the contents of the tabview, not the background. Do yourself a favor, change the background color of the `ScrollView` to something like green, and just before the `.background()` on the `ScrollView` add `.padding()`. Play with it and see what happens. But there is no glitch or "workaround" other than telling it to do what you want to see. – Yrb Jul 09 '23 at 17:38
  • If I use padding there will be no opacity/translucency, just a solid colored tab bar. When selecting the first tab item, which has the ignoresSafeArea()-modifier applied, how comes the second tab view still shows through the tab view-area when switching to the first tab? – irrbloss Jul 09 '23 at 18:33
  • I am not saying to use padding for your final result. I am saying to use padding to see what your code is actually doing and learn from it. The display is a perfectly accurate depiction of your code here. There is no bug. What I am saying is play around and see WHY it is a perfectly accurate depiction of your code. And with regard to the question, it has to do with the fact that the scroll view is taking up the entire screen, and the tab sits over top. – Yrb Jul 10 '23 at 12:58
  • I found a solution here: https://stackoverflow.com/questions/69309689/ios-15-swiftui-tabview-tab-bar-appearance-doesnt-update-between-views – irrbloss Jul 10 '23 at 16:07

0 Answers0