i'm developping an application for kids (memory game): turning two same tiles(images) and you can remove them. the problem is how to turn the uiimages with animation and only the uiimages without turning the view that contain them..
do i have to put every uiimage in a small view?
any ideas?
PS :i'm not using OpenGL
Sorry, misread the first time. Use UIImageViews for each tile and then animate as below.
a UIView is just a view, so you can animate it the way you animate any view. Its fairly straightforward.
UIImageView *tileToFlip = self.[tiles objectAtIndex:3];
CGRect frameOfTileToFlip = tileToFlip.frame;
UIImageView *newImageToShow = [[UIImageView alloc] initWithFrame:frameOfTileToFlip];
// add the image to newImageToShow
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration: 1.0];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:newImageToShow cache:NO];
[self.View addSubview:newImageToShow]; // I'm not sure if this is necessary
[UIView commitAnimations];
[tileToFlip removeFromSuperView]; // remove it so you can add it back later
Alternatively, you can use CATransition which gives you a little more control and different transitions.
You could use UIImageView for each tile.
Related
I want to be able to fade in a sub view. Is there a way to animate that so that when my subview gets added it fades in and not just is all of a sudden pops up there. I know I could get several instances of my imageview with different alphas and then animate it that way but isn't there an easier way?
Yes, you can animate the view without needing different images. The below code will fade your view in over 0.3 seconds.
[myView setAlpha:0.0];
[myView setHidden:NO];
[UIView animateWithDuration:0.3 animations:^{
[myView setAlpha:1.0];
}];
You need only one instance. UIView.alpha can be animated.
You can set the alpha to 0 before adding the subview, and after your addSubview, you make an animation, like that:
yourView.alpha = 0.0f;
[self.view addSubview:yourView];
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5f];
yourView.alpha = 1.0f;
[UIView commitAnimations];
I guess this is quite basic, but I was wondering if there is an easy way to animate an entire NIB onto the screen... coming from the right. Ideally, I'd like it to bounce a bit once it stops (i.e. if the NIB is supposed to scroll to position X = 0, I'd like to go it slightly negative before coming back to 0).
This is what I have so far:
[UIView animateWithDuration:0.5
delay:0
options:UIViewAnimationOptionCurveEaseIn
animations:^{
TabsEdit *tEdit = [[TabsEdit alloc] initWithNibName:#"TabsEdit" bundle:nil];
self.tabsEdit = tEdit;
[self.view addSubview:tEdit.view];
[tEdit release];
}
completion:^(BOOL finished){
}
Is there any easy solution or will I need to animate every single element in the NIB into view and then add my little bounce effect to it?
I'd be grateful for any suggestions of how to achieve this efficiently.
To get more complicated animations (if you want to have more segments to the bouce), you should go down to the CoreAnimation layer and define keyframes. Else have a series of embedded animateWithDuration/Completions, with each one doing a different part of the bounce). If all elements of a view are subviews, then when the view is animated, its subviews will follow.
one move repeat to bounce.
[UIView beginAnimations:#"move" context:nil];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationDuration:0.25];
[UIView setAnimationCurve:UIViewAnimationCurveLinear];
if(movingIn){
view.frame = CGRectMake(0.0f, view.frame.origin.x, .view.frame.size.width, view.frame.size.height);
}else{
view.frame = CGRectMake(320.0f, view.frame.origin.x, .view.frame.size.width, view.frame.size.height);
}
[UIView commitAnimations];
Hey guys, I still haven't found an answer to this so I think I'll ask you.
[viewOggetto setFrame:aFrame];
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5];
[viewOggetto.view setFrame:CGRectMake(0, 0, 320, 480)];
[self.view addSubview:viewOggetto.view];
[UIView commitAnimations];
this is a simple animation for a view to appear in a position and then go full screen.
My question is: how can I make the content of the view follow the animation as well?
Now I have the view frame animating correctly but everything that is inside the view just appears fullscreen instantly.
Thanks.
It's not entirely clear what you want to happen instead of it appearing full-screen instantly. You mean you want it to fade in? Set the alpha property on the subview to 0 and add it to self.view before you start the animation. Then set the alpha property to 1 within the animation.
but what viewOggetto exactly is? if it's a UIView then why to call viewOggetto.view?
is it a UIViewController?
You call both :
[viewOggetto setFrame:aFrame];
[viewOggetto.view setFrame:aFrame];
assuming it's a UIViewController, try this / prova cosi':
[self.view addSubview:viewOggetto.view]; // you need to have it before to animate it
// initial state of the animation:
[viewOggetto.view setFrame:CGRectMake(160, 240, 1, 1)]; // zoom from center
// viewOggetto.view.alpha = 0; // eventually to add a fadeIn animation
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5];
// ending state of animation:
// viewOggetto.view.alpha = 1; // restore to 1 to eventually to add a fadeIn animation
[viewOggetto.view setFrame:CGRectMake(0, 0, 320, 480)];
[UIView commitAnimations];
if it's a UIView just delete ".view" in every "viewOggetto.view" code
ciao,
luca
Just want to add to Jim's answer. UIView animations animate UIViews from one context to another. If the context doesn't exist before the [UIView beginAnimations:nil context:NULL]; then underside effects will happen. The context wont exist if the view hasn't been added to subview.
I have some code in my iPhone app like that :
//fromView is a UIImageView.
//self is a UIView.
UIGraphicsBeginImageContext(fromView.bounds.size);
[fromView.layer renderInContext:UIGraphicsGetCurrentContext()];
UIImage *dummyFromImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
UIImageView* dummyImageView = [[UIImageView alloc] initWithImage:dummyFromImage];
[self addSubview:dummyImageView];
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.5];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView: dummyImageView cache:YES]; //line:9
[UIView commitAnimations];
The dummyImageView only show but never flip, if you change line9's dummyImageView to fromView, fromView do flip, Please tell me why?
I ask this question to Apple Developer Technical Support, they said,
"The basic problem is that because of the timing of your animation there is no "previous" state for Core Animation to animate from, as the view was just added to the view hierarchy, and so when the transition is attempted, all it can do is display the "final" state.
If you instead perform the flip on the next runloop iteration, then Core Animation will have had time to create an initial state for the view's layer, and thus the flip will occur correctly. You can do this by splitting your flip method in two and using -performSelector:withObject:afterDelay: like so:
"
-(IBAction)flip {
UIImageView* dummyImageView = [[UIImageView alloc] initWithImage:fromView.image];
dummyImageView.frame = fromView.frame;
[window addSubview:dummyImageView];
[self performSelector:#selector(animate:) withObject:dummyImageView afterDelay:0.0];
}
-(void)animate:(UIView*)view {
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.5];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView: view cache:YES];
[UIView commitAnimations];
}
However, since you mention that "fromView" is a UIImageView, I wonder why you are using -renderInContext: – it is more efficient to simply use the same image that "fromView" is using and assign it as the image for your new UIImageView, as this saves both CPU time and memory, especially since I notice in your sample that the image is smaller than the view you are using.
[UIView setAnimationTransition:… forView: dummyImageView cache:YES]; //line:9
The view in the -setAnimationTransition:… method should be assigned to the view that contains the change. In your case, self.
The dummyImageView itself is not changed (exterior changes such as changing superview is irrelevant), so the animation can do nothing.
how can I implement the animation we see in the iPhone Music app's coverflow screen? when you click on a small view, it flips and scales up to another view? how can I do this? I can use core animation to flip and scale a view, but how can I do the transition to another view? thanks
You need an UIView as Container for the two UIViews (frontside/backside) and then remove/add these from/to the container as subviews while doing the animations in between:
UIView *flipContainer;
UIView *frontSide;
UIView *backSide;
//...
-(void)turnUp
{
[backSide removeFromSuperview];
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:1.0];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:flipContainer cache:YES];
[UIView setAnimationDuration:1.0];
CGAffineTransform transform = CGAffineTransformMakeScale(1.2, 1.2);
flipContainer.transform = transform;
[UIView commitAnimations];
[flipContainer addSubview:frontSide];
}
-(void)turnDown
{
[frontSide removeFromSuperview];
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:1.0];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:flipContainer cache:YES];
[UIView setAnimationDuration:1.0];
CGAffineTransform transform = CGAffineTransformMakeScale(1, 1);
flipContainer.transform = transform;
[UIView commitAnimations];
[flipContainer addSubview:backSide];
}
I'm trying the exact code you are doing - I get a zoom effect but no turn over. The only difference is that right before the turnUp code I add the flipContainer (with back showing) so then it can be flipped over.
// construct animation container
self.flipContainer = [[FlipContainer alloc] init];
[self.flipContainer.view setFrame:CGRectMake(clickedSquareX, clickedSquareY, 200, 200)];
[self.flipContainer.view addSubview:self.backside.view];
// add animation container
[self.myParentView.view addSubview:self.flipContainer.view];
// PROCEED to your turnUp code
The reason I'm doing this is I have a bunch of images in a horizontal UIScrollView and so to 'simulate' a 200x200 image flipping over and zooming to show detail I add my flipContainer with the backside showing the exact image over the exact spot of the pressed image. It should work shouldn't it? A bit confusing to me is the first line of your turnUp code you do:
[backSide removeFromSuperview];
..which would remove the view I just added.
I'm not sure if this is the right spot to put this question in - sorry if it isn't!