I've just used Instagram application. I like the effect when I click on comment.
When you click "comment" you'll see a fade in view for insert the comment text.
How can I implement something like this?
Here two screenshot's:
Set a UIAnimation. Start the animation with the alpha of the view at 0, and then end the animation with the alpha of that view to 1, and commit the animation. And voila, you have a view that fades in.
It's easy. Create your view. When the user clicks the button, set the alpha of that view to 0 and set the size to smaller than your final size, etc.
lets say your view is called myView. you'd write:
myView.alpha = 0;
myView.frame = CGRectMake(50, 50, 100, 100);
[self.view addSubVew: myView];
[UIView beginAnimations:#"View Fade" context:nil];
[UIView setAnimationDuration: .25];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
and then you set the alpha to 1 and increase the size of the view
myView.alpha = 1
myView.frame = CGRectMake(25, 25, 200, 200);
and then you commit the animations
[UIView commitAnimations];
It's something like that, i wrote it off the top of my head so I apologize for any syntax errors or anything. But that's pretty much how it's done.
Related
What happens if I set a property twice to two different values inside of an animation block? If I execute the following pseudocode:
myView.frame = CGRectMake(0, 0, 50, 50); // state 0
[UIView beginAnimations:#"showBanner" context:NULL];
{
[UIView setAnimationDuration:2];
myView.frame = CGRectMake(0, 20, 50, 50); // state 1
myView.frame = CGRectMake(0, 10, 50, 50); // state 2
}
[UIView commitAnimations];
which of the following results should I get?
The frame animates from state 0 through state 1 to state 2.
The frame animates from state 0 directly to state 2, ignoring state 1.
I would expect result #2 to happen because I would think that the state of the properties is recorded when the animation is committed. I'm getting a behavior in my app which seems to indicate that result #1 is happening, hence my question.
Actually the answer is 3. None of the above.
The animation block will only animate the last state change for the property. So in your case the frame will animate from state 1 to state 2.
(2) The frame animates from state 0 directly to state 2, ignoring state 1.
I needed an answer to this question and didn't find either one given here satisfactory. I built a quick test that placed a small subview like this:
- (void)viewDidLoad {
[super viewDidLoad];
self.testView = [[UIView alloc] initWithFrame:CGRectMake(0,0,40,40)];
self.testView.backgroundColor = [UIColor redColor];
[self.view addSubview:self.testView];
}
And then provided two alternative animations like this:
- (void)animateWithSimpleBlock {
[UIView animateWithDuration:2 animations:^{
self.testView.frame = CGRectMake(200,200,40,40);
self.testView.frame = CGRectMake( 0,300,40,40);
}];
}
- (void)animateWithQualifiedBlock {
[UIView animateWithDuration:2 delay:0.0 options:UIViewAnimationOptionBeginFromCurrentState animations:^{
self.testView.frame = CGRectMake(200,200,40,40);
self.testView.frame = CGRectMake( 0,300,40,40);
}];
}
Here's what happens: on animateWithSimpleBlock, the testView jumps in a single frame (no animation) from it's initial 0,0 position to the intermediate position 200,200. From there, it animates over 2sec to the final 0,300 position.
But animateWithQualifiedBlock animates the testView smoothly from it's initial 0,0 position to the final 0,300 position. This is the behavior I need (b/c I'm building up new view positions with looping methods called in the animation block).
I have a UIView which I want to grow from it's center when a user touches it. The problem is that when animating it the view expands left and then moves to the right, whereas I want it to expand to the left and right, while keeping the center point the same.
This is the code I have at the moment:
[UIView animateWithDuration:1 animations:^(void) {
[view setFrame:CGRectMake(-10, 0, 320, view.frame.size.height)];
}];
I didn't think it was going to be difficult to do this, but it seems it is. Short of animating it manually with a timer I have no idea how to get it to expand from it's center.
I am not quite sure why it's working for you in a weird manner. Did you alter the anchorPoint property in any way? Otherwise it should grow from center.
Does doing
CGRect newFrame;
newFrame = CGRectInset(view.frame, -10, -30);
[UIView animateWithDuration:1 animations:^(void) {
view.frame = newFrame;
}];
also give you the same result? What about this?
[UIView animateWithDuration:1 animations:^(void) {
view.transform = CGAffineTransformScale(view.transform, 1.1, 1.1);
}];
Try the code given by #Deepak Danduprolu and also don't forgot to UnCheck the "Use AutoLayout" checkbox in the show file inspector window of the storyboard.
It works for me.
Just offset the X,Y position of the view. Lets say you're DECREASING both the width and height of the frame by 20 points: you should then ADD 10 points to both the X and Y position of the frame.
I have a subView that I want to toggle between hidden and not hidden by a button. How do I fade in the subview and fade it out? For now it just appears immediately and disappear immediately when I toggle the button.
I am wondering what is the easiest way to do this animation.
Thanks
On iOS 4.0+ Apple recommends you use their new, block-based animation methods. Using these, the code would look something like this:
[UIView animateWithDuration:2.0
animations:^{myView.alpha = 0.0;}];
The properties you are animating go inside the block (the ^{...} part). Blocks are sort of like functions, so you can put multiple lines of code inside of them, if you want to animate multiple properties. For example:
[UIView animateWithDuration:0.2
animations:^{
view.alpha = 0.0;
view.backgroundColor = [UIColor redColor];
}];
If you need to perform an action after the animation is complete, use the +animateWithDuration:animations:completion: method (which also uses blocks), for example:
[UIView animateWithDuration:0.2
animations:^{view.alpha = 0.0;}
completion:^(BOOL finished){ [view removeFromSuperview]; }];
For more info, check out the UIView Class Reference 'Animations' section and 'Animating Views with Blocks' section.
This is the old pre-4.0 way:
http://objcolumnist.com/2009/07/18/simple-uiview-based-animations-on-the-iphone/
... which has the advantage of being conceptually simple and easy to implement.
float alpha = 1.0; // or 0.0 if it's already visible and you want to fade out
[UIView beginAnimations:#"" context:NULL];
[UIView setAnimationDuration:2.0]; // seconds, not ms. guess how i know?
[mySubView setAlpha:alpha];
[UIView commitAnimations];
I'm planning to create a game like hangman. And I want every character appear from the top, like flying from the top. Do I have to make a transition or just hard code the animation for this implementation?
Thanks.
Put each character in its own UIView instance and animate the center property.
//let's say we have a custom UIView subclass that displays a character called 'MYCharacterView'
MYCharacterView * view = [[MYCharacterView alloc] initWithFrame:CGRectMake(50.0, -10.0, 20.0, 20.0);
// ... configure the view here, e.g., set the character, etc. ...
[UIView beginAnimations:nil context:nil];
//animate the view from its current position off the top of the screen to 50, 200
//over 2 seconds
[view setCenter:CGPointMake(50.0, 200.0)];
[UIView setAnimationDuration: 2.0];
[UIView commitAnimations];
Hope that helps!
I have added a button on a view(the view is of the same size as the button). When that button is clicked a new view has to be displayed. So in the button's event handler I have added the newview as a subview of the view on which the button is added, so that the newview gets displayed when the button is clicked. The thing here I need to do is, when I click on the button, the newview has to be invoked from top to bottom (it has to look like it slides down from the button's view). When the same button is clicked again, the newview has to scrollback(slide) and disappear. I know that I need to apply some animation stuff to get this effect. But I have no idea how to do this. Can you please help me giving some ideas.
Thanks in advance!!!
Well you can animate the size of your window to simulate the slide from top like this:
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.3];
myView.frame = CGRectMake(0, buttonHeight+buttonTop, myView.frame.size.width, viewTargetHeight);
[UIView commitAnimations];
Make sure you set the view height to 0 when you create it.
To scroll it back up just do the opposite
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.3];
myView.frame = CGRectMake(0, buttonHeight+buttonTop, myView.frame.size.width, 0);
[UIView commitAnimations];
If you actually want your new view to slide you can try animating both the size and the position and you'll also probably need to clip your animated view with another view.