I have two UIViews on my screen. I need to do the following:
If I increase the first view's alpha value, the second UIView alpha value should decrease. The reverse is also true.
Please show me an example of how to do this.
Perhaps something like this can help you to start:
// Displays second view and hide first view.
[UIView animateWithDuration:0.5
delay:0.0
options: 0
animations:^{
myFirstView.alpha = 0.0f;
mySecondView.alpha = 1.0f;
}
completion:^(BOOL finished){
NSLog(#"Done!");
}
];
The reverse case can be produced by reversing the alpha values.
Related
My application has VOIP calling. In that I want to implement animation like iPhone's default Phone application does when User Clicks on Call button on dial Pad and animation that is done on End call button.
I have researched alot about this but haven't find anything yet. Any help will be appreciated on this topic.
Right now I have implemented scaling animation like below:
- (void)animateFadingOut{
self.view.transform = CGAffineTransformMakeScale(1.00, 1.00);
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.5];
[UIView setAnimationDelegate:self];
[self performSelector:#selector(push) withObject:nil afterDelay:0.35];
self.view.transform = CGAffineTransformMakeScale(0.00, 0.00);
//set transformation
[UIView commitAnimations];
}
- (void)push
{
self.view.transform = CGAffineTransformMakeScale(1.00, 1.00);
// push navigation controloller
CallViewController *objCallViewController = [[CallViewController alloc] initWithNibName:#"CallViewController_iPhone" bundle:nil];
[self setHidesBottomBarWhenPushed:YES];
[self.navigationController pushViewController:objCallViewController animated:NO];
[objCallViewController release];
[self setHidesBottomBarWhenPushed:NO];
[[AppDelegate shared] setTabHidden:TRUE];
}
But It is not giving me exact animation that default Phone application has
Here is what I might try if I was trying to create animations.
CGRect movementFrame = self.view.frame;
//Make position and size changes as needed to frame
movementFrame.origin.x = 0;
[UIView animateWithDuration:0.5
delay:0.0
options:UIViewAnimationOptionCurveEaseOut
animations:^{
/*
Animation you want to commit go here
Apply movementFrame info to the frame
of the item we want to animate
*/
//If you wanted a fade
self.view.alpha = !self.view.alpha //Simply says I want the reverse.
self.view.frame = movementFrame;
//Example of what you could do.
self.view.transform =CGAffineTransformMakeScale(1.00, 1.00);
} completion:^(BOOL finished) {
//Things that could happen once the animation is finished
[self push];
}];
This has not been tested for your case. Therefore I am also not sure if it will help you, but hopefully it will. Good luck to you.
*Edit*
So I reviewed the animation on an iPhone and it appears to me to be a series of animations happening at once.
You have what I presume to be the UIActionSheet animating down.
The top section overlay sliding up its y-axis.
Then you have, which I haven't mastered yet, a split in the back view that animates its x-axis in opposite directions which cause the split.
Finally you have the new view scale up to take frame for the effect.
I can't say 100% this how they have done it, however if I was going to attempt to recreate this, I would likely start here.
Hello there so after just quickly coming up with an animation I got pretty close it could use some tweaks.
It took me three views to do a
topView, bottomView, and backView.
Also took into account the view that you would be loading in. viewToLoadIn
`-(void)animation{
CGRect topMovementFrame = self.topView.frame; //Set dummy frame to modify
CGRect bottomViewFrame = self.bottomview.frame;
topMovementFrame.origin.y = 0 - self.topView.frame.size.height; //modify frame's yAxis so that the frame sits above the screen.
bottomViewFrame.origin.y = self.view.frame.size.height; //modify frame's yAxis to the it will sit at the bottom of the screen.
[self.viewToLoadIn setFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
[UIView animateWithDuration:0.5
delay:0.0
options:UIViewAnimationOptionCurveEaseOut
animations:^{
//Animation
self.topView.frame = topMovementFrame; //Commit animations
self.bottomview.frame = bottomViewFrame;
self.backView.alpha = !self.backView.alpha;
self.backView.transform = CGAffineTransformMakeScale(100, 100);
self.viewToLoadIn.transform = CGAffineTransformMakeScale(2.0, 3.0);
*MAGIC*
} completion:^(BOOL finished) {
//Completion
//Clean up your views that you are done with here.
}];
}`
So then When they pressed the button I had setup this animation would happen.
Also at first I thought that the setup might contain a UIActionStyleSheet. which it still might but this is a pretty handy built in functionality. But the fact that you can interact with the screen lead me to think a custom view. It would be easier in my opinion.
I hope this helps you even if it just a little bit.
Take care ^^
In one of my views i need to animate frame property of a UIImageView and while doing it i want to show a progress bar(UIProgressView) in the title view of the navigation bar.The problem is the if i comment out the following animation blocks the progress bar is updated as expected smoothly.On the other hand due to the following animation the progress bar stops in severals places and carries incrementing again.
//add message bubble
[UIView animateWithDuration:0.3
delay:0
options:UIViewAnimationOptionAllowUserInteraction
animations:^
{
animationBubbleImageView.alpha = 1;
}
completion:^(BOOL finished)
{
[self removeAutoCorrectionAndHighlight];
[UIView animateWithDuration:0.3
delay:0
options:UIViewAnimationOptionAllowUserInteraction
animations:^
{
CGRect bubbleFrame = CGRectMake(animationBubbleImageView.frame.origin.x,
animationBubbleImageView.frame.origin.y,
bubbleSize.width,
bubbleSize.height);
[animationBubbleImageView setFrame:bubbleFrame];
messageLabel.alpha = 1;
}
completion:^(BOOL finished)
{
[self sendSubviewToBack:textView];
[self.delegate moveBubbleToTableCell];
}];
}];
animation blocks do not block the main thread but what coudl be the reason of unsmooth beahviout of th progress view ?
UPDATE: What i want to achive is the MessagesApp bubble animation in IOS.While the typed message becomes a bubble and flies to its place the progress bar should increment slowly.
If i try the same thing withou animation progressbar increments normal.
Try putting the progress bar animation in the same animation as the bubble animation. Or put them all into an animation group.
Have you tried Instruments to see what's happening?
Wild guess: you can also check whether the two views inadvertently overlap.
If feasible you can also try to group together the animations, as suggested by "Dad".
Best, Akos
I would like to perform a simple animation on a series of UIImageViews in my app. I have a grid of images that I want to fade in. I can make it so that the next image starts its animation after the previous one completes, like so:
|--------animation1--------|
|--------animation2--------|
|--------animation3--------|
Which I accomplish with code like this:
- (void)loadOtherIcon;
{
UIImageView *icon = [icons objectAtIndex:iconCount];
[UIView animateWithDuration:0.5 delay:0.0 options:nil animations:^{
icon.alpha = 1;
} completion:^(BOOL finished){
if (iconCount < icons.count - 1) {
[self loadOtherIcon];
}
}];
}
But I was hoping to stagger them, like this:
|--------animation1--------|
|--------animation2--------|
|--------animation3--------|
Any suggestions?
Start each of the animations at the same time, but use an increasing "delay" amount. Currently, you're setting it to 0.0.
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 am building an app that requires me to switch amongst 5 views and all of them are in a single view controller class. I am able to switch them using addSubview and removeFromSuperview methods, but the problem is that I want to animate it with the current view moves out to left and the next view comes in from right.
I tried using this thread but was not able to get the desired result.
Any form of help will be highly appreciated.
Thanks in advance!!
You can use this
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.5];
CGAffineTransform transform = CGAffineTransformMakeTranslation(xOffSet, yoffSet);
myView.transform = transform;
[UIView commitAnimations];
Hope this Helps....
you can use the following to animate views:
[UIView animateWithDuration:0.8f animations:
^{
// and of course you can edit the duration according to your need
// Change Alpha value of the view or set it to hidden
// you can also change the frame; which will make the view change it position with animation to the new provided frame.
}
completion: ^(BOOL finished)
{
// Your Code here; if you want to add other animation on the end of the proccess.
}
};