使用GeometryReader、ScrollView和Image实现图片缩放功能
代码:
import SwiftUI
struct MPAlbumDetailView: View {
@Environment(\.presentationMode) var presentationMode: Binding<PresentationMode>
@State var imageScale: CGFloat = 1
var model : MPAlbumModel?
var magGesture: some Gesture {
MagnificationGesture().onChanged({ value in
let newValue = self.imageScale + (value - 1)*0.1
if newValue < 1 {
self.imageScale = 1
} else if newValue > 5 {
self.imageScale = 5
} else {
self.imageScale = newValue
}
})
}
var tapGesture: some Gesture {
TapGesture(count:2).onEnded { ges in
print(ges)
if imageScale == 2 {
imageScale = 1
} else {
imageScale = 2
}
}
}
var body: some View {
GeometryReader { geo in
ScrollView([.horizontal, .vertical], showsIndicators: true) {
Image(model?.name ?? "")
.resizable()
.scaledToFit()
.frame(width:geo.size.width * imageScale)
.clipped()
}
.edgesIgnoringSafeArea(.bottom)
.gesture(magGesture)
.gesture(tapGesture)
}
.navigationTitle("\(model?.name ?? "")")
.navigationBarBackButtonHidden()
.toolbar {
ToolbarItem(placement: .navigationBarLeading) {
Button {
presentationMode.wrappedValue.dismiss()
} label: {
Image(systemName: "chevron.backward")
.foregroundColor(Color.black)
}
}
}
}
}
struct MPAlbumDetailView_Previews: PreviewProvider {
static var previews: some View {
MPAlbumDetailView()
}
}
示意图:
双击缩放(推荐)
捏动手势缩放(ScollView的弹动动画会影响到手势的流畅性)