如何在 SwiftUI 中使用 PageTabViewStyle 消除 TabView 上的索引点?

ali*_*ego 25 ios swiftui swiftui-tabview pagetabviewstyle

我有以下代码,但似乎无法删除 TabView 底部的点。

struct ContentView: View {
    @Environment(\.managedObjectContext) private var viewContext
    
    @State var users = ["Janice", "Emily", "Candice", "London", "Julia"]

    var body: some View {
        TabView {
            ForEach(users, id: \.self) { user  in
                UserCard(user: user)
            }
        }
        .tabViewStyle(PageTabViewStyle())
        .indexViewStyle(PageIndexViewStyle(backgroundDisplayMode: .never))
        .background(Color(.systemGroupedBackground))
    }
}

struct UserCard: View {
    
    let user: String
    
    var body: some View {
        Color.white
            .padding(30)
    }
}
Run Code Online (Sandbox Code Playgroud)

我本以为 PageIndexViewStyle(backgroundDisplayMode: .never) 会删除索引点,但这不起作用。还有其他方法可以摆脱它们吗?

wor*_*dog 38

尝试这个:

struct ContentView: View {
    @Environment(\.managedObjectContext) private var viewContext
    @State var users = ["Janice", "Emily", "Candice", "London", "Julia"]

    var body: some View {
        TabView {
            ForEach(users, id: \.self) { user  in
                UserCard(user: user)
            }
        }
        .tabViewStyle(.page(indexDisplayMode: .never))  // <--- here
        .background(Color(.systemGroupedBackground))
    }
}

struct UserCard: View {
    let user: String
    var body: some View {
        Text(user)
    }
}
Run Code Online (Sandbox Code Playgroud)

  • 谢谢。实际上必须使用 .tabViewStyle(PageTabViewStyle(indexDisplayMode: .never)) 对于较旧的 swiftui 版本,但效果很好。谢谢。 (5认同)

小智 9

你必须添加这个:

.tabViewStyle(.page(indexDisplayMode: .never))
.indexViewStyle(PageIndexViewStyle(backgroundDisplayMode: .never))

Run Code Online (Sandbox Code Playgroud)