UIView rotates while scaling using CGAffineTransformMakeScale - iphone

Im using CGAffineTransformMakeScale to scale a UIView from 0.1 to 1.0.
The problem is that the view is also rotating while the scaling is being animated. So it ends with a scale of 1.0 AND 90ยบ of rotation.
[self presentModalViewController:slideTwoViewController animated: NO];
[slideTwoViewController.view setTransform:CGAffineTransformMakeScale(0.1,0.1)];
[UIView beginAnimations: nil context: nil];
[UIView setAnimationDuration:2.0];
[slideTwoViewController.view setTransform:CGAffineTransformMakeScale(1.0,1.0)];
[UIView commitAnimations];
The initial application orientation is landscape left. So when the animation ends the UIView looks like in portrait.
Is this supposed to happen? am I missing something?
Thanks

My bet, is the view already have a transform set and you are overwriting it with the new transform and it is animating the difference.
Try using the following function instead:
CGAffineTransformScale(<#CGAffineTransform t#>, <#CGFloat sx#>, <#CGFloat sy#>)
With this function, you pass the original transform slideTwoViewController.view.transform and your scale factor.
slideTwoViewController.view.transform = CGAffineTransformScale(slideTwoViewController.view.transform, 0.1, 0.1);

Despite of scaling rootview try to add subview which become your new pseudo rootview (with all the rest subviews connected underneath) and then scale pseudo rootview. This way you are avoiding any transform collisions made by system on the real rootview (e.g. autorotating) and then you can use CGAffineTransformMakeScale freely.

Related

Set animation curve

I'm scrolling through a scroll view dynamically, it works using
-(IBAction) animateTestingTwo{
[UIView animateWithDuration:4 animations:^{scroller.contentOffset = CGPointMake(0, 2000);}];
}
However the animation curve is not linear, it needs to be so I'm using this:
-(IBAction) animateTestingTwo{
[UIView animateWithDuration:4 options:UIViewAnimationOptionCurveLinear animations:^{scroller.contentOffset = CGPointMake(0, 2000);}];
}
However it isn't working. Any ideas?
Thanks!!
If the duration doesn't matter to you, this can be used:
[scrollview setContentOffset:CGPointMake(10, 200) animated:YES];
Acconding to the documentation:
animated
YES to animate the transition at a constant velocity to the new offset, NO to make the transition immediate.
You can also try to do this inside an animation block to see what happens.

CGAffineTransform and scaling to center of the image

I started studying objective-c using the iPhone and iPad apps for Absolute Beginners by Rory Lewis book but i got stuck on the 5th chapter.
I want to make a button that shrinks an image.
My problem is, that after I wrote all the code, the image shrinks to the point (0, 0) of the UIImageView (the top left), while in the video the image shrinks to its center. I've done some research and found out that CGAffineTransform uses the center of the object to make translations, rotations etc.
So why does it not work in my case?
I have the latest Xcode version and haven't done anything strange.
I hope I've been clear. Sorry for my English.
EDIT
Sorry for the code, but i wrote the question from my phone.
Anyway the incriminated part goes something like this
- (IBAction)shrink:(id)sender {
if(hasShrink == NO){
[shrinkButton setTitle:#"Grow" forState:UIControlStateNormal];
}
else if(hasShrink == YES){
[shrinkButton setTitle:#"Shrink" forState:UIControlStateNormal];
}
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0];
myIcon.transform = CGAffineTransformMakeScale(.25, .25);
hasShrink = YES;
[UIView commitAnimations];
}
All the animations are correctly written and the app does work, it just shrinks to the top left. Why is the point not set to the center of the UIImageView by default like it should be?
EDIT:
I figured out it was a problem caused by AutoLayout.
Once disabled everything went smooth ;)
If you are transforming a view mangled managed by auto-layout, you may experience some strange side-effects. See this answer for more details.
The solution I ended up employing was to encapsulate the view I wanted to transform inside another view of exactly the same size. The outer view had the appropriate layout constraints applied to it while the inner view was simply centered in its container. Applying a CGAffineTransform scale transform to the inner view now centers properly.
Old question... but just in case others come looking:
The CGAffineTransform acts (rotates, scales) around an anchorPoint.
If you are sizing to 0, 0 then your anchor point is set to 0, 0. If you want it to size to a different point, such as the center of the image, you need to change the anchor point.
The anchor is part of a layer
So if you have a UIImageView called imageview, you would make a call like this to set the anchor to the center of imageview:
[imageview.layer setAnchorPoint:CGPointMake(0.5, 0.5)];
Try something like this:
CGAffineTransform t = CGAffineTransformMakeScale(0.5, 0.5);
CGPoint center = imageView.center; // or any point you want
[UIView animateWithDuration:0.5
animations:^{
imageView.transform = t;
imageView.center = center;
}
completion:^(BOOL finished) {
/* do something next */
}];
Next time show your code. It will be easier to help you.
Check this project: https://github.com/djromero/StackOverflow/archive/Q-13706255.zip
You must study how autolayout and autoresize affect your views. In the project above both are disabled to let you see how it works.

Simulate push view animation inside UIView

I have a single UIView with some labels that display attributes from objects inside an array. I'm using gesture recognizers to change the current element in the array and hence the text in the labels. My question is how do I mimic a push animation without actually pushing a new view controller. Thanks for your help.
Thats simple way to use CGAffineTransformMakeTranslation to move any view from X axis to Y axis using UIViewAnimation. Before using this transition set your object frame to some x,y axis(0,0) and pass your x and y to move from.
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.4];
CGAffineTransform transform = CGAffineTransformMakeTranslation(x,y);
YOUR ViewOBJECT.transform=transform;
[UIView commitAnimations];
Have you tried to use the UIView class methods for animation? For example this could help:
+ (void)animateWithDuration:(NSTimeInterval)duration animations:(void (^)(void))animations
In the animations block you could move one view out and another in.

UIView Animation iPhone (obtaining information on the frame dynamically)

I have a UIView called goalBar which is being animated by increasing the size of the frame according to a float value called destination:
CGRect goalBarRect = CGRectMake(0, 0, destination, 29);
[UIView beginAnimations:#"goal" context:nil];
[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];
[UIView setAnimationDuration:2.0f];
goalBar.frame = goalBarRect;
[UIView commitAnimations];
The animation works perfectly and the rectangular view increases its width over the course of the animation (from 0 to the value for destination).
However, I wish to be able to extract the values for the frame of the UIView being animated (i.e. goalBar) as the animation takes place. By that I mean that I wish to place the value of the width for the animated frame in a separate UILabel so that the user sees a counter that provides the width of the UIView as it's being animated.
Any help on how to do the above would be gratefully received.
How about observing the frame property of the view. So that you get callbacks when it changes.
See Key-Value Observing.
I've looked into this and it seems that it is not possible to get updates on the state of the components being animated during the UIView animation process.

iPhone Curl Left and Curl Right transitions

I am looking for a way to do a UIViewAnimationTransitionCurlUp or UIViewAnimationTransitionCurlDown transition on the iPhone but instead of top to bottom, do it from the left to right (or top/bottom in landscape mode). I've seen this asked aroud the internet a few times but none sems to get an answer. However I feel this is doable.
I have tried changing the View's transform and the view.layer's transform but that didn't affect the transition. Since the transition changes when the device changes orientation I presume there is a way to fool the device to use the landscape transition in portrait mode and vice versa?
It's possible to do curls in any of the four directions by using a container view. Set the container view's transformation to the angle you want and then do the curl by adding your view to the container view, not your app's main view which does not have a transformed frame:
NSView* parent = viewController.view; // the main view
NSView* containerView = [[[UIView alloc] initWithFrame:parent.bounds] autorelease];
containerView.transform = CGAffineTransformMakeRotation(<your angle here, should probably be M_PI_2 * some integer>);
[parent addSubview:containerView];
[UIView beginAnimations:nil context:nil];
[UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:containerView cache:YES];
[containerView addSubview:view];
[UIView commitAnimations];
I actually managed to achieve this effect by changing the orientation of my UIViewController. The strange thing is, I had my controller nesten in another one when it wasn't working, but when I set him as the immediate view controller, it worked.
Code that does it:
In a UIViewController that is the main view controller in my app delegate and only allows landscape orientation (as you see in the 2nd method below) I have the following:
-(void)goToPage:(int)page flipUp:(BOOL)flipUp {
//do stuff...
// start the animated transition
[UIView beginAnimations:#"page transition" context:nil];
[UIView setAnimationDuration:1.0];
[UIView setAnimationTransition:flipUp ? UIViewAnimationTransitionCurlUp : UIViewAnimationTransitionCurlDown forView:self.view cache:YES];
//insert your new subview
//[self.view insertSubview:currentPage.view atIndex:self.view.subviews.count];
// commit the transition animation
[UIView commitAnimations];
}
- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation {
return (interfaceOrientation == UIInterfaceOrientationLandscapeRight);
}
I also struggled with this. To get the curl to come from the right or left you can create an intermediate view and transform it. So, let's say the view you're transitioning (myView) is a child of the main window (parentView):
-parentView
-->myView
You will insert an intermediate view in between (easily done in Interface Builder):
-parentView
-->containerView
--->myView
Then, use the following code to flip the container 90 deg left and the transitioned view 90 deg right:
containerView.transform = CGAffineTransformMakeRotation(-M_PI_2);
myView.transform = CGAffineTransformMakeRotation(M_PI_2);
myView will still appear upright to the user but the transition will think it's applied at 90 degrees from the left.
Note that depending on how auto-scaling your views are, you might have to fix the frame sizes after applying the transform, eg
containerView.frame = CGRectMake(0.0, 0.0, 768.0, 1024.0);
myWebView.frame = CGRectMake(0.0, 0.0, 768.0, 1024.0);
Hope this helps. The is the closest you can get to UIViewAnimationTransitionCurlLeft and UIViewAnimationTransitionCurlRight.
I tried the solution of fluXa on iOS5 (So I had to use [UIView trans......]) but it didn't work: the curl still went up or downwards. Apparently the transition now don't take the transform of the view into account. So in case someone else wants to do the same trick on iOS5, the solution is to add another container in between and animate the transition from there.
Here is my code, which is a bit specific since I want to curl 'up' to the left, but with the lower corner curling. As if I am tearing a page out of a note book.
UIView* parent = self.view; // the main view
CGRect r = flipRectSize(parent.bounds);
UIView* containerView = [[UIView alloc] initWithFrame:r];
CGAffineTransform t = CGAffineTransformMakeRotation(-M_PI_2);
t = CGAffineTransformTranslate(t, -80, -80);
containerView.transform = CGAffineTransformScale(t, -1, 1);
[parent addSubview:containerView];
UIView* container2 = [[UIView alloc] initWithFrame:r];
[containerView addSubview:container2];
UIImageView* v = [[UIImageView alloc] initWithFrame:r];
v.image = [UIImage imageWithCGImage:contents.CGImage scale:contents.scale orientation:UIImageOrientationLeftMirrored];
[container2 addSubview:v];
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, 0.001 * NSEC_PER_SEC), dispatch_get_main_queue(), ^{
[UIView transitionWithView:container2
duration:DURATION_CURL_ANIMATION
options:UIViewAnimationOptionTransitionCurlUp
animations:^{
[v removeFromSuperview];
} completion:^(BOOL finished) {
if (completion) {
completion(finished);
}
[containerView removeFromSuperview];}];});
Notes:
I must admit that the affine transform translate (80,80) doesn't make sense in my mind, but it is necessary for iphone, probably won't work on iPad.
flipSizeRect flips the width and height of a rectangle (you already got that, right?)
the dispatch_after is necessary because I added the container and then want to remove a view from the hierarchy. If I leave out the dispatch nothing animates. My best guess is that we first need to let the system do a layout pass before we can animate a removal.
I don't think there is a way beyond writing a custom animation.
More importantly you probably shouldn't try to it. The curl up and curl down are part of the user interface grammar that tells the user that a view is being lifted up or put down over the existing view. It's supposed to be like a sticky note being put down and then removed. A left<->right curl will most likely be interpreted as the something like ripping a page out of a book. It will confuse users.
Whenever you find yourself trying to do something in the interface that the standard API doesn't do easily, you should ask yourself whether such a novel method will communicate something important to user and whether it is similar to the existing interface grammar. If not, then you shouldn't bother.
Unusual interfaces have an initial wow factor but they lead to frustration and errors in day-to-day use. They can also cause Apple to refuse your app.