Fade-in / fade-out during an interface rotation - iphone

When my iPhone interface rotates, I would like to do a fade-in/fade-out for a specific UIView of a UIViewController... Like...
- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration
{
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.3];
theView.alpha = 0;
[UIView commitAnimations];
}
- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation
{
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.3];
theView.alpha = 1;
[UIView commitAnimations];
}
But the animation doesn't finish before the rotation start (we can see the view starting to self-resize)...
Is there a way to delay rotation start ?
"duration" is the duration of the rotating animation, right ?

I found that running the current run loop for the same amount of time as the preceding animation, did in fact delay the rotation.
- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration
{
[UIView animateWithDuration:0.25 animations:^{
theview.alpha = 0.0;
}];
[[NSRunLoop currentRunLoop] runUntilDate:[NSDate dateWithTimeIntervalSinceNow:0.25]];
}

Your problem stems from the fact that by the time willRotateToInterfaceOrientation: is called, the view being rotated already has its orientation property set and the animation block handling the rotation is also ready to run on a separate thread. From the documentation:
This method is called from within the animation block used to rotate the view. You can override this method and use it to configure additional animations that should occur during the view rotation.
I would suggest overriding the shouldAutorotateToInterfaceOrientation: method to fire your animation before returning YES for supported orientations:
- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
// Return YES for supported orientations
if (interfaceOrientation == (UIDeviceOrientationPortrait || UIDeviceOrientationPortraitUpsideDown) {
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.3];
theView.alpha = 0;
[UIView commitAnimations];
} else {
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.3];
theView.alpha = 1;
[UIView commitAnimations];
}
return YES;
}
This should ensure the animation runs before you ever set the orientation of UIViewController and fire the rotation animation. You may have to add a slight delay to get the effect your are looking for depending on the device hardware speed.

Related

How to unhide view with animations

Say I have a hidden view in Xcode for iOS. Now, when I set the view to not hidden (view.hidden=NO), how can I make it so that it now appears, but with animations?
What you probably want is not to set view.hidden, but to set view.alpha to 0 (corresponds to hidden = YES) or 1 (hidden = NO).
You can then use implicit animations to show the view, e.g
[UIView animateWithDuration:0.3 animations:^() {
view.alpha = 1.0;
}];
If you want other animations than only fading then use this method
[UIView transitionWithView:_yourView duration:1.0 options:UIViewAnimationOptionTransitionCurlDown animations:^(void){
[_yourView setHidden:NO];
} completion:nil];
For a fade, you can adjust the alpha property of the view.
myView.alpha = 0;
[UIView animateWithDuration:0.5 animations:^{
myView.alpha = 1;
}];
That will apply a fade in over 0.5 seconds to the view myView. Many UIView properties are animatable; you aren't just limited to alpha fades. You can change background colours, or even rotate and scale a view, with animation. If you need further control and advanced animation, you can then move into Core Animation - a much more complex animation framework.
-(void)showView{
[UIView beginAnimations: #"Fade Out" context:nil];
[UIView setAnimationDelay:0];
[UIView setAnimationDuration:.5];
//show your view with Fade animation lets say myView
[myView setHidden:FALSE];
[NSTimer scheduledTimerWithTimeInterval:1.0 target:self selector:#selector(hideView) userInfo:nil repeats:YES];
[UIView commitAnimations];
}
-(void)hideView{
[UIView beginAnimations: #"Fade In" context:nil];
[UIView setAnimationDelay:0];
[UIView setAnimationDuration:.5];
//hide your view with Fad animation
[myView setHidden:TRUE];
[UIView commitAnimations];
}
OR you can try this way
self.yourView.alpha = 0.0;
[UIView beginAnimations:#"Fade-in" context:NULL];
[UIView setAnimationDuration:1.0];
self.yourView.alpha = 1.0;
[UIView commitAnimations];

iphone view overlay

I have a client who recently requested this:
My thoughts were that the text could be better displayed on the back of a flipover view and that it looks like it could be an issue in the approval process. Is There any way to even do this, do I even want to try? Are there resources you can share?
Thanks in advance.
EDIT: I should clarify that the NavigationBar and the Table would slide over when taping the picture behind. One tap would make it show and the other tap would make the bar and the table hide.
This is actually pretty good. It's often hard to get clients to give you requirements, and this at least shows you what they're trying to achieve. I'd spend some time reworking the UI so that it will be acceptable in the app store (assuming you're going to publish there) and perhaps more in keeping with the normal use of iOS UI elements. Prepare to give your client a bit of an explanation about why this particular design leaves something to be desired, but try to come up with a design that they'll agree is obviously better. (There's plenty of room for improvement here, so it shouldn't be too hard.)
If your client is absolutely wedded to this exact UI, it might be time to find a new client. But if they're reasonable, thoughtful, and a little bit flexible, this might be the beginning of a nice app.
You can do this. Put the picture (UIImageView) inside a wrapper UIView. Put the text in a UITextView also in the wrapper UIView. Then animate a flip transition between them that brings whichever one you want to the bottom of the subview stack.
You can check for potential UI violations in Apple's HIG: http://developer.apple.com/library/ios/#documentation/UserExperience/Conceptual/MobileHIG/Introduction/Introduction.html
+(id)showAlert{
UIViewController *controller = [[UIViewController alloc] initWithNibName:#"Overlay" bundle:nil];
Overlay *alert = (Overlay*)controller.view;
//alert.iTag = iiTag;
alert.tag = iiTag;
return alert;
}
-(void)addAnimation{
self.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0.001, 0.001);
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.3/1.5];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(bounce1AnimationStopped)];
self.transform = CGAffineTransformScale(CGAffineTransformIdentity, 1.1, 1.1);
[UIView commitAnimations];
}
- (void)bounce1AnimationStopped {
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.3/2];
[UIView setAnimationDelegate:self];
[UIView setAnimationDidStopSelector:#selector(bounce2AnimationStopped)];
self.transform = CGAffineTransformScale(CGAffineTransformIdentity, 0.9,0.9);
[UIView commitAnimations];
}
- (void)bounce2AnimationStopped {
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.3/2];
self.transform = CGAffineTransformIdentity;
[UIView commitAnimations];
}
- (CGAffineTransform)transformForOrientation {
UIInterfaceOrientation orientation = [UIApplication sharedApplication].statusBarOrientation;
if (orientation == UIInterfaceOrientationLandscapeLeft) {
return CGAffineTransformMakeRotation(M_PI*1.5);
} else if (orientation == UIInterfaceOrientationLandscapeRight) {
return CGAffineTransformMakeRotation(M_PI/2);
} else if (orientation == UIInterfaceOrientationPortraitUpsideDown) {
return CGAffineTransformMakeRotation(-M_PI);
} else {
return CGAffineTransformIdentity;
}
}
-(void)stopAnimatton{
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:1.0];
[UIView setAnimationDelay:2.0];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDelegate:self];
self.transform = CGAffineTransformMake(00.1, 00.1,0.001, 0.001, 0.001, 0.001);
[UIView commitAnimations];
}

animate textlabel in uitableviewcell using willTransitionToState

I am trying to animate the textlabel in a UItableviewcell when I press the edit button.
I am trying to make it fade out and fade in.
fading in works but when I press 'edit' the textlabel disappears and when I press on 'done' I fades in just perfectly.
Can anyone tell me why it isn't working?
thanks in advance
- (void)willTransitionToState:(UITableViewCellStateMask)state {
[super willTransitionToState:state];
if ((state & UITableViewCellStateEditingMask) || (state & UITableViewCellStateShowingDeleteConfirmationMask)) {
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.3];
label.alpha = 0.0;
[UIView commitAnimations];
}
}
- (void)didTransitionToState:(UITableViewCellStateMask)state {
[super didTransitionToState:state];
if (!(state & UITableViewCellStateEditingMask) && !(state & UITableViewCellStateShowingDeleteConfirmationMask)) {
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.5];
label.alpha = 1.0;
[UIView commitAnimations];
}
}
I noticed that when entering willTransitionToState that animations were disabled. The following fixed it.
- (void)willTransitionToState:(UITableViewCellStateMask)state
{
[super willTransitionToState:state];
//Should be enabled by default...but apparently not
[UIView setAnimationsEnabled:YES];
...
}
From everything I had read I thought for sure the willTransitionToState was the way to go. It even works perfectly if you use didTransitionToState though the transition starts after the normal editing transition finishes.
As it turns out I think you want to use setEditing
- (void)setEditing:(BOOL)editing animated:(BOOL)animate
{
[super setEditing:editing animated:animate];
if(editing) {
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.3];
label.alpha = 0.0;
[UIView commitAnimations];
} else {
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.3];
label.alpha = 1.0;
[UIView commitAnimations];
}
}

Animate resize of view during rotation without autoresize

If I set the AutoResize mask of my view, then they will resize together with the main window during device rotation.
Is there a way to get the same smooth performance by using my own animation and no autoresize?
Yes, you can certainly use UIView animations to move elements around.
Also, a common technique is to hide the interface as part of
- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration
redraw it and show it as part of
- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation
Here is an example:
- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration {
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.3f];
self.myTable.hidden = YES;
...
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
[UIView commitAnimations];
}
- (void)didRotateFromInterfaceOrientation:(UIInterfaceOrientation)fromInterfaceOrientation {
[self redrawInterface];
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationDuration:0.3f];
self.myTable.hidden = NO;
...
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
[UIView commitAnimations];
}

orientation change

I need to show fade-in kind of transition effects while the view changes its orientation from one mode to other. Can anyone suggest me how to get that?
I would use an animation block inside of this method like so:
- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration {
[UIView beginAnimations:#"InterfaceFade" context:nil];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationDuration:duration];
// Change properties to animate here (Ex: view.alpha = 0.0)
[UIView commitAnimations];
}