Theodor Ungureanu
Theodor Ungureanu

Reputation: 293

Tabview index not working on white background

I am trying to play a little with the iOS14 feature named TabView.

I am trying to create a carousel aspect. Everything is ok except that the index indicator is not showing(those 3 dots from the image). On a background different than white the dots are present but if the background is white the dots are not displayed. I was expecting to see them on some sort of grey color.

Do you know what is the source of this? I am trying to find an alternative without using ".indexViewStyle(PageIndexViewStyle(backgroundDisplayMode: .always))" because it will add a weird color background to the dots.

import SwiftUI

struct ContentView: View {
    var body: some View {
      SwiftUI.TabView {
                Text("test1")
                Text("test2")
                Text("test3")
                Text("test4")
            }
            .frame(width: UIScreen.main.bounds.width, height: 100)
            .tabViewStyle(PageTabViewStyle(indexDisplayMode: .automatic))
    }
}

This is how it looks on red background(on white there is nothing):

enter image description here

Upvotes: 14

Views: 1549

Answers (1)

Jamie
Jamie

Reputation: 349

Unfortunately it doesn't currently appear possible in SwiftUI as of iOS 15 beta 5.

However, you can reach down into UIKit and modify appearance like this:

TabView {
    Text("Page 1")
    Text("Page 2")
    Text("Page 3")
}
.onAppear() {
    UIPageControl.appearance().currentPageIndicatorTintColor = .black
    UIPageControl.appearance().pageIndicatorTintColor = .gray
}

Upvotes: 16

Related Questions