首页 > 代码库 > View切换效果

View切换效果

视图翻转切换效果

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
@implementation FlipView
- (void) touchesEnded:(NSSet*)touches withEvent:(UIEvent*)event {
    // Start Animation Block
    CGContextRef context = UIGraphicsGetCurrentContext();
    [UIView beginAnimations:nil context:context];
    [UIView setAnimationTransition:
        UIViewAnimationTransitionFlipFromLeft
        forView:[self superview] cache:YES];
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
    [UIView setAnimationDuration:1.0];
    // Animations
    [[self superview] exchangeSubviewAtIndex:0 withSubviewAtIndex:1];
    // Commit Animation Block
    [UIView commitAnimations];
}
@end
 

视图翻页过渡效果

 
1
2
3
4
5
6
7
8
9
10
11
12
CGContextRef context = UIGraphicsGetCurrentContext();
[UIView beginAnimations:nil context:context];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDuration:1.0];
// Apply the animation to the backdrop
[UIView setAnimationTransition:
    UIViewAnimationTransitionCurlUp
    forView:myView cache:YES];
// Exchange the two foreground views
[myView exchangeSubviewAtIndex:0
    withSubviewAtIndex:1];
[UIView commitAnimations];

 

视图淡入淡出效果

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
- (void) fadeOut: (id) sender {
    CGContextRef context = UIGraphicsGetCurrentContext();
    [UIView beginAnimations:nil context:context];
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
    [UIView setAnimationDuration:1.0];
    [[self.view viewWithTag:999] setAlpha:0.0f];
    [UIView commitAnimations];
    self.navigationItem.rightBarButtonItem = BARBUTTON(@”Fade In”,@selector(fadeIn:));
}
 
- (void) fadeIn: (id) sender {
    CGContextRef context = UIGraphicsGetCurrentContext();
    [UIView beginAnimations:nil context:context];
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
    [UIView setAnimationDuration:1.0];
    [[self.view viewWithTag:999] setAlpha:1.0f];
    [UIView commitAnimations];
    self.navigationItem.rightBarButtonItem = BARBUTTON(@”Fade Out”,@selector(fadeOut:));
}
 
- (void) viewDidLoad {
    self.navigationItem.rightBarButtonItem = BARBUTTON(@”Fade Out”,@selector(fadeOut:));
}
 
@end
 

让视图慢慢消失的效果

在调用 removeFromSuperview 的时候,当前视图会突然消失,这样显得很不友好。这段代码能够让视图慢慢消失。
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
//
//  UIView+JTRemoveAnimated.h
//
//  Created by james on 9/1/11.
//  http://ioscodesnippet.tumblr.com/
//
@interface UIView (JTRemoveAnimated)
 
- (void)removeFromSuperviewAnimated;
 
@end
 
 
//
//  UIView+JTRemoveAnimated.m
//
//  Created by james on 9/1/11.
//  http://ioscodesnippet.tumblr.com/
//
#import <QuartzCore/QuartzCore.h>
 
@implementation UIView (JTRemoveAnimated)
 
// remove static analyser warnings
#ifndef __clang_analyzer__
 
- (void)animationDidStop:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context {
    if ([animationID isEqualToString:@"fadeout"]) {
        // Restore the opacity
        CGFloat originalOpacity = [(NSNumber *)context floatValue];
        self.layer.opacity = originalOpacity;
        [self removeFromSuperview];
        [(NSNumber *)context release];
    }
}
 
- (void)removeFromSuperviewAnimated {
    [UIView beginAnimations:@"fadeout" context:[[NSNumber numberWithFloat:self.layer.opacity] retain]];
    [UIView setAnimationDuration:0.3];
    [UIView setAnimationDidStopSelector:@selector(animationDidStop:finished:context:)];
    [UIView setAnimationDelegate:self];
    self.layer.opacity = 0;
    [UIView commitAnimations];
}
 
#endif
 
@end
 
 

使用 Core Animation 制作视图过渡动画

 
1
2
3
4
5
6
7
8
9
10
11
CATransition *animation = [CATransition animation];
animation.delegate = self;
animation.duration = 1.0f;
animation.timingFunction = UIViewAnimationCurveEaseInOut;
animation.type = kCATransitionMoveIn;
animation.subtype = kCATransitionFromTop;
 
// Perform some kind of view exchange or removal here, for example
[myView exchangeSubviewAtIndex:0 withSubviewAtIndex:1];
 
[myView.layer addAnimation:animation forKey:@"move in"];