Change Transition Tint/Fade Colour of UIViewAnimationOptionTransitionFlipFromLeft - ios

I'm switching between two container views in my program with UIViewAnimationOptionTransitionFlipFromLeft as such:
[UIView transitionWithView:self.view
duration:1.0
options:UIViewAnimationOptionTransitionFlipFromLeft
animations:^{
self.timerPage.hidden = true;
self.countdownPage.hidden = false;
} completion:nil
];
It works fine but what bugs me is the fact that my views are faded in and out to black, i would like the colour instead to be white. I've searched various threads but i couldn't find a solution to this exact problem.
I can't upload an image yet but the image in this question shows exactly what I'm talking about. The view fades to black during transition: UIView transitionFromView: how can I do black background during transition?

You can get the behavior you want by adding a subview or sublayer to your view with a clear background color and then setting the background color of that to white in your animation block.
UIView *whiteView = [[UIView alloc] init];
whiteView.frame = self.button.bounds;
[self.button addSubview:whiteView];
[UIView animateWithDuration:0.45 animations:^{
whiteView.backgroundColor = [UIColor whiteColor];
}];

Related

Animate image change of UIImageView when having an UIVisualEffectView above

My problem is as follows:
An UIImageView's view is going to be changed with an animation, like this:
[UIView transitionWithView:_backgroundArtworkImageView
duration:ANIMATION_DURATION
options:UIViewAnimationOptionTransitionCrossDissolve
animations:^{
_backgroundArtworkImageView.image = blurredImage;
}
completion:nil];
It works perfectly fine as long as I don't have an UIVisualEffectView over the image view. If using the blur view on top, it results in no animation at all.
I've looked around for a bit and seen that snapshots of views could be something to look into, which also seems to be what Apple uses internally on iOS, for example when bringing up the app switcher; I'm not really sure how exactly to approach it though.
Got it working by taking a snapshot, append it to the superview, hide the real view, change it without animation and then fade the real view in with animation.
__block UIView *snapshot = [_backgroundArtworkImageView snapshotViewAfterScreenUpdates:NO];
[_artworkContainer insertSubview:snapshot belowSubview:_backgroundArtworkImageView];
_backgroundArtworkImageView.alpha = 0.0f;
_backgroundArtworkImageView.image = blurredImage;
[UIView transitionWithView:_artworkContainer
duration:ANIMATION_DURATION
options:UIViewAnimationOptionTransitionCrossDissolve
animations:^{
_backgroundArtworkImageView.alpha = 1.0f;
}
completion:^(BOOL _) {
[snapshot removeFromSuperview];
snapshot = nil;
}];
Edit: I realized that the blur view was taking a small time to update, but to solve that a new snapshot of the resulting view could be taken and then animated with.

IOS: Transition with modal ViewContorller

I have custom action sheet that I create as VC. I present it with 'overCurrentContex' with the code
[self presentViewContoller:myVC animated:YES completion:nil];
I need to add dark background to it.
I added it with code
self.view.backgroundColor = [UIColor colorWithWhite:0.5 alpha:0.5];
But as I present it modally it slides from the bottom with my dark backgroundColor.
I need that this color appears like Fade.
How can I do it? I need to add custom transition to it?
As I understand it, you're wanting to have the ViewController slide up from the bottom then have the background color change (transition) to a darker color of your choice?
I'd probably use the alpha value of the background and animate it to become more opaque to achieve that effect.
Here's a possible animation of the alpha value using an animation block:
self.view.alpha = 0.0f;
float alphaValue = 1.0f;
[UIView animateWithDuration:1.0 delay:0.0 options:UIViewAnimationOptionCurveEaseInOut
animations:^(void) {
//The stuff you want to animate
self.view.alpha = alphaValue;
}
completion:^(BOOL finished){
//anything you want to do right after the animation is done
}];

UIView Animation not behaving properly

I have a UIButton (size 100,100) with text and a colored background. When the button is pressed, I want the text to disappear immediately and the button to change size, animated, to 1000,1000. Here is the code I'm using:
[myButton setTitleColor:[UIColor colorWithRed:195/255.0f green:255/255.0f blue:180/255.0f alpha:0.0f] forState:UIControlStateNormal];
[UIView animateWithDuration:2.0f
delay:1.0f
options:UIViewAnimationCurveEaseInOut
animations:^{
[myButton setBounds:CGRectMake(0, 0, 1000, 1000)];
}
completion:^(BOOL finished){
SetupView * sv = [[SetupView alloc] initWithNibName:nil bundle:nil];
//[self presentViewController:sv animated:NO completion:nil];
}
];
Now, if I take out setTitleColor, the button expands just fine, but the text is still there (obviously). However, keeping setTitleColor in makes the button size 0,0 and then animates to 100,100. This also happens when I replace setTitleColor with setTitle:#"". I've also tried changing the text or color in the animation with the same result.
I feel like it's something obvious I've missed, but I can't seem to see it.
edit: If I don't run the animation and just do setTitleColor or setTitle:#"" by themselves, the text disappears as expected and the button stays the same size.
If you want to preserve the way you used UIKit to style your button, just modify the layer in the animation block, not the view.
button.layer.transform = CATransform3DMakeScale(10,10,1)
Maybe it is even sufficient to use the view's transform property.
button.transform = CGAffineTransformMakeScale(10,10)
NB 10 is just an arbitrary large value.

Fading from one view to another without transitioning through black

I am trying to fade one view in while fading the other out using animateWithDuration and changing the alpha values of each. The problem I'm having is that the views seem to fade through a black background. I would like to keep the transitioning background a white color being that both of my views have white backgrounds.
How can I fade between my two views without transitioning through a black background?
Here's my code:
[self.view1 setAlpha:0.0];
[self.view addSubview:self.view1];
[UIView animateWithDuration:0.5
animations:^{self.view1.alpha = 1.0;self.view2.alpha = 0.0;}
completion:^(BOOL finished){[self.view2 removeFromSuperview];}];
How about something like this:
[UIView transitionWithView:self.view
duration:0.4
options:UIViewAnimationOptionTransitionCrossDissolve
animations:^{
[self.view addSubview:self.view1];
}
completion:^(BOOL finished) {
[self.view2 removeFromSuperview];
}];
Use: animateWithDuration:animations:completion:
Set the new image view alpha to 0.
Place the new image view in front of the current image view.
In animations: set alpha of the new image view to 1.0.
In completion: handler cleanup how ever you want.

How do I perform these animated view transitions?

I am brand new to Core Animation, and I need to know how to do 2 animations:
I need to switch XIBs by fading through black (fully releasing the the first view controller)
I need to mimic the UINavigationController's pushViewController animation (switching XIBs and releasing the first view controller)
How can you achieve these animated view transitions?
I've done both of these animations, but maybe not in the exact way you are looking for.
Fade View to black, I took this the other way an instead added a new
subview that covered the entire window that was Black and animated
the Alpha from 0.0 to 1.0. Made for a nice effect.
[UIView animateWithDuration:0.5
animations:^{ _easterEgg.alpha = 1.0; }
completion:^(BOOL finished) { [self animateIndex:0]; }];
Slide in a view like UINavigationController. I didn't do this exactly like UINavigationController since it does multiple animations, but I did have a new view slide the previous view off screen. This code sets the frame of the new view off screen to the right of the current view, builds a frame location that is off the screen to the left, and grabs the current visible frame. Finally it just animates the new view from off screen right into the visible frame, and the old view from the visible frame to off left. Then removes the old view.
CGRect offRight = CGRectMake(_contentView.frame.size.width,
0,
_contentView.frame.size.width,
_contentView.frame.size.height);
CGRect offLeft = CGRectMake(-_contentView.frame.size.width,
0,
_contentView.frame.size.width,
_contentView.frame.size.height);
CGRect visibleFrame = CGRectMake(0, 0, _contentView.frame.size.width, _contentView.frame.size.height);
[view setFrame:offRight];
UIView *currentView = [[_contentView subviews] lastObject];
[_contentView addSubview:view];
[UIView animateWithDuration:0.5
animations:^{
[currentView setFrame:offLeft];
[view setFrame:visibleFrame];
}
completion:^(BOOL finished) {
[currentView removeFromSuperview];
}];

Resources