SwiftUI修改TabView分页指示器的颜色
SwiftUI修改TabView分页指示器的颜色

SwiftUI修改TabView分页指示器的颜色

在SwiftUI中,TabView分页指示器的颜色默认为白色圆点。

因为默认白色,就导致在白色的背景中,无法查看到TabView分页指示器。

在深色模式下,是可以看到TabView分页指示器的。

因此,需要修改浅色模式下TabView分页指示器颜色。

@Environment(\.colorScheme) var colorScheme

TabView(selection: $selectedTab) {
    Image("0")
        .resizable()
        .scaledToFit()
        .frame(height: 380)
        .shadow(radius: 10,x: 0,y: 10)
        .tag(0) // 给每个选项卡一个标记
    
    Image("1")
        .resizable()
        .scaledToFit()
        .frame(height: 380)
        .shadow(radius: 10,x: 0,y: 10)
        .tag(1) // 给每个选项卡一个标记
}
.tabViewStyle(PageTabViewStyle(indexDisplayMode: .always))
.onAppear {
    if colorScheme == .light {
        UIPageControl.appearance().currentPageIndicatorTintColor = .black // 当前页指示器为黑色
        UIPageControl.appearance().pageIndicatorTintColor = UIColor.black.withAlphaComponent(0.3) // 其他页指示器半透明黑色
    }
}

使用onAppear代码,可以在初始化视图时,浅色模式下设置指示器为半透明黑色,而深色模式下则仍然显示默认的白色。

如果您认为这篇文章给您带来了帮助,您可以在此通过支付宝或者微信打赏网站开放者。

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注