How to change TabView dot indicator position SwiftUI

user_9923824 0
Viewed 950

i want to change TabView dot indicator position is there a way to do that ? .

   TabView {
            
            ForEach(data.options ?? [],id:\.id) { item in
                
                NavigationLink(destination: ViewParser.create(item: item,index: item.typeArry ?? [])) {
                    
                    AnimatedImage(url: URL(string : item.image ?? ""))
                        .resizable()
                        .frame(width:CGFloat(getWidth(column: data.column ?? 1)))
                        .cornerRadius(6)
                }
                
                
            }.frame(width:UIScreen.main.bounds.width,height:CGFloat(getHeight(ratio: data.ratio ?? 1, column: data.column ?? 1)))
            
            
        }.tabViewStyle(PageTabViewStyle(indexDisplayMode: .automatic))

enter image description here

swiftui swift
1 Answers

You have to adjust the height of the tab view. That in turn changes the position of the paging indicator.

Example:

TabView {
        Rectangle()
            .frame(width: 200, height: 200)
            .foregroundColor(.red)
        
        Rectangle()
            .frame(width: 200, height: 200)
            .foregroundColor(.green)
    }
    .frame(width: 200, height: 200)
    .tabViewStyle(.page(indexDisplayMode: .always))

This example will position the indicator inside the view like so:

enter image description here

user_23553910
Related