控制器转场动画详解

简介:

控制器转场动画详解

 

效果

 

说明

1. 控制器转场动画包括了普通控制器的present与dismiss转场动画,还有NavigationController的push与pop转场动画.其中,NavigationController的pop动画包含了回退百分比显示

2. 对转场动画对象进行行为抽象,让使用更加简单

3. 即使简化了使用,控制器转场动画也是属于比较难掌握的

 

源码

https://github.com/YouXianMing/ViewControllersTransition



//
//  BaseAnimator.h
//  ViewControllersTransition
//
//  Created by YouXianMing on 15/7/21.
//  Copyright (c) 2015年 YouXianMing. All rights reserved.
//

#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>

@interface BaseAnimator : NSObject <UIViewControllerAnimatedTransitioning>

/**
 *  动画执行时间(默认值为0.5s)
 */
@property (nonatomic) NSTimeInterval  transitionDuration;

/**
 *  == 子类重写此方法实现动画效果 ==
 *
 *  动画事件
 */
- (void)animateTransitionEvent;

/**
 *  == 在animateTransitionEvent使用才有效 ==
 *
 *  源头控制器
 */
@property (nonatomic, readonly, weak) UIViewController *fromViewController;

/**
 *  == 在animateTransitionEvent使用才有效 ==
 *
 *  目标控制器
 */
@property (nonatomic, readonly, weak) UIViewController *toViewController;

/**
 *  == 在animateTransitionEvent使用才有效 ==
 *
 *  containerView
 */
@property (nonatomic, readonly, weak) UIView           *containerView;

/**
 *  动画事件结束
 */
- (void)completeTransition;

@end


//
//  BaseAnimator.m
//  ViewControllersTransition
//
//  Created by YouXianMing on 15/7/21.
//  Copyright (c) 2015年 YouXianMing. All rights reserved.
//

#import "BaseAnimator.h"

@interface BaseAnimator ()

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

@property (nonatomic, weak) UIViewController  *fromViewController;
@property (nonatomic, weak) UIViewController  *toViewController;
@property (nonatomic, weak) UIView            *containerView;

@end

@implementation BaseAnimator

#pragma mark - 初始化
- (instancetype)init {
    
    self = [super init];
    if (self) {
    
        // 默认参数设置
        [self deafultSet];
    }
    
    return self;
}

- (void)deafultSet {
    
    _transitionDuration = 0.5f;
}

#pragma mark - 动画代理
- (NSTimeInterval)transitionDuration:(id <UIViewControllerContextTransitioning>)transitionContext {
    
    return _transitionDuration;
}

- (void)animateTransition:(id <UIViewControllerContextTransitioning>)transitionContext {
    
    self.fromViewController = [transitionContext viewControllerForKey:UITransitionContextFromViewControllerKey];
    self.toViewController   = [transitionContext viewControllerForKey:UITransitionContextToViewControllerKey];
    self.containerView      = [transitionContext containerView];
    self.transitionContext  = transitionContext;
    
    [self animateTransitionEvent];
}

- (void)animateTransitionEvent {
    
    /* == 代码示例 ==
     
    UIView *tmpView  = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
    [self.containerView addSubview:self.toViewController.view];
    [self.containerView addSubview:tmpView];
    
    [UIView animateWithDuration:self.transitionDuration
                          delay:0.0f
         usingSpringWithDamping:1 initialSpringVelocity:0.f options:0 animations:^{
             
             tmpView.frame = CGRectMake(0, 0, 100, 100);
             
         } completion:^(BOOL finished) {
             
             [tmpView removeFromSuperview];
             [self completeTransition];
         }];
     */
}

#pragma mark -
- (void)completeTransition {

    [self.transitionContext completeTransition:!self.transitionContext.transitionWasCancelled];
}

@end

细节

导航栏控制器动画需要做的事情(*为添加回退百分比,非必须)

1. 添加协议

2. 添加代理

3. 实现协议方法

* 4. 添加UIPercentDrivenInteractiveTransition对象

* 5. 添加边缘手势

* 6. 实现百分比协议

* 7. 实现手势方法

 

普通控制器动画需要做的事情

1. 添加协议

2. 控制器的简易配置

3. 实现代理协议

 

资料

http://objectivetoast.com/2014/03/17/custom-transitions-on-ios/

目录
相关文章
|
3月前
|
存储 Dart 数据库
Flutter笔记:状态提升、控制器模式、GetX控制器和服务
Flutter笔记:状态提升、控制器模式、GetX控制器和服务
93 0
|
容器
(一)UINavigationController(导航控制器)的详解
(一)UINavigationController(导航控制器)的详解
337 0
【Flutter】Animation 动画 ( AnimatedBuilder 动画使用流程 | 创建动画控制器 | 创建动画 | 创建动画作用的组件 | 关联动画与组件 | 动画执行 )(一)
【Flutter】Animation 动画 ( AnimatedBuilder 动画使用流程 | 创建动画控制器 | 创建动画 | 创建动画作用的组件 | 关联动画与组件 | 动画执行 )(一)
131 0
|
Dart 开发者
【Flutter】Animation 动画 ( AnimatedBuilder 动画使用流程 | 创建动画控制器 | 创建动画 | 创建动画作用的组件 | 关联动画与组件 | 动画执行 )(三)
【Flutter】Animation 动画 ( AnimatedBuilder 动画使用流程 | 创建动画控制器 | 创建动画 | 创建动画作用的组件 | 关联动画与组件 | 动画执行 )(三)
147 0
【Flutter】Animation 动画 ( AnimatedBuilder 动画使用流程 | 创建动画控制器 | 创建动画 | 创建动画作用的组件 | 关联动画与组件 | 动画执行 )(三)
|
iOS开发
iOS开发中标签控制器的使用——UITabBarController(二)
iOS开发中标签控制器的使用——UITabBarController
290 0
|
iOS开发
iOS开发中标签控制器的使用——UITabBarController(一)
iOS开发中标签控制器的使用——UITabBarController
201 0
iOS开发中标签控制器的使用——UITabBarController(一)
|
UED iOS开发
iOS开发UINavigation系列四——导航控制器UINavigationController
iOS开发UINavigation系列四——导航控制器UINavigationController
226 0