一 学习 在 UINavigationController 中 push 和 pop 的转场效果 

(基于iOS7 以上的转场方式)

  • 经过学习了解到,重点分三块:
  • (1)pushAnimation: TransitionPushAnimation 进场效果动画管理器 (NSObject并遵守UIViewControllerAnimatedTransitioning协议)
  • (2)popAnimation:   TransitionPopAnimation  出场效果动画管理器 (NSObject并遵守UIViewControllerAnimatedTransitioning协议) 
  • (3)navigationPerformerObject: TransitionNavigationPerformer 对象操控转场 (设置转场动画代理遵从 UINavigationControllerDelegate协议)
用同一逻辑写了两个效果 来看, 转场代理方法实现差别不大. 关键 是 进出场效果,有人说”你的想象无限 动画效果无限”. 所以掌握了转场动画基本实现基本技巧后,就应该尝试深入研究一下动画效果的实现.这里强调实现转场动画原理和实现过程
   1 进场效果 和 出场效果 主要实现 UIViewControllerAnimatedTransitioning 协议的两个方法:
        (1)动画切换的持续时间,以秒为单位

- (NSTimeInterval)transitionDuration:(id<UIViewControllerContextTransitioning>)transitionContext
        (2)动画执行内容

- (void)animateTransition:(id<UIViewControllerContextTransitioning>)transitionContext

注意要点: 判断 动画执行完成结果状态

当用户做手指跟随操作的过程中,根据操作的finished位置 要判断此时应该是该结束动画 还是取消动画.

[transitionContext completeTransition:![transitionContext transitionWasCancelled]];

下面手势 就是 判断用户手势跟随进度  :

  if ( progress > 0.5) {// 时为 完成 触发"返回"操作

[self.interactionController finishInteractiveTransition];//transitionContext.transitionWasCancelled 会得到NO的回调
      } else {// 反之 为取消 保留当前页面

[self.interactionController cancelInteractiveTransition];//transitionContext.transitionWasCancelled 会得到YES的回调

}

起初因为 [transitionContext transitionWasCancelled] 状态没注意导致 页面过渡 就那么卡住了 或者 页面空白,种种动画效果滞涩的问题都是 状态信号控制不好导致的

   2 这里需要遵从UINavigationControllerDelegate协议的两个方法,这两个方法在对屏幕进行翻转的时候对导航栏控制器变化的动画设置 :

- (nullable id <UIViewControllerInteractiveTransitioning>)navigationController:(UINavigationController *)navigationController
interactionControllerForAnimationController:(id <UIViewControllerAnimatedTransitioning>) animationController NS_AVAILABLE_IOS(7_0); - (nullable id <UIViewControllerAnimatedTransitioning>)navigationController:(UINavigationController *)navigationController
animationControllerForOperation:(UINavigationControllerOperation)operation
fromViewController:(UIViewController *)fromVC
toViewController:(UIViewController *)toVC NS_AVAILABLE_IOS(7_0);

通常写法是把导航去设置和代理方法写在对应的视图控制器里面,这里我们创建 一个对象TransitionNavigationPerformer 遵循UINavigationControllerDelegate代理方法,这样封装,耦合性低,并且代码可移植性更强.

 

#import <Foundation/Foundation.h>
@class TransitionPushAnimation;
@class TransitionPopAnimation; @interface TransitionNavigationPerformer : NSObject <UINavigationControllerDelegate> - (instancetype)initWithNav:(id)nav; //为了操控 self.navigationController @property (weak, nonatomic) UINavigationController *navigationController; //这里强调单项弱引用 @property (strong, nonatomic) TransitionPushAnimation *pushAnimation; @property (strong, nonatomic) TransitionPopAnimation *popAnimation; @property (strong, nonatomic) UIPercentDrivenInteractiveTransition *interactionController;//没做特殊处理 就是默认系统创建 用来控制动画效果进度状态 @end
//
// TransitionNavigationPerformer.m
// SectionDemo
//
// Created by HF on 17/3/29.
// Copyright © 2017年 HF-Liqun. All rights reserved.
// #import "TransitionNavigationPerformer.h"
#import "TransitionPopAnimation.h"
#import "TransitionPushAnimation.h" @interface TransitionNavigationPerformer ()
{
UIScreenEdgePanGestureRecognizer *panGesture;
} @end @implementation TransitionNavigationPerformer - (instancetype)initWithNav:(id)nav
{
self = [super init];
if (self) { self.navigationController = nav;
// 在导航控制器的视图上添加pan手势 --> 需要从边缘进行拖动,在控制器转换的时候是有用 "UIScreenEdgePanGestureRecognizer"
panGesture = [[UIScreenEdgePanGestureRecognizer alloc] initWithTarget:self action:@selector(pan:)];
panGesture.edges = UIRectEdgeLeft; //主要用作返回 left
[self.navigationController.view addGestureRecognizer:panGesture]; // 初始化动画方案
self.pushAnimation = [[TransitionPushAnimation alloc] init];
self.popAnimation = [[TransitionPopAnimation alloc] init];
}
return self;
} - (void)dealloc
{ //这里目的防止取消切换效果后 导航控制器仍然会对手势持有
[panGesture removeTarget:self action:@selector(pan:)];
self.interactionController = nil;
} - (void)pan:(UIScreenEdgePanGestureRecognizer *)recognizer
{
UIView *view = self.navigationController.view;
CGFloat progress = [recognizer translationInView:view].x / (view.bounds.size.width * 1.0);
progress = MIN(1.0, MAX(0.0, progress)); if (recognizer.state == UIGestureRecognizerStateBegan) {
// 创建过渡对象,弹出viewController
self.interactionController = [[UIPercentDrivenInteractiveTransition alloc] init];
[self.navigationController popViewControllerAnimated:YES];
}
else if (recognizer.state == UIGestureRecognizerStateChanged) {
// 更新 interactive transition 的进度
[self.interactionController updateInteractiveTransition:progress];
}
else if (recognizer.state == UIGestureRecognizerStateEnded || recognizer.state == UIGestureRecognizerStateCancelled) {
// 完成或者取消过渡
if (progress > 0.5) {
[self.interactionController finishInteractiveTransition];
}
else {
[self.interactionController cancelInteractiveTransition];
}
self.interactionController = nil;
}
} #pragma mark - UINavigationControllerDelegate - (id<UIViewControllerAnimatedTransitioning>)navigationController:(UINavigationController *)navigationController
animationControllerForOperation:(UINavigationControllerOperation)operation
fromViewController:(UIViewController *)fromVC
toViewController:(UIViewController *)toVC
{
if (operation == UINavigationControllerOperationPush) {
return self.pushAnimation;
}
else if (operation == UINavigationControllerOperationPop) {
return self.popAnimation;
}
return nil;
} - (id<UIViewControllerInteractiveTransitioning>)navigationController:(UINavigationController *)navigationController
interactionControllerForAnimationController:(id<UIViewControllerAnimatedTransitioning>)animationController {
// 检查是否是我们的自定义过渡
if ([animationController isKindOfClass:[TransitionPushAnimation class]] || [animationController isKindOfClass:[TransitionPopAnimation class]]) {
return self.interactionController;
}
else {
return nil;
}
}
@end

3 方法调用

(1)在使用的时候 要添加self.navigationController.delegate = TransitionNavigationPerformer 对象, 不需要就设置为nil

(2)页面viewWillDisappear 一定要立即取消代理方法 防止交互崩溃 .

参考Demo:SectionDemo

效果:

  

参考:

http://www.open-open.com/lib/view/open1408677710366.html

http://www.cocoachina.com/ios/20150811/12986.html

https://github.com/seedante/iOS-Note/wiki/ViewController-Transition

iOS 视图控制器转场动画/页面切换效果/跳转动画 学习的更多相关文章

  1. iOS 视图控制器转场详解

    iOS 视图控制器转场详解 前言的前言 唐巧前辈在微信公众号「iOSDevTips」以及其博客上推送了我的文章后,我的 Github 各项指标有了大幅度的增长,多谢唐巧前辈的推荐.有些人问我相关的问题 ...

  2. 笔记-iOS 视图控制器转场详解(上)

    这是一篇长文,详细讲解了视图控制器转场的方方面面,配有详细的示意图和代码,为了使得文章在微信公众号中易于阅读,seedante 辛苦将大量长篇代码用截图的方式呈现,另外作者也在 Github 上附上了 ...

  3. iOS(视图控制器转场)

    转场需要提供转场代理,不使用默认的代理则需要自己实现代理方式,有UINavigationController.UITabBarController.UIViewController三种代理,实现以下三 ...

  4. iOS 动画学习之视图控制器转场动画

    一.概述 1.系统会创建一个转场相关的上下文对象,传递到动画执行器的animateTransition:和transitionDuration:方法,同样,也会传递到交互Controller的star ...

  5. 在uwp仿IOS的页面切换效果

    有时候我们需要编写一些迎合IOS用户使用习惯的uwp应用,我在这里整理一下仿IOS页面切换效果的代码. 先分析IOS的页面切换.用户使用左右滑动方式进行前进和后退,播放类似于FlipView的切换动画 ...

  6. iOS视图控制器的生命周期

    今天面试有一道面试题因为回答不好,因为也不经常涉及所以有点模糊,我选择了最保守的回答,没有展开写出我对这个问题的理解. 问题:IOS 开发 loadView 和 viewDidLoad 的区别? 经过 ...

  7. [Swift通天遁地]九、拔剑吧-(7)创建旋转和弹性的页面切换效果

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  8. [Swift通天遁地]九、拔剑吧-(8)创建气泡式页面切换效果

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  9. Android - TabHost 与 Fragment 制作页面切换效果

    Android - TabHost 与 Fragment 制作页面切换效果 Android API 19 , API 23 三个标签页置于顶端 效果图: 在文件BoardTabHost.java中定义 ...

随机推荐

  1. vue 事件处理器

    事件处理器 1.监听事件 可以用v-on指令监听DOM事件来触发一些js代码. 2.方法事件处理器 许多事件处理的逻辑都很复杂,所以直接把js代码写在v-on指令中是不可行的.因此v-on可以接受一个 ...

  2. MFC 改变控件的大小和位置

    mfc 改变控件大小和位置用到的函数: ) void MoveWindow(int x, int y, int nWidth, int nHeight); ) void MoveWindow(LPCR ...

  3. mysql 京东

    DROP TABLE IF EXISTS `jd_admin`;CREATE TABLE `jd_admin` ( `id` int(10) unsigned NOT NULL AUTO_INCREM ...

  4. Servlet线程安全2

    Servlet的多线程机制 Servlet体系结构是建立在Java多线程机制之上的,它的生命周期是由Web容器负责的.当客户端第一次请求某个Servlet时,Servlet容器将会根据web.xml配 ...

  5. 用Flex实现常见的几种布局

    用Flex实现常见的几种布局 1.水平,垂直居中. <style type="text/css"> .container{ display: flex; width: ...

  6. OpenCV学习笔记八:opencv_photo模块

    一,简介: 该库用于数码照片的处理,处于发展中,目前只包含如下算法: //! restores the damaged image areas using one of the available i ...

  7. PHP和Java 加解密

    http://www.jb51.net/article/64961.htm http://www.jb51.net/article/129218.htm http://www.jb51.net/art ...

  8. lumen 获得当前uri 如/xxx/{id}

    因为想实现通过url判断是否有权限,所有需要拿到当前的route方法的name,如下 $api->get('role/grant/{id}', 'RoleController@getGrant' ...

  9. PowerDesigner 建模后如何导入到数据库

    from:https://jingyan.baidu.com/article/7f766daf465e9c4101e1d0d5.html 大家都知道PowerDesigner是一个数据库建模工具,但是 ...

  10. JDK的命令具体解释操作

    JDK的命令具体解释1 rmic 功能说明: rmic 为远程对象生成 stub 和 skeleton. 语法: rmic [ options ] package-qualified-class-na ...