在1.0時(shí)還需要借助第三方UIkit庫實(shí)現(xiàn)蓝晒，現(xiàn)在已經(jīng)不用了
TabView，不僅可以用作地步導(dǎo)航欄切換頁面，同時(shí)也可以實(shí)現(xiàn)頂部tab頁面切換
使用官方的方式可以實(shí)現(xiàn)圖標(biāo)與文字的tabbar执桌，頂部tabbar就要自己配合實(shí)現(xiàn)了
TabView(selection: $selectTab){
OrderChildView(order:orderData,type:"")
.tag("全部")
OrderChildView(order:orderData,type:"common")
.tag("普通掃碼")
OrderChildView(order:orderData,type:"coupon")
.tag("優(yōu)惠券")
OrderChildView(order:orderData,type:"easily")
.tag("順手購")
OrderChildView(order:orderData,type:"integral")
.tag("積分兌換")
}
.tabViewStyle(.page(indexDisplayMode: .never))
.tabViewStyle(.page(indexDisplayMode: .never)) 這一句是關(guān)鍵代碼，是我們要實(shí)現(xiàn)必須寫的
這時(shí)芜赌，需要使用VStack在tabView上面加上一個(gè)橫向滾動(dòng)的tabbar
private let tabList = ["全部","普通掃碼","優(yōu)惠券","順手購","積分兌換"]//這里可以自定義仰挣，我這邊需求是這樣的
VStack{
ScrollViewReader { tabRead in
ScrollView(.horizontal,showsIndicators: false){
HStack{
ForEach(tabList,id:\.self){ item in
Spacer()
Text(item)
.font(.system(size:15))
.padding(15)
.foregroundColor(selection == item ? Color.init(red: 1, green: 0.76, blue: 0.16) : .white)
.onTapGesture {
print(item)
withAnimation (.easeInOut){
selection = item
}
}
.id(item)//這里必須添加id，為了跟隨頁面滾動(dòng)tabbar缠沈，當(dāng)然如果需求不需要膘壶，可以不加
Spacer()
}
}
}
.onChange(of: selection) { newValue in
tabRead.scrollTo(newValue as String?)
}
}
TabView(selection: $selection){
OrderChildView(order:orderData,type:"")
.tag("全部")
OrderChildView(order:orderData,type:"common")
.tag("普通掃碼")
OrderChildView(order:orderData,type:"coupon")
.tag("優(yōu)惠券")
OrderChildView(order:orderData,type:"easily")
.tag("順手購")
OrderChildView(order:orderData,type:"integral")
.tag("積分兌換")
}
.tabViewStyle(.page(indexDisplayMode: .never))
}
ScrollViewReader 配合ScrollView可實(shí)現(xiàn)，讓視圖滾動(dòng)到你想要的位置洲愤，關(guān)鍵代碼 tabRead.scrollTo(newValue as String?)
這樣就可以輕松實(shí)現(xiàn)我們需要的樣子了
IMG_0042.PNG
