I have a UIScrollView which contains various subviews (UIImageViews, UILabels and standard UIViews). Some of the UIImageViews are partially covered by other UIViews.
However, when I fade out the UIScrollView, the partially covered parts of the UIImageViews are being exposed for the brief moment of the animation.
I want to be able to fade the scrollview and all it's contents at the same time in the same animation - i.e. not revealing any of the partially covered images.
If it's not possible, I can always add a UIView on top of all the other controls and fade it from alpha 0 upto 1 to hide everything, but I'm sure there's a way to perform a complete fade on a view and all it's subviews.
I tried this:
[UIView beginAnimations:nil context:NULL];
[scrollViewResults setAlpha:0.0f];
[UIView commitAnimations];
And I've tried this:
- (IBAction)questionGroupChanged:(UIButton*)sender {
[UIView beginAnimations:nil context:NULL];
[self fadeViewHierarchy:scrollViewResults toAlpha:0.0f];
[UIView commitAnimations];
}
- (void)fadeViewHierarchy:(UIView*)parentView toAlpha:(float)alpha {
[parentView setAlpha:alpha];
for (UIView *subView in parentView.subviews) {
[self fadeViewHierarchy:subView toAlpha:alpha];
}
}
But I've still not cracked it. Any ideas?
This happens because of the way the compositor works. You need to enable rasterization on the view's layer when fading it in/out:
view.layer.shouldRasterize = YES;
You should probably only enable this for the duration of the animation because it will take up some extra memory and graphics processing time.
Mike's answer is the correct one and he deserves all credit for this. Just to illustrate, it might look like:
- (void)fadeView:(UIView*)view toAlpha:(CGFloat)alpha
{
view.layer.shouldRasterize = YES;
[UIView animateWithDuration:0.75
animations:^{
view.alpha = alpha;
}
completion:^(BOOL finished){
view.layer.shouldRasterize = NO;
}];
}
Thus, using your scrollViewResults, it would be invoked as:
[self fadeView:scrollViewResults toAlpha:0.0f];
Did you try with UIView class methods +animateWithDuration:* (available on iOS 4 and +)
Like :
- (void)fadeAllViews
{
[UIView animateWithDuration:2
animations:^{
for (UIView *view in allViewsToFade)
view.alpha = 0.0;
}
completion:^(BOOL finished){}
];
}
Related
I have a question regarding the UIView method:
+ (void)animateWithDuration:(NSTimeInterval)duration
animations:(void (^)(void))animations
completion:(void (^)(BOOL finished))completion
Basically I am just trying to set a height constraints constant to 0 and have the change look like its slowly shrinking...
My Code looks like this:
[UIView animateWithDuration:0.7
animations:^{
//hide the Title
self.titleCellHeigthConstraint.constant = kLabelHeightZero;
[self.contentView layoutIfNeeded];
}
completion:nil];
Unfortunately it's not animating. It simply makes all changes appear with a little delay (which might be the 0.7 seconds specified in the method).
Now my question is if there is any way to get the UIView to animate the change?
Thanks in Advance!
Edit:
The weird thing is if I reverse the changes in an animated fashion it does it exactly the way I want it. The code I'am using for that is:
//animate layout changes
[UIView animateWithDuration:0.7
animations:^{
//hide activity indicator and label
[self.activityIndicator stopAnimating];
[self.label setHidden:YES];
}
completion:^(BOOL arg0){
[UIView animateWithDuration:0.3
animations:^{
//show title label
self.titleCellHeigthConstraint.constant = kDefaultLabelHeight;
[self.contentView layoutIfNeeded];
}];
}];
You want to change the properties of the UIView not the NSLayoutConstraint in the animation method. I.e. Change the layout constraint's constant before the UIView method and then change the UIView's frame property in the animation method.
This way you won't need to call layoutIfNeeded.
I have a UIButton in my code that moves steadily across the screen. Currently, when the user presses the button, the alpha changes to 0 and it just disappears. What I'd like to do is run a separate animation after the button is pressed/it has disappeared. Seems easy enough but the catch is I need to run the animation at the exact point of the button when it is pressed. And I'm drawing a blank on how to make this happen. Any help will be much appreciated! I'll post some relevant code below.
-(void)movingbuttons{
movingButton2.center = CGPointMake(x, y);
displayLink = [CADisplayLink displayLinkWithTarget:self selector:#selector(moveObject)];
[displayLink addToRunLoop:[NSRunLoop currentRunLoop] forMode:NSRunLoopCommonModes];
}
-(void)moveObject{
movingButton2.center = CGPointMake(movingButton2.center.x , movingButton2.center.y +1);
}
-(IBAction)button2:(id)sender {
[UIView beginAnimations:nil context:NULL];
[movingButton2 setAlpha:0];
[UIView commitAnimations];
}
Replace your button2 action with below code and implement the someOtherMethodWithAnimation method with the animation you want :)
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:1];
movingButton2.alpha = 0;
[UIView commitAnimations];
[self performSelector:#selector(someOtherMethodWithAnimation) withObject:nil afterDelay:1.0];
Replace your animation with:
[UIView animateWithDuration:0.25
animations:^{
self.movingbutton2.alpha = 0.0;
// modify other animatable view properties here, ex:
self.someOtherView.alpha = 1.0;
}
completion:nil];
Just a nit picking point, but is the button in your view controller's .xib file correctly hooked up to your IBOutlets and IBActions?
UPDATE:
You are not limited to modifying that one button in your method. You add what ever code you want in the animation block (see the udated axample above).
UIView animatable properties, there is an animation section there.
Another approach could be (I am just using alpha as an example):
[UIView animateWithDuration:1.0
animations:^{
self.movingButton2.alpha = 0.0;
}
completion:^{
[UIView animatateWithDuration:0.25
animations:^{
self.someOtherView.alpha = 1.0;
}
completion:nil];
}];
This will more likely guarantee the animations will hapen one after another.
I'm doing some custom animations to change views in a single method. I already removed "fromView" from superView using [UIView setAnimationDidStopSelector:#selector(removeFromSuperview)], but I also want to enable user interaction after the end of the animation.
Here's my code:
-(void) switchFrom:(UIViewController*) fromViewController To:(UIViewController*) toViewController usingAnimation:(int) animation{
UIView *fromView = fromViewController.view;
UIView *toView = toViewController.view;
/*************** SET ALL DEFAULT TRANSITION SETTINGS ***************/
// Get the current view frame, width and height
CGRect pageFrame = fromView.frame;
CGFloat pageWidth = pageFrame.size.width;
// Create the animation
[UIView beginAnimations:nil context:nil];
// Create the delegate, so the "fromView" is removed after the transition
[UIView setAnimationDelegate: fromView];
[UIView setAnimationDidStopSelector:#selector(removeFromSuperview)];
// Set the transition duration
[UIView setAnimationDuration: 0.4];
/*************** IT DOESN'T WORK AT ALL ***************/
[toView setUserInteractionEnabled:NO];
[UIView setAnimationDelegate: toView];
[UIView setAnimationDidStopSelector:#selector(setUserInteractionEnabled:)];
[toView setUserInteractionEnabled:YES];
// Add the "toView" as subview of "fromView" superview
[fromView.superview addSubview:toView];
switch (animation) {
case AnimationPushFromRigh:{
// Position the "toView" to the right corner of the page
toView.frame = CGRectOffset(pageFrame, pageWidth,0);
// Animate the "fromView" to the left corner of the page
fromView.frame = CGRectOffset(pageFrame, -pageWidth,0);
// Animate the "toView" to the center of the page
toView.frame = pageFrame;
// Animate the "fromView" alpha
fromView.alpha = 0;
// Set and animate the "toView" alpha
toView.alpha = 0;
toView.alpha = 1;
// Commit the animation
[UIView commitAnimations];
}
.
.
.
Any idea how can I call this two methods in setAnimationDidStopSelector and actually make them work together?
EDIT 1
Tried #safecase code like this, replacing this commented block:
/*************** IT DOESN'T WORK AT ALL ***************
[toView setUserInteractionEnabled:NO];
[UIView setAnimationDelegate: toView];
[UIView setAnimationDidStopSelector:#selector(setUserInteractionEnabled:)];
[toView setUserInteractionEnabled:YES];
*************** IT DOESN'T WORK AT ALL ***************/
// Remove the interaction
[toView setUserInteractionEnabled:NO];
[fromView setUserInteractionEnabled:NO];
// Create the animation
[UIView animateWithDuration:0.4 animations:^{
[fromView performSelector:#selector(removeFromSuperview)];
}
completion:^(BOOL finished){
[UIView animateWithDuration:0.4
animations:^{
C6Log(#"finished");
[toView performSelector: #selector(setUserInteractionEnabled:)];
}];
}];
The "toView" is removed instead of the "fromView" is removed :(
The buttons continue to be interactive during the animation
Do you know beginIgnoringInteractionEvents and endIgnoringInteractionEvents?
Normally, if you don't want any userInteraction during an animation, you would use those.
Anyway you still need correct callbacks to trigger them.
You need to define your own method, e.g. remove: and pass that as the selector. In the method, just use the passed UIView to remove it.
-(void)remove:(id)sender {
UIView *v = (UIView*)sender;
[v removeFromSuperview];
}
You can use this:
[UIView animateWithDuration:0.4
animations:^{ [self performSelector:#selector(removeFromSuperview)]; // other code here}
completion:^(BOOL finished){ [UIView animateWithDuration:0.4
animations:^{ [self performSelector:#selector(setUserInteractionEnabled:)]; //other code here}]; }];
Hope helpful.
I think u can use to enable user interaction
self.view.userInteractionEnabled=NO;
I ended up creating a Category extension to UIView… and it finally works!
UIView+Animated.h code
#import <UIKit/UIKit.h>
#interface UIView (Animated)
- (void) finishedAnimation;
#end
UIView+Animated.m code
#import "UIView+Animated.h"
#implementation UIView (Animated)
- (void) finishedAnimation{
C6Log(#"FinishedAnimation!");
[self removeFromSuperview];
[[UIApplication sharedApplication] endIgnoringInteractionEvents];
}
#end
Then, I #imported this extension in my coordinating controller:
C6CoordinatingController.h partial code
#import "UIView+Animated.h"
And called the selector in setAnimationDidStopSelector:
C6CoordinatingController.m partial code
// Create the delegate, so the "fromView" is removed after the transition
[UIView setAnimationDelegate: fromView];
// Ignore interaction events during the animation
[[UIApplication sharedApplication] beginIgnoringInteractionEvents];
// Set the transition duration
[UIView setAnimationDuration: 0.4];
// Call UIView+Animated "finishedAnimation" method when animation stops
[UIView setAnimationDidStopSelector:#selector(finishedAnimation)];
So, I ended up using #jaydee3 and #Mundi concepts and it works like a charm!
Thank you guys!
I am trying to perform multiple UIView animations one after the other. However, I've heard that it's bad practice to perform multiple UIView animations one after the other, and that I should instead use Core Animation. I tried this code:
//First Animation
[UIView beginAnimations:#"animation1" context:nil];
[UIView setAnimationDuration:2];
nwView.backgroundColor = [UIColor redColor];
nwView.frame = CGRectMake(CGRectGetMidX(screenSize),
CGRectGetMinY(screenSize),
width,
height);
nwView.transform = CGAffineTransformMakeRotation(45.0f);
[UIView commitAnimations];
//Second Animation
[UIView beginAnimations:#"second animation" context:nil];
[UIView setAnimationDuration:2];
nwView.transform = CGAffineTransformMakeScale(0.5, 0.33);
nwView.backgroundColor = [UIColor purpleColor];
[UIView commitAnimations];
But it only does the second animation. I know this question is similar to UIView two animations coexisting, but it has a slightly different context.
I don't think there is anything wrong with doing 2 animations in a row using UIView blocks. Just make sure you start your second animation in the completino block of the first animation.
Without blocks (your example) it is not working as you will have to set a delegate to the animation or set a selector for setAnimationDidStopSelector. There you should start the second animation.
But again, nothing wrong in doing animations with blocks (it is the preferred way).
If you are looking to do multiple animations right after another this is not the way to do it. The code you posted with execute at almost the same time, meaning the animations would be performed at about the same time.
Instead what you should do is set the delegate for the first animation, and then do the first animation. Then when the animationDidStop method is called for the first animation, you should do the second animation. This makes sure they are one after another.
This is how you would do it, assuming you call doMyAnimations to start the animation.
-(void)doMyAnimations{
//First Animation
[UIView beginAnimations:#"animation1" context:nil];
[UIView setAnimationDuration:2];
[UIView setAnimationDelegate:self];
nwView.backgroundColor = [UIColor redColor];
nwView.frame = CGRectMake(CGRectGetMidX(screenSize),
CGRectGetMinY(screenSize),
width,
height);
nwView.transform = CGAffineTransformMakeRotation(45.0f);
[UIView commitAnimations];
}
- (void)animationWillStart:(NSString *)animationID context:(void *)context{
}
- (void)animationDidStop:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context{
if([animationID isEqualToString:#"animation1"]){
//Second Animation
[UIView beginAnimations:#"second animation" context:nil];
[UIView setAnimationDuration:2];
nwView.transform = CGAffineTransformMakeScale(0.5, 0.33);
nwView.backgroundColor = [UIColor purpleColor];
[UIView commitAnimations];
}
}
Keep in mind that the nwView would have to be accessible throughout the entire class. If it isn't you can either make it an instance variable, or find another way to get access to it in the animationDidStop method.
You can use blocks for this purpose and get a very clean result.
NSMutableArray* animationBlocks = [NSMutableArray new];
typedef void(^animationBlock)(BOOL);
// getNextAnimation
// removes the first block in the queue and returns it
animationBlock (^getNextAnimation)() = ^{
animationBlock block = (animationBlock)[animationBlocks firstObject];
if (block){
[animationBlocks removeObjectAtIndex:0];
return block;
}else{
return ^(BOOL finished){};
}
};
//add a block to our queue
[animationBlocks addObject:^(BOOL finished){;
[UIView animateWithDuration:1.0 animations:^{
//...animation code...
} completion: getNextAnimation()];
}];
//add a block to our queue
[animationBlocks addObject:^(BOOL finished){;
[UIView animateWithDuration:1.0 animations:^{
//...animation code...
} completion: getNextAnimation()];
}];
//add a block to our queue
[animationBlocks addObject:^(BOOL finished){;
NSLog(#"Multi-step Animation Complete!");
}];
// execute the first block in the queue
getNextAnimation()(YES);
Taken from: http://xibxor.com/objective-c/uiview-animation-without-nested-hell/
In iOS, how can one briefly draw attention to an object on screen? Suppose, create a brief glow or cause a shadow to appear and then disappear?
For the purposes of this question, let's define "object on screen" as an instance of UIImageView.
Also, if possible provide an example of how to draw attention to a button.
Most people list code, but I'm sticking to describing some examples;
I've seen objects briefly grow and shrink back to their normal size to draw attention
Bejeweled (a Popcap game) lets diamonds briefly 'shine' (as if sunlight passed over it) to give you a subtle hint
I've seen certain applications use a hand or a fictive character point to a certain object briefly
And of course, you could always introduce a talking paperclip to tell you what's what.
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.1f];
yourView.transform = CGAffineTransformMakeScale(1.1, 1.1);
[UIView commitAnimations];
Or, of course the same thing with a block animations. And after the attention got away from your view you can use :
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.1f];
yourView.transform = CGAffineTransformIdentity;
[UIView commitAnimations];
Here is a simple hop animation...
- (void)drawAttn
{
float jumpHeight = 20.0;
CGPoint originalPoint = objectForAttn.center;
CGPoint jumpPoint = CGPointMake(objectForAttn.center.x, objectForAttn.center.y - jumpHeight);
[UIView animateWithDuration:0.20 delay:0.0 options:UIViewAnimationOptionAutoreverse animations:^{
[objectForAttn setCenter:jumpPoint];
} completion:^(BOOL finished) {
/* do other stuff after hop */
}];
}
My app QCount (free in the store, tap a "wrong" number 3 times) uses a fade animation as follows:
(note I wrote this when I was REALLY new to iOS, so there is probably a more compact way to write it)
aLabel = // a UILabel I get from somewhere
aColor = aLabel.backgroundColor;
[UIView animateWithDuration:0.2
delay: 0.0
options: UIViewAnimationOptionCurveEaseOut
animations:^{
aLabel.alpha = 0.0;
}
completion:^(BOOL finished){
// Wait .2 seconds and then fade in the view
[UIView animateWithDuration:.2
delay: 0.0
options:UIViewAnimationOptionCurveEaseIn
animations:^{
aLabel.alpha = 1.0;
}
completion:nil];
}];
There are lots of options: hopping, underlining, vibrating, blinking, rotating, scaling, endarkening around, and their combinations.
But IMO, shine effect on "slide to unlock" text is excellent.
You can check it out here:
iPhone "slide to unlock" animation
I wanted to draw attention to a label whose value had changed. This simple animation produces a nice 'I've changed' animation...
//copy the label
UILabel *newPageLabel = [[UILabel alloc] initWithFrame:_countLabel.frame];
[newPageLabel setFrame:CGRectOffset(newPageLabel.frame, 0, 0)];
newPageLabel.text = _countLabel.text;
newPageLabel.textAlignment = _countLabel.textAlignment;
newPageLabel.backgroundColor = _countLabel.backgroundColor;
newPageLabel.textColor = _countLabel.textColor;
newPageLabel.font = _countLabel.font;
//scale and fade out the copied label
[self.navigationController.toolbar addSubview:newPageLabel];
[UIView animateWithDuration:0.5
delay:0.0
options:UIViewAnimationOptionLayoutSubviews
animations:^{
newPageLabel.transform = CGAffineTransformMakeScale(2,2);
newPageLabel.alpha = 0;
}
completion:^(BOOL finished){
[newPageLabel removeFromSuperview];
}
];