IOS轉(zhuǎn)場動(dòng)畫

最近項(xiàng)目做完了崭别,就進(jìn)入無休止的修改中了树酪。也順便在看swift择镇。學(xué)到了兩個(gè)轉(zhuǎn)場動(dòng)畫压恒,也給大家看看
PS:其實(shí)我一直以為轉(zhuǎn)場動(dòng)畫又難又不實(shí)用影暴,哈哈

轉(zhuǎn)場動(dòng)畫1: (先看效果圖)

XXX.gif

這種轉(zhuǎn)場方式跟boss直聘的應(yīng)該差不多怖亭,所有就收集了

屏幕快照 2017-01-09 下午4.52.28.png

先說說建的類的用處吧: ViewController:第一個(gè)控制器 BViewController:push出來的第二個(gè)控制器 PushAnimateion:繼承NSObject的工具類,用于修改push動(dòng)畫 PopAnimateion:繼承NSObject的工具類坤检,用于修改Pop動(dòng)畫
下面給出ViewController里面代碼和PushAnimateion里面具體代碼兴猩,另外兩個(gè)類似,只上截圖早歇。另外倾芝,ViewController的導(dǎo)航欄是在storyboard里面直接加的 ViewController .m:

#import "ViewController.h"
#import "BViewController.h"
#import "PushAnimateion.h"

@interface ViewController ()<UINavigationControllerDelegate>

@end

@implementation ViewController

//這個(gè)控制器的代理一定要在viewWillAppear里面設(shè)置
//因?yàn)槊看蝡ush的時(shí)候控制器不會(huì)dealloc
//所以如果寫在viewDidLoad里面的話在pop回來的時(shí)候就不會(huì)再次執(zhí)行代理,動(dòng)畫就會(huì)失效
- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    self.navigationController.delegate = self;
}

- (void)viewDidLoad {
    [super viewDidLoad];
    
    //設(shè)置背景圖片
    self.view.layer.contents = (__bridge id _Nullable)([UIImage imageNamed:@"4"].CGImage);
    
    self.navigationController.navigationBar.hidden = YES;
}

- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {
    BViewController *view = [BViewController new];
    [self.navigationController pushViewController:view animated:YES];
}

//需要返回的是一個(gè)id類型的且遵循UIViewControllerAnimatedTransitioning協(xié)議的
- (nullable id <UIViewControllerAnimatedTransitioning>)navigationController:(UINavigationController *)navigationController
                                            animationControllerForOperation:(UINavigationControllerOperation)operation
                                                         fromViewController:(UIViewController *)fromVC
                                                           toViewController:(UIViewController *)toVC {
    //根據(jù)類型返回對(duì)應(yīng)動(dòng)畫
    if (operation == UINavigationControllerOperationPush) {
        return [PushAnimateion new];
    }else {
        return nil;
    }
}

@end

PushAnimateion里面代碼:

//這是.h里面的箭跳,要遵循這個(gè)協(xié)議晨另,不然UINavigationControllerDelegate返回這個(gè)類的對(duì)象會(huì)報(bào)錯(cuò),所以寫在.h里面
#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>

@interface PushAnimateion : NSObject<UIViewControllerAnimatedTransitioning>

@end

//.m里面代碼
#import "PushAnimateion.h"

#define WIDTH [UIScreen mainScreen].bounds.size.width
#define HEIGHT [UIScreen mainScreen].bounds.size.height

@interface PushAnimateion ()<CAAnimationDelegate>

@property (nonatomic, retain) id<UIViewControllerContextTransitioning> transitionContext;

@end

@implementation PushAnimateion

- (NSTimeInterval)transitionDuration:(id<UIViewControllerContextTransitioning>)transitionContext {
    return .5;
    
}

- (void)animateTransition:(id<UIViewControllerContextTransitioning>)transitionContext {
    self.transitionContext = transitionContext;
    
    UIViewController *toVC = [transitionContext viewControllerForKey:UITransitionContextToViewControllerKey];
    UIViewController *fromVC = [transitionContext viewControllerForKey:UITransitionContextFromViewControllerKey];
    
    [[transitionContext containerView] addSubview:fromVC.view];
    [[transitionContext containerView] addSubview:toVC.view];
    
    UIBezierPath *starPath = [UIBezierPath bezierPathWithRect:CGRectMake(0, HEIGHT*0.5, WIDTH, 1)];
    UIBezierPath *endPath  = [UIBezierPath bezierPathWithRect:CGRectMake(0, 0, WIDTH, HEIGHT)];
    
    CAShapeLayer *maskLayer = [[CAShapeLayer alloc]init];
    maskLayer.path = endPath.CGPath;
    toVC.view.layer.mask = maskLayer;
    
    CABasicAnimation *animate = [CABasicAnimation animationWithKeyPath:@"path"];
    animate.fromValue = (__bridge id _Nullable)(starPath.CGPath);
    animate.toValue = (__bridge id _Nullable)(endPath.CGPath);
    animate.duration = [self transitionDuration:transitionContext];
    animate.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    animate.delegate = self;
    [maskLayer addAnimation:animate forKey:@"path"];
}

- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag {
    [self.transitionContext completeTransition:![self.transitionContext transitionWasCancelled]];
    
    [self.transitionContext viewControllerForKey:UITransitionContextToViewControllerKey].view.layer.mask = nil;
    [self.transitionContext viewControllerForKey:UITransitionContextFromViewControllerKey].view.layer.mask = nil;
}

@end

如果建的類名相同谱姓,可以直接把代碼拖到項(xiàng)目里借尿,代碼都拷貝齊全的 下面給兩張圖片是BViewController的m文件和PopAnimateion的m文件。PopAnimateion的h文件里跟PushAnimateion里面是一樣的屉来,代碼基本一樣路翻,可以復(fù)制過去直接用

屏幕快照 2017-01-09 下午5.05.36.png

屏幕快照 2017-01-09 下午5.05.50.png

該項(xiàng)目有一點(diǎn)點(diǎn)小bug,就是pop回來的時(shí)候會(huì)閃一下茄靠,求大神解決了告知茂契,??

轉(zhuǎn)場動(dòng)畫2:

xx.gif

這個(gè)效果是系統(tǒng)自帶的動(dòng)畫,做的比較粗糙慨绳,需要使用的朋友可以自己再修復(fù)一下 這個(gè)比較簡單掉冶,直接上代碼然后說一下就好了

rootViewController的.m里面代碼

#import "ViewController.h"
#import "AViewController.h"
#import "BViewController.h"

@interface ViewController ()

@property (nonatomic, assign) NSInteger currentChildNumber;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.currentChildNumber = 0;
    [self addChildViewController:[AViewController new]];
    [self addChildViewController:[BViewController new]];
    
    [self.view addSubview:self.childViewControllers.firstObject.view];
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(getNotification) name:@"push" object:nil];
}

- (void)getNotification {
    [self transitionFromViewController:self.currentChildNumber == 0 ? self.childViewControllers.firstObject : self.childViewControllers.lastObject
                      toViewController:self.currentChildNumber == 1 ? self.childViewControllers.firstObject : self.childViewControllers.lastObject
                              duration:1
                               options:self.currentChildNumber == 0 ? UIViewAnimationOptionTransitionFlipFromLeft : UIViewAnimationOptionTransitionFlipFromRight
                            animations:nil
                            completion:nil];
    self.currentChildNumber = (self.currentChildNumber + 1) % 2;
}

@end

只需要另外新建兩個(gè)控制器,在touchBegin里面發(fā)個(gè)通知脐雪,這里接收就OK

需要代碼的可以加群:515385179(群里都沒有人厌小,來點(diǎn)大神救救我吧??)
我是小白,有沒有收徒的战秋,我報(bào)名??

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末璧亚,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子获询,更是在濱河造成了極大的恐慌涨岁,老刑警劉巖,帶你破解...
    沈念sama閱讀 211,561評(píng)論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件吉嚣,死亡現(xiàn)場離奇詭異梢薪,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)尝哆,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,218評(píng)論 3 385
  • 文/潘曉璐 我一進(jìn)店門秉撇,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事琐馆」娣В” “怎么了?”我有些...
    開封第一講書人閱讀 157,162評(píng)論 0 348
  • 文/不壞的土叔 我叫張陵瘦麸,是天一觀的道長谁撼。 經(jīng)常有香客問我,道長滋饲,這世上最難降的妖魔是什么厉碟? 我笑而不...
    開封第一講書人閱讀 56,470評(píng)論 1 283
  • 正文 為了忘掉前任,我火速辦了婚禮屠缭,結(jié)果婚禮上箍鼓,老公的妹妹穿的比我還像新娘。我一直安慰自己呵曹,他們只是感情好款咖,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,550評(píng)論 6 385
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著奄喂,像睡著了一般铐殃。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上砍聊,一...
    開封第一講書人閱讀 49,806評(píng)論 1 290
  • 那天背稼,我揣著相機(jī)與錄音,去河邊找鬼玻蝌。 笑死,一個(gè)胖子當(dāng)著我的面吹牛词疼,可吹牛的內(nèi)容都是我干的俯树。 我是一名探鬼主播,決...
    沈念sama閱讀 38,951評(píng)論 3 407
  • 文/蒼蘭香墨 我猛地睜開眼贰盗,長吁一口氣:“原來是場噩夢(mèng)啊……” “哼许饿!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起舵盈,我...
    開封第一講書人閱讀 37,712評(píng)論 0 266
  • 序言:老撾萬榮一對(duì)情侶失蹤陋率,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后秽晚,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體瓦糟,經(jīng)...
    沈念sama閱讀 44,166評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,510評(píng)論 2 327
  • 正文 我和宋清朗相戀三年赴蝇,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了菩浙。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,643評(píng)論 1 340
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖劲蜻,靈堂內(nèi)的尸體忽然破棺而出陆淀,到底是詐尸還是另有隱情,我是刑警寧澤先嬉,帶...
    沈念sama閱讀 34,306評(píng)論 4 330
  • 正文 年R本政府宣布轧苫,位于F島的核電站,受9級(jí)特大地震影響疫蔓,放射性物質(zhì)發(fā)生泄漏含懊。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,930評(píng)論 3 313
  • 文/蒙蒙 一鳄袍、第九天 我趴在偏房一處隱蔽的房頂上張望绢要。 院中可真熱鬧,春花似錦拗小、人聲如沸重罪。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,745評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽剿配。三九已至,卻和暖如春阅束,著一層夾襖步出監(jiān)牢的瞬間呼胚,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,983評(píng)論 1 266
  • 我被黑心中介騙來泰國打工息裸, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留蝇更,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 46,351評(píng)論 2 360
  • 正文 我出身青樓呼盆,卻偏偏與公主長得像年扩,于是被迫代替她去往敵國和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子访圃,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,509評(píng)論 2 348

推薦閱讀更多精彩內(nèi)容

  • 一如既往的在看文章之前我們先來看一下Demo的效果: 要實(shí)現(xiàn)這樣的效果需要哪些技術(shù)呢厨幻?CAShaperLayer?...
    ty_Chen閱讀 7,063評(píng)論 3 19
  • 前言的前言 唐巧前輩在微信公眾號(hào)「iOSDevTips」以及其博客上推送了我的文章后,我的 Github 各項(xiàng)指標(biāo)...
    VincentHK閱讀 5,348評(píng)論 3 44
  • 轉(zhuǎn)場動(dòng)畫學(xué)習(xí)中...TransitionDemo代碼 實(shí)現(xiàn)自定義的轉(zhuǎn)場動(dòng)畫(只涉及自定義動(dòng)畫腿时,不管手勢驅(qū)動(dòng)) 涉及...
    YaoYaoX閱讀 685評(píng)論 0 3
  • 轉(zhuǎn)場動(dòng)畫分為兩種 導(dǎo)航欄轉(zhuǎn)場使用模態(tài)轉(zhuǎn)場 轉(zhuǎn)場動(dòng)畫就是一個(gè)控制器切換到另一個(gè)控制器之間的過程况脆,在這個(gè)過程中獲取到兩...
    會(huì)武的鋤頭閱讀 1,051評(píng)論 0 4
  • 艷萍給自己起了個(gè)QQ昵稱叫"快樂".可是據(jù)她自己說現(xiàn)在并不快樂.記憶中的她,卻是快樂的. 記得高中...
    _荷包蛋_閱讀 327評(píng)論 0 0