我有一个 PageTabViewStyle 用于显示图像。但是我想使用自定义进度条而不是点指示器,并且我想在用户滑动图像时增加我的自定义进度条。假设我有 5 张图片,如果用户幻灯片图像应该增加 1 / 5 。
如图所示,我创建了自定义的自定义 tabBar 和其他逻辑。但我找不到如何知道用户何时滑动图像的方法,或者有没有办法知道 PageTabViewStyle 的索引号。
struct ProductDetailInfo : View {
var productDetailData : ProductDetailData
@EnvironmentObject var productDetailViewModel : ProductDetailViewModel
var body: some View {
TabView{
if productDetailData.imageList == nil {
WebImage(url : URL(string:productDetailData.image?.big ?? ""))
.resizable()
.aspectRatio(CGFloat(productDetailData.imageRatio ?? 1),contentMode: .fit)
} else {
ForEach(productDetailData.imageList ?? [] , id:\.id) { data in
ZStack{
Button(action: {
withAnimation(.easeInOut) {
productDetailViewModel.selectedImages = productDetailData.imageList ?? []
productDetailViewModel.selectedImageId = productDetailData.id ?? ""
}
},label : {
if productDetailData.imageRatio ?? 1 > 1 {
ProductDetailImageCell(productDetailImageList: data, imageRatio: 1)
} else if productDetailData.imageRatio ?? 0.6 < 1 {
if productDetailData.imageRatio ?? 0.6 < 0.6 {
ProductDetailImageCell(productDetailImageList: data, imageRatio: 0.6)
} else {
ProductDetailImageCell(productDetailImageList: data, imageRatio: productDetailData.imageRatio ?? 1)
}
}
}).buttonStyle(PlainButtonStyle())
}.offset(x: 0, y: UIScreen.main.bounds.height * -(0.10))
}
}
}.tabViewStyle(PageTabViewStyle(indexDisplayMode: .automatic))
.onAppear {
DispatchQueue.main.async {
productDetailViewModel.percent = 0
productDetailViewModel.percent += CGFloat((productDetailData.imageList ?? []).count)
}
}
这是我的自定义进度条;
结构进度条视图:查看 {
@EnvironmentObject var productDetail : ProductDetailViewModel
var body: some View {
ZStack(alignment:.leading) {
ZStack{
Capsule()
.fill(Color.black)
.frame(width:self.callPercent(),height:6)
}
Capsule()
.fill(Color.gray.opacity(0.5))
.frame(width: 80, height: 6)
}
.padding(.top)
.padding(.bottom,5)
}
func callPercent() -> CGFloat {
let width = 80 / productDetail.percent
print("width is : \(width)")
return width
}
}