ios – swift ui Picture doesn’t drag accurately when zoomed in


Howdy In my app I give the customers the choice to press on pictures to indicate them full display screen. When the picture is displayed in full display screen customers can zoom in on it and may have the ability to drag it round to see different parts of the picture. At the moment when the picture is zoomed in and I attempt to drag it to any facet it re facilities and does not drag properly. Additionally I can solely zoom into the middle. How can I modify this code in order that the drag gesture to any facet when zoomed in is easy and a zoom gesture could be achieved on the perimeters of the picture not simply the middle. Id recognize the assistance. The KFImage is an easy bundle that renders pictures from a url, you possibly can rapidly add it to Xcode with this url: https://github.com/onevcat/Kingfisher.git

import SwiftUI
import Kingfisher
import UIKit

struct ContentView: View {
    @State non-public var myPhoto = "https://firebasestorage.googleapis.com:443/v0/b/hustle-85b6c.appspot.com/o/messagespercent2F7AC5914A-6239-41CF-85EF-E1C0F25C0A84?alt=media&token=8720789b-7cdd-410c-9532-143a2bcf3f3b"
    @State non-public var currentScale: CGFloat = 1.0
    @State non-public var previousScale: CGFloat = 1.0
    @State non-public var currentOffset = CGSize.zero
    @State non-public var previousOffset = CGSize.zero
    @State var imageHeight: Double = 0.0
    @State var imageWidth: Double = 0.0
    
    var physique: some View {
        ZStack {
            Rectangle().foregroundColor(.black)
            GeometryReader { geometry in
                KFImage(URL(string: myPhoto))
                    .resizable()
                    .aspectRatio(contentMode: .match)
                    .scaleEffect(max(self.currentScale, 1.0))
                    .offset(x: self.currentOffset.width + (widthOrHeight(width: true) - imageWidth) / 2.0, y: self.currentOffset.top + (widthOrHeight(width: false) - imageHeight) / 2.0)
                    .background ( /// this background is to middle the picture (picture loaded async so have to attend for it to load after which get top)
                        GeometryReader { proxy in
                            Coloration.clear
                                .onChange(of: proxy.dimension.top) { _ in
                                    imageHeight = proxy.dimension.top
                                    imageWidth = proxy.dimension.width
                                }
                            
                        }
                    )
                    .gesture(
                        SimultaneousGesture(
                            DragGesture()
                                .onChanged { worth in
                                    let deltaX = worth.translation.width - self.previousOffset.width
                                    let deltaY = worth.translation.top - self.previousOffset.top
                                    previousOffset.width = worth.translation.width
                                    previousOffset.top = worth.translation.top
                                    let newOffsetWidth = self.currentOffset.width + deltaX / self.currentScale
                                    let newOffsetHeight = self.currentOffset.top + deltaY / self.currentScale
                                    withAnimation(.linear(length: 0.25)){
                                        if abs(newOffsetWidth) <= geometry.dimension.width - 200.0 && abs(newOffsetWidth) >= -200.0 {
                                            self.currentOffset.width = newOffsetWidth
                                        }
                                        if abs(newOffsetHeight) < 450 {
                                            self.currentOffset.top = newOffsetHeight
                                        }
                                    }
                                }
                                .onEnded { _ in
                                    withAnimation(.easeInOut){
                                        if currentScale < 1.2 {
                                            self.previousOffset = CGSize.zero
                                            self.currentOffset = CGSize.zero
                                        }
                                    }
                                },
                            MagnificationGesture().onChanged { worth in
                                let delta = worth / self.previousScale
                                let newScale = self.currentScale * delta
                                withAnimation {
                                    if newScale <= 3.5 {
                                        self.previousScale = worth
                                        self.currentScale = newScale
                                    }
                                    if newScale < 1.3 {
                                        self.previousScale = 1.0
                                        self.currentScale = 1.0
                                        self.previousOffset = CGSize.zero
                                        self.currentOffset = CGSize.zero
                                    }
                                }
                            }
                        )
                    )
            }
        }.ignoresSafeArea()
    }
}

Related Articles

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Latest Articles