自定义转场--简单实现

最近公司让做和系统相似的图片展示功能, 于是就顺带的研究一一下转场功能的实现(也就是自定义转场功能).
针对于网上那些我都看不太懂的程序, 我自己想也一点,用来做个记录.
1.对于相册照片的点击功能大家应该都比较了解. 点击图片, 图片从原位置进行放大, 而我们可以清晰的看到放大的效果示例. 那么这个问题就来了,
(1)展示图片的这个是一个什么? 控制器? 视图? 还是什么的?
(2)它是怎么去实现动画功能?
(3)它是以什么情况弹出的控制器 modal??
(4)为什么弹出的位置可以随心所欲呢?

2.在苹果WWDC2014的时候,苹果给我提供了两个用于转场动画的协议.
UIViewControllerTransitioningDelegate 控制器转场代理协议
UIViewControllerAnimatedTransitioning 控制器转场动画协议
内部提供了很多方法, 目的在于让我们更精准的控制自己的转场动画.

// 转场协议 .
@protocol UIViewControllerTransitioningDelegate 

@optional
//  需要返回一个遵守协议的对象, 此对象可控制动画的行为. 动画控制 展示情况
/*
  三个参数:
  1.PresentedController: 被展示出来的控制器
  2.Presenting: 发起展示的控制器
  3.source: 资源控制器 
    返回值 ,用来设置样式,只要遵守协议的控制器,都是可以的

*/
- (nullable id )animationControllerForPresentedController:(UIViewController *)presented presentingController:(UIViewController *)presenting sourceController:(UIViewController *)source;
// 转场 消失时的动画
- (nullable id )animationControllerForDismissedController:(UIViewController *)dismissed;
// 下面两个方法是用在交互时, 我还没有好的认识, 所以暂不接受
// 交互
- (nullable id )interactionControllerForPresentation:(id )animator;

- (nullable id )interactionControllerForDismissal:(id )animator;


// 这个方法很重要 , 如果要改变样式的话, 自定义modal的话,必须调用.  它返回的控制器,包含着 衔接 被展示和 发起展示的控制器. 
- (nullable UIPresentationController *)presentationControllerForPresentedViewController:(UIViewController *)presented presentingViewController:(UIViewController *)presenting sourceViewController:(UIViewController *)source NS_AVAILABLE_IOS(8_0);
@end

说了这么多我想大家都懵了, 现在给展示展示一些相关的应用吧


自定义转场--简单实现_第1张图片
自定义转场1.gif

因为我们一般对于一些衔接性不是很强的控制器,都是采用modal直接进行弹出的, 但是我们有时候也需要它从我们想要的地方,以我们需要的方式进行展示才可以, 这时候我们需要自定义转场(modal)动画.

具体步骤

给需要转场的控制器设置代理和转场类型.

  1. 设置转场的代理,(自己实现转场 ,做了一些自己想做的事情,代理方法中书写)
    控制器属性 transitionDelegate需要遵守协议: UIViewControllerTransitionDelegate
  2. 设置转场的类型,(因为不需要系统从下往上的死板推出, 所以类型需要重新设置 , 在iphone中 转场类型除custom以外都是从下往上推的,但ipad 可以应用于其他转场类型)
    modalPresentationStyle

代理这么一个属性,只要是遵守了相关协议都可以作为他的代理, 所以为了方便起见(以后能够抽出来用),建立了一个专门用来处理转场的类 CustomModalUpDown的类(形象说明自定义上下转场)
继承于NSobject,遵守UIViewControllerTransitioningDelegate协议
控制器中代码形式:
--实例代码先用Swift进行书写


// 将代码封装成工具类, 以便以后使用
   private lazy var customModal = CustomModalUpDown()

 // 加载storyboard中的控制器
        let sb = UIStoryboard.init(name: "PopoverViewController", bundle: nil)
        let popVc = sb.instantiateInitialViewController()!
        // 设置 转场代理
        popVc.transitioningDelegate = customModal
// 设置转场类型
        popVc.modalPresentationStyle = UIModalPresentationStyle.Custom
        // modal出控制器
        presentViewController(popVc, animated: true, completion: nil)

工具类专门用来做modal

// 定义一个通知name,用于model出来
let LXLPopoverViewShow = "LXLPopoverViewShow"
// 定义一个通知name,用于dismiss
let LXLPopoverViewDismiss = "LXLPopoverViewDismiss"

import UIKit
class CustomModalUpDown: NSObject,UIViewControllerTransitioningDelegate,UIViewControllerAnimatedTransitioning {
    
    // 定义变量,记录是否已经pop出来控制器
   private var isPop : Bool = false
// 传递
    var presentFrame : CGRect = CGRectZero
        // MARK: - UIViewControllerTransitioningDelegate -代理方法
        /// 如果是改变样式的话,也就是改变显示的尺寸, 必须调用这个方法
        func presentationControllerForPresentedViewController(presented: UIViewController, presentingViewController presenting: UIViewController, sourceViewController source: UIViewController) -> UIPresentationController?
        {
// 自己定义一个 PresentationController 继承于 UIPresentationController,  内部包含上下文,  可以修改上下文内容.  我在后面接收自定义这个类都干了什么.
            let presentC = PresentationController(presentedViewController: presented, presentingViewController: presenting)
// 将外界的 尺寸进行传入
            presentC.presentFrame = presentFrame
            return presentC
        }
        
        // modal展示出控制器时的动画
        // presented:被展示的控制器
        // presenting:发起展示的控制器
        // source: 资源控制器 (用来设置样式.只要遵守协议的控制器,都是可以的)
        func animationControllerForPresentedController(presented: UIViewController, presentingController presenting: UIViewController, sourceController source: UIViewController) -> UIViewControllerAnimatedTransitioning? {
            isPop = true
//            NSNotificationCenter.defaultCenter().postNotificationName(LXLPopoverViewShow, object: self)
            return self
        }
        // modal 消失时的动画
        func animationControllerForDismissedController(dismissed: UIViewController) -> UIViewControllerAnimatedTransitioning? {
            isPop = false
            NSNotificationCenter.defaultCenter().postNotificationName(LXLPopoverViewDismiss, object: self)
            return self
        }
        // MARK : - UIViewControllerAnimatedTransitioning - 代理方法
        /// 返回转场时间, 一般没人管
        func transitionDuration(transitionContext: UIViewControllerContextTransitioning?) -> NSTimeInterval
        {
            return 888
        }
        /// 设置转场动画,利用上下文
        func animateTransition(transitionContext: UIViewControllerContextTransitioning)
        {
            let presentView : UIView!
            
// 展示和dismiss的时候,它的上下文中的 from  和 to对应得刚好相反.  
            if isPop {
                // 取出上下文中的 展示控制器的view
                presentView = transitionContext.viewForKey(UITransitionContextToViewKey)!
                presentView.layer.anchorPoint = CGPoint(x: 0.5, y: 0)
                // warning 将view需要手动加到 内容view上,才能显示 , 相当于自己还要在进行创建内容控制器一样.
                transitionContext.containerView()?.addSubview(presentView)
                presentView.transform = CGAffineTransformMakeScale(1.0, 0.0)
                UIView.animateWithDuration(0.5, animations: { () -> Void in
                    presentView.transform = CGAffineTransformIdentity
                    }) { (_) -> Void in
// 完成时,一定记得关闭上下文,负责动画无法完成.
                        transitionContext.completeTransition(true)
                }
            }else{
                // 取出上下文中的 展示控制器的view
                presentView = transitionContext.viewForKey(UITransitionContextFromViewKey)!
                // waring 将view需要手动加到 内容view上,才能显示 , 相当于自己还要在进行创建内容控制器一样.
                transitionContext.containerView()?.addSubview(presentView)
                UIView.animateWithDuration(0.5, animations: { () -> Void in
                    presentView.transform = CGAffineTransformMakeScale(1.0, 0.0000001)
                    }) { (_) -> Void in
// 完成时,一定记得关闭上下文,负责动画无法完成.
                        transitionContext.completeTransition(true)
                }       
            }
            
        }
        
    }

自定义展示控制器(主要是取得其上下文, 进行添加层次.)

import UIKit

class PresentationController: UIPresentationController {
  // 设置尺寸, 供外界设置 展示控制器的大小
    var presentFrame : CGRect = CGRectZero
    /// 负责布局 内容容器中的子控件的 (此方法值调用一次)
    override func containerViewWillLayoutSubviews() {
        super.containerViewWillLayoutSubviews()
        let view = presentedView()
// 自己进行设置被展示的view的大小 (当然我是希望外界可以进行传递的), 如果外界没有, 那我自己进行设置
        view?.frame = (presentFrame == CGRectZero) ? CGRect(x: 100, y: 56, width: 150, height: 300) : presentFrame
// containerView中存放着  modal双方的 视图 . 然后自己进行插入蒙版视图
        containerView?.insertSubview(cover, atIndex: 0)

    }
    
    // MARK: -懒加载蒙版
   private lazy var cover : UIView = {
    let view = UIView(frame: UIScreen.mainScreen().bounds)
    view.backgroundColor = UIColor(white: 0.5, alpha: 0.2)
        
    let tap = UITapGestureRecognizer(target: self, action: Selector("dismissView"))
    view.addGestureRecognizer(tap)
     return view
    }()
    
    //MARK :- 点击事件的监听
    func dismissView()
    {
        // 拿到被展示的控制器, 然后让其消失
        presentedViewController.dismissViewControllerAnimated(true, completion: nil)
    }
}

OC部分的代码---- 相当于只是一个转换
简单的实现, 简单粗暴吧


自定义转场--简单实现_第2张图片
oc自定义转场.gif

自定义类,专门管理转场,遵守两个协议,一个代理, 一个动画协议

// .h文件
#import 

@interface CustomModal : NSObject
@property(assign,nonatomic) CGRect rect;
@end

//.m文件
#import "CustomModal.h"
#import "PresentController.h"
@interface CustomModal()
@property(nonatomic,assign) BOOL isPop;
@end
@implementation CustomModal

- (UIPresentationController *)presentationControllerForPresentedViewController:(UIViewController *)presented presentingViewController:(UIViewController *)presenting sourceViewController:(UIViewController *)source
{
    PresentController *presentationVC = [[PresentController alloc]initWithPresentedViewController:presented presentingViewController:presenting];
    [presentationVC setRect:self.rect];
    return presentationVC;
}

- (id)animationControllerForPresentedController:(UIViewController *)presented presentingController:(UIViewController *)presenting sourceController:(UIViewController *)source
{
    self.isPop = YES;
    return self;
}
- (id)animationControllerForDismissedController:(UIViewController *)dismissed
{
    self.isPop = NO;
    return self;
}
- (NSTimeInterval)transitionDuration:(id)transitionContext
{
    return 0.5;
}
- (void)animateTransition:(id)transitionContext
{
    UIView *presentView = [[UIView alloc]init];
    if (self.isPop) {
        presentView = [transitionContext viewForKey:UITransitionContextToViewKey];
        presentView.layer.anchorPoint = CGPointMake(0.5, 0);;
        [[transitionContext containerView] addSubview:presentView];
        presentView.transform = CGAffineTransformMakeScale(1.0, 0.0);
        [UIView animateWithDuration:0.5 animations:^{
            presentView.transform = CGAffineTransformIdentity;
        } completion:^(BOOL finished) {
            [transitionContext completeTransition:YES];
        }];
    }else
        {
            presentView = [transitionContext viewForKey:UITransitionContextFromViewKey];
            [[transitionContext containerView] addSubview:presentView];
            [UIView animateWithDuration:0.5 animations:^{
                presentView.transform = CGAffineTransformMakeScale(1.0, 0.00001);
            } completion:^(BOOL finished) {
                [transitionContext completeTransition:YES];
            }];
    
    
    }
    
}
@end

自定义类,专门用于转场展示view的处理

// .h文件

#import 

@interface PresentController : UIPresentationController

- (void)setRect: (CGRect)rect;
@end

// .m文件
#import "PresentController.h"
@interface PresentController()
@property(nonatomic,strong) UIView  *cover;
@end
@implementation PresentController

- (UIView *)cover
{
    if (_cover == nil) {
        NSLog(@"________");
        UIView *cover = [[UIView alloc]initWithFrame:[UIScreen mainScreen].bounds];
        cover.backgroundColor = [[UIColor alloc]initWithWhite:0.2 alpha:0.5];
        UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(clickDismiss)];
        [cover addGestureRecognizer:tap];
        _cover = cover;
    }
    return _cover;
}
- (void)containerViewWillLayoutSubviews
{
    [super containerViewWillLayoutSubviews];
    
//    UIView *presentView = self.presentedView;
    [self.containerView insertSubview:self.cover atIndex:0];
    
}
- (void)setRect:(CGRect)rect
{
    self.presentedView.frame = rect;
}

- (void)clickDismiss
{
    [self.presentedViewController dismissViewControllerAnimated:YES completion:nil];

}

你可能感兴趣的:(自定义转场--简单实现)