I'm using TabView with page style to show a list of Images:
Reader.swift
...
TabView(selection: self.$archivePageModel.currentIndex) {
ForEach(pageOrder(totalPage: archivePageModel.pages.count), id: \.self) { index in
PageImage(id: archivePageModel.pages[index], geometrySize: geometry.size).tag(index)
}
}
...
PageImage.swift
...
Image(uiImage: UIImage(contentsOfFile: imageUrl)!)
.resizable()
.aspectRatio(contentMode: .fit)
...
Sometimes, the page image could be a single width image, thus I want to give user the option to "fit height" of the image, so I tried to use .aspectRatio(contentMode: .fill)
to fill the whole page with image. I then added more modifier to PageImage so the filled image could show from start and user could drag the image
PageImage.swift - updated
...
let uiImage = UIImage(contentsOfFile: imageUrl)!
let imageWidth = uiImage.size.width / uiImage.size.height * geometrySize.height
Image(uiImage: UIImage(contentsOfFile: imageUrl)!)
.resizable()
.aspectRatio(contentMode: .fill)
.frame(width: geometrySize.width, alignment: .leading)
.draggableAndZoomable(contentSize: CGSize(width: imageWidth, height: geometrySize.height), viewWidth: geometrySize.width)
...
DraggableAndZoomableView.swift
...
@GestureState private var offsetState = CGSize.zero
@State private var offset = CGSize.zero
content
.offset(x: ...compute x axis..., y: ...compute y axis...)
.gesture(dragGesture)
var dragGesture: some Gesture {
DragGesture()
...logic of drag image...
}
...
It all works. However, my custom dragGesture
here overrides the normal TabView
drag gesture to change pages.
Is there a way to keep my custom dragGesture
while at the same time, trigger the TabView
drag gesture to switch page if user dragged to the edge of the image?
Thanks.