Limit DragGesture inside frame swiftUI?

Viewed 54

I want the image to be only drag on the top of other image if the user drag the image outside the image frame so it must not work . like below image but for rectangular image
Drag Image over image

struct ContentView: View {
    @State var audioPlayer: AVAudioPlayer!
    let image1 = UIImage(named: "image")
    let image2 = UIImage(named: "02")
    @State private var currentAmount = 0.0
    @State private var finalAmount = 1.0
    @State private var point : CGPoint = CGPoint.zero
    var body: some View {
        VStack{
            ZStack{
                Image("image")
                    .resizable()
                    .frame(width: UIScreen.main.bounds.width-5, height: UIScreen.main.bounds.height*0.6, alignment: .center)
                SwiftUIGIFPlayerView(gifName:"gif")
                    .frame(width: 200,height: 300,alignment: .center)
                    .position(point)
                    .scaleEffect(finalAmount+currentAmount)
                    .frame(width: UIScreen.main.bounds.width-5, height: UIScreen.main.bounds.height*0.6, alignment: .center)
                    .clipped()
                    .gesture(
                        MagnificationGesture()
                            .onChanged { amount in
                                currentAmount = amount - 1
                            }
                            .onEnded { amount in
                                finalAmount += currentAmount
                                currentAmount = 0
                            }
                            .simultaneously(with:
                                                DragGesture()
                                                .onChanged {value in
                                                    point = value.location
                                                    print(value)
                                                }
                                                .onEnded { val in
                                                    withAnimation {
                                                        point = val.location
                                                    }
                                                }
                                           )
                    )
            }
        }
        .navigationBarHidden(true)
        .onAppear {
            let sound = Bundle.main.path(forResource: "audio", ofType: "mp3")
            self.audioPlayer = try! AVAudioPlayer(contentsOf: URL(fileURLWithPath: sound!))
            self.audioPlayer.play()
            self.audioPlayer.numberOfLoops = 30
        }
        .onDisappear {
            self.audioPlayer.stop()
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

with the above code i'm able to drag and zoom the image but it goes out of parent image frame .

Updated

I have update the drag gesture code by removing .onEnded{} and put this code in .onChanged get upto 70% accurate result but still have some issue when the top image is zoomed i am putting the new update below:

.onChanged {value in
    if value.location.x < UIScreen.main.bounds.width*0.15*finalAmount/3{
        point.x = UIScreen.main.bounds.width*0.16*finalAmount/3
    }else{
        if value.location.x>UIScreen.main.bounds.width*0.85*3/finalAmount{
            point.x = UIScreen.main.bounds.width*0.85*2/finalAmount
        }else{
            point.x = value.location.x
        }
    }
    if value.location.y < 20*finalAmount/2{
        point.y = 50*finalAmount/2
    }else{
        print(UIScreen.main.bounds.width*0.95)
        if value.location.y>UIScreen.main.bounds.height*0.57*1/finalAmount{
            point.y = UIScreen.main.bounds.height*0.55*1/finalAmount
        }else{
            point.y = value.location.y
        }
    }
}
0 Answers
Related