ios jerky animation when applying scaling transformation - ios

Question

I have this icon that I want the user to be able to move around and when it enters a specific area of its parent view, it should scale up in size to indicate that. I retrieve where the user wants to move the icon with a pan gesture recognizer and the command:
let translationPoint = sender.translation(in: view)
Then I try to animate the desired behavior with CGAffineTranformations with the following code:
let moveTransformation = CGAffineTransform(translationX: response.translationPoint.x, y: response.translationPoint.y)
var scaleTransformation: CGAffineTransform = CGAffineTransform(scaleX: 1, y: 1)
if response.shouldScaleUp {
scaleTransformation = CGAffineTransform(scaleX: 1.3, y: 1.3)
}
let transformation = scaleTransformation.concatenating(moveTransformation)
And then I apply the transformation on the icon view. It works quite well except for the fact that it jerks a bit when I enter and exit the area that should trigger this behavior.
I've read online that it's in general a bad idea to be applying two transformations, and I thought that maybe I should just update the actual frame of the view itself, but animating transformation changes makes it easier to reset the position when the user lets go (I've also heard it's meant to be lighter to do).
You guys and girls have any suggestions? Thanks for your help
UPDATE
My animation code:
DispatchQueue.main.async {
UIView.animate(withDuration: 0.15) {
self.iconView.transform = transformation
}
}

Answer 1

There should be no problem applying multiple transforms. Without seeing more of your code(Animation Block or Network Call for response) I am going to make two guesses
1) You are missing your UIView animation block.
let translationPoint = sender.translation(in: view)
let moveTransformation = CGAffineTransform(translationX: response.translationPoint.x, y: response.translationPoint.y)
var scaleTransformation: CGAffineTransform = .identity
if response.shouldScaleUp {
scaleTransformation = CGAffineTransform(scaleX: 1.3, y: 1.3)
}
let transformation = scaleTransformation.concatenating(moveTransformation)
DispatchQueue.main.async {
UIView.animate(withDuration: 0.2) {
iconView.transform = scaleTransformation
}
}
2) More likely or combined with the problem above you are trying to change the UI on a background thread from the network call. This could create delays and jerkiness and would need to be wrapped in a main thread call like above animation.
let translationPoint = sender.translation(in: view)
let moveTransformation = CGAffineTransform(translationX: response.translationPoint.x, y: response.translationPoint.y)
var scaleTransformation: CGAffineTransform = .identity
if response.shouldScaleUp {
scaleTransformation = CGAffineTransform(scaleX: 1.3, y: 1.3)
}
let transformation = scaleTransformation.concatenating(moveTransformation)
DispatchQueue.main.async {
iconView.transform = scaleTransformation
}

Answer 2

Nest the icon view in a parent view. Apply the position translation to the parent view and the scale to the child view.
This keeps the transforms separate and the result more easily predictable.