Applying just the scale component of a CGAffineTransform to a UIView - ios

I have a UIView to which various scale and rotation CGAffineTransforms have been applied, in response to touch screen gestures.
When a scale operation completes, I want to adjust the bounds of the view to the new size, then have view to re-draw itself at a scale of 1.0, while keeping all other components of the transform the same.
To adjust the bounds of the view, I'm using:
self.myView.bounds = CGRectApplyAffineTransform(self.myView.bounds, self.myView.transform);
To "undo" the scale transform, I'm trying this:
self.myView.transform = CGAffineTransformConcat(self.myView.transform, CGAffineTransformMakeScale(1, 1));
then calling [myView setNeedsDisplay] to get the view to redraw itself.
However this does not produce the desired results and when a rotate transform is applied, the above code seems to cause what looks like a sideways translation transform to be applied too.
What's the cleanest way to "undo" just a scale transform and have the view redraw at 1:1 with all other transforms remaining intact?

I am handling something similar, and what I do is store the separate components in another struct (scale, rotation, translation). That way you can easily recreate the transform again (be careful about the order of your operations though).
One thing though: I suggest that you don't change the bounds and instead just apple a scale operation to the transform. This will avoid some potential unneeded layouts. All of this stuff can be handled purely with the transform property. The way you are doing it now is not going to change anything since applying a scale of 1 is a no-op. If you scaled up the view by 2, you would need to scale by 0.5 to get back to the original. Or, as I said above, store all the components and recreate it from the identity matrix (matrix math is fast, don't worry about that).

Save your scale values in a variable and then, try changing CGAffineTransformMakeScale(1, 1) into
CGAffineTransformMakeScale(1/totalScaleWidth, 1/totalScaleHeight)

Related

Changing a view's values and its layer's values

I'm animating an ImageView using CABasicAnimation.
I move its layer to left, right, up and down and sometimes I'd scale it bigger then reset it to its original size etc.
I'm doing all this to its layer so I thought I might have to move & scale the real thing along with its layer as well but when I tested it with tap gesture to see if it really was just staying where it started, it wasn't. Therefore I no longer need to change its view's frames as far as I'm concerned.
Is changing a view's layer's values also change its view's values?
A UIView is no more than a fancy wrapper for a CALayer – bringing UIResponder events & animation conveniences among many other things.
Many UIView properties are actually just forwarded versions of the underlying CALayer properties, defined purely for convenience.
A view's frame & bounds properties should always reflect the layer equivalents.
transform is slightly more complex, as for the view it's of type CGAffineTransform – whereas on the layer it's CATransform3D. If the layer's transform can be represented as a CGAffineTransform, then you'll be able to access it from the view after setting it on the layer. If it can't be represented, then its value is undefined.
Therefore yes, you are right in saying you don't need to update the frame or transform on the UIView when changing it on its CALayer. Although note that these properties won't reflect the 'in-flight' values of the animation – you'll need to access the layer's presentationLayer for that.
Also note that as #par & #jrturton mention, if a layer's transform is not the identity transform, then the frame is undefined and you therefore shouldn't use it.

How to rotate a view in place after transform as been applied?

I'm using a variant of this code to slighty rotate a UIButton about its center:
CGFloat jiggleAngle = (-M_PI * 2.0) * (1.0 / 64.0);
self.transform = CGAffineTransformRotate(self.transform, jiggleAngle);
This code generally works as expected and rotates the button in-place, about 12 degrees counter-clockwise. However, this only works if I do not reposition the button inside my layoutSubviews method. If I do any repositioning of the button at all from its initially laid-out location, the attempt to rotate above results in the button's disappearance. If the angle I choose for rotation is an exact multiple of 90 degrees, the rotation works somehow even after a move in layoutSubviews.
I understand that my button's transform is being altered in layoutSubviews and this results in the subsequent weirdness when I attempt to rotate it with the above code. I have currently worked around this problem by placing the button I wish to rotate inside another UIView and then moving that view around as desired, but I'd like a better solution that doesn't require redoing my screen layouts.
How can I adjust/alter my button's transform after a move, so that this rotation code continues to work as expected?
The problem you are facing is that a view's frame is "undefined" if it's transform isn't the identity transform.
What you should do is use the view's center property to move it around. That works even if you've changed it's transform.
You can also apply a rotation to the view's layer instead of the view (although be aware that the layer transform is a CATransform3D, a 4x4 transformation matrix instead of a 3x3, so you need different methods to manipulate it.)

Apply definitely CGAffineTransform* to a UIView

I'm having a problem with scale transformation I have to apply to UIViews on Swift (but it's the same in objective-c too)
I'm applying a CGAffineTransformMakeScale() to multiples views during a gestureRecognizer.
It's like a loop for a cards deck. I remove the one on top and the X others behind scale up and a new one is added in the back.
The first iteration works as expected. But when I try to swipe the new front one, all the cards reset to their initial frame size because i'm trying to apply a new transform, which seems to cancel the previous one and reset the view to its initial state.
How can I apply definitely/commit the first transform change to be able to apply a new one after that based on the UIView resulting new size ?
I tried a UIView.commitAnimations() but no change.
EDIT :
Here's a simple example to understand what I try to do :
Imagine I have an initial UIView of 100x100
I have a shrink factor of 0.95, which means next views behind will be 95x95, then 90.25, then 85.73, etc
If I remove the top one (100x100), I want to scale up the others, so the 95x95 will become 100x100, etc
This is done by applying the inverse of the shrink factor, here 1.052631...
First time I apply the inverse factor, all views are correctly resized.
My problem is, when I trigger again by a swipe on the new front UIView a new resize of all views (So, for example, the 90.25x90.25 which became 95x95 should now scale to 100x100).
At this moment, the same CGAffineTransformMakeScale() is apply to all views, which all instantly reset to their original frame size (so the now 95x95 reset to 90.25x90.25, and then begin to apply the transformation on this old size).
As suggested here or elsewhere, using UIView.commitAnimations() in the end of each transformation don't change anything, and using a CGAffineTransformConcat() is like powering over and over the scaling by himself and of course views become insanely big...
I hope I made myself more clear, that's not easy to explain, don't hesitate to ask if something is wrong here.
After a lot of reading and consulting colleagues who know better than me about iOS programmation, here's my conclusion :
Applying a CGAffineTransformMakeScale() only modify visually a view but not its properties, and since it's difficult (and costly) to modify afterward the bounds and/or frame of a view, I should avoid to try to make a transform, update bounds, make another transform, etc.
Applying the same CGAffineTransformMakeScale() only reset the effect and not apply to the previous one.
Applying a CGAffineTransformScale() with the same values on top of the previous CGAffineTransformMakeScale() (or with a CGAffineTransformConcat()) has some unpredictable effect and will be very difficult to calculate precisely the new values to apply each time to get the effect I want.
The best way I can go with this is only applying one CGAffineTransformMakeScale() that I will keep updating scales values all along the view's life.
It implies now for me to rework all my implementation logic in reverse, but that's the easiest way to do this right.
Thanks all for your tips.

UIView: how to "reset" transformations. CGAffineTransformScale not working as I would expect

I think my question can be summed up as how to store and reset the transform of a view. But then perhaps explaining my situation might help.
If I apply the transforms below to a view, one after another (like if I add this code to a switch or a button). I get exactly the result I would expect: the scale switches between: a view that is .55 times the size of the original view, and the view at it's original scale. Works to scale sub-views of someView too, just as I want. Ad infinitum. Perfect.
//tranformScale 1
someView.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0.55, 0.55 );
//tranformScale 2
someView.transform = CGAffineTransformScale(CGAffineTransformIdentity, 1.0, 1.0 );
The trouble is I want to use this code (or similar) to scale a sub-view of self.view when an iOS device goes into landscape, to fit the sub-view to the landscape screen (and back up when in portrait). It almost works, but for some reason instead of outputting round values values for the frame of the view being scaled (as happens with a test using a button to call the transforms), progressively strange values are produced. Eventually, after about 4 rotations the sub-view flies off screen. I suspect it has to do with self.view changing shape, but then again, when I log the frame of self.view it's shape is very predictable.
By the way I am centering the view using autoresizingMask flexible margins, not using auto-layout. perhaps I should be centering the view with another type of calculation?
Thanks for reading!
I did this and it worked perfect.
self.imageview.transform = CGAffineTransformIdentity
(1) be sure not to set or get any frame data after applying transforms, it is unsupported and will yield unpredictable results;
(2) turn off your autoresizing mask flex margins and center like this:
view.center = CGPointMake(view.superview.bounds.size.width/2,
view.superview.bounds.size.height/2);
(take care to apply centering while view is at full size. i.e. BEFORE the transform if it is the resize transform, AFTER the transform if it is the identity transform)

Correcting blurry text after a CGAffineTransformMakeScale

I have multiple views with many UILabels on the views. (all constructed in Interface Builder).
I am then trying to create a "smaller" replica of my view when you pinch the screen.
To do this I apply:
view.transform = CGAffineTransformMakeScale(.5, .5);
and then I also adjust the frame of view.
The problem is that after the transformation, the text in all of my UILabels becomes "blurry". It doesn't stay pixel perfect as it is in full-scale view.
Is there a way to increase the pixelation of the labels after the transformation?
Applying a transform to a UIView or CALayer merely scales the rasterized bitmap of that layer or view. This can lead to blurriness of the resulting UI element, because they aren't re-rendered at that new scale.
If you really want your text or images to be crisp at the new scale factor, you're going to need to manually resize them and cause them to redraw instead of applying a transform. I described one way that I did this with a UIView hosted in a UIScrollView in this answer.
You might be able to create a single method that traverses your view hierarchy for your one main view, recursively reads each subview's frame, scales that down, and then forces a redraw of its contents. Transforms are still great to use for interactive manipulation or animation, but you can then trigger a full manual scaling and redraw at the end of the manipulation or animation.

Resources