如今很多应用已经不再局限于点击按钮触发事件来进行视图之间切换,为迎合给予用户更好体验,体现iOS系统极佳用户体验,使用手势来进行各个视图之间切换,用户至于一个大拇指在屏幕中央就可浏览到很多信息;

关于 RNSwipeViewController: https://github.com/rnystrom/RNSwipeViewController

RNSwipeViewController是别人已经写好的一个ViewController容器,剩下我们要做的就是把自己的视图容器放到这个容器中进行管理。

首先学习 RNSwipeViewController里面的Demo

1.创建一个Single View Application工程,next,勾选 Use Storyboards,Use Automatic  Reference Counting

2.将RNSwipeViewController拖入新建到工程,添加QuartzCore.framework

3.新建四个类CenterViewController、LeftViewController、RightViewController、BottomViewController,继承UIViewController类

4.打开StoryBoard,从库里拖入四个ViewController视图控制器到StoryBoard里面,选中一个视图控制器设置类名和Storyboard ID,其他三个类似

5.在ViewController.h将加入#import "RNSwipeViewController.h"并将继承类改为RNSwipeViewController,在ViewDidLoad方法中

- (void)viewDidLoad
{
[super viewDidLoad];
CenterViewController *centerView = [self.storyboard instantiateViewControllerWithIdentifier:@"CenterViewController"];
UINavigationController *centerNav = [[UINavigationController alloc] initWithRootViewController:centerView];
centerView.title =@"Center";
self.centerViewController = centerNav;
self.leftViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"LeftViewController"]; self.rightViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"RightViewController"]; self.bottomViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"BottomViewController"]; }

如此我们就完成三个视图之间手势交互,首先出现的视图作为主视图,其他试图再是在它上面进行运动,手指向左滑右侧视图出现,向右滑动出现左视图,向上滑动出现底部视图出现

  

平常我们在构建一个带有XIB视图控制类的时候,初始化一般这样

CenterViewController *centerVC = [[CenterViewController alloc] initWithNibName:@"CenterViewController" bundle:nil];

但是在StoryBoard中,视图的Storyboard ID  成了这是视图的唯一标示,再给一个视图所属类时,设定好该视图的Storyboard ID,进行初始化时CenterViewController *centerView = [self.storyboard instantiateViewControllerWithIdentifier:@"CenterViewController"];

这个类库中也提供按钮点击进行视图交互方法,同时也设置视图显示宽度的属性,在类库实现的里面视图宽度有默认值

_leftVisibleWidth = 200.f;
_rightVisibleWidth = 200.f;
_bottomVisibleHeight = 300.0f;

再此我们可以在自己类里修改这个属性,根据自己需求,作图下设置

ViewController.m

- (void)viewDidLoad
{
[super viewDidLoad]; CenterViewController *centerView = [self.storyboard instantiateViewControllerWithIdentifier:@"CenterViewController"];
UINavigationController *centerNav = [[UINavigationController alloc] initWithRootViewController:centerView];
centerView.title =@"Center";
self.centerViewController = centerNav;
self.leftViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"LeftViewController"];
self.leftVisibleWidth = 100;
self.rightViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"RightViewController"];
self.rightVisibleWidth = self.view.frame.size.width;
self.bottomViewController = [self.storyboard instantiateViewControllerWithIdentifier:@"BottomViewController"]; }

我们再给导航栏上添加两个按钮,在CenterViewController类中,包含#import "UIViewController+RNSwipeViewController.h"

- (void)viewDidLoad
{
[super viewDidLoad]; UIButton *leftBtn = [UIButton buttonWithType:UIButtonTypeCustom];
leftBtn.frame = CGRectMake(0, 0, 44, 44);
[leftBtn setImage:[UIImage imageNamed:@"left.png"] forState:UIControlStateNormal];
[leftBtn addTarget:self action:@selector(toggleLeft) forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *leftBar = [[UIBarButtonItem alloc] initWithCustomView:leftBtn];
self.navigationItem.leftBarButtonItem = leftBar
; UIButton *rightBtn = [UIButton buttonWithType:UIButtonTypeCustom];
rightBtn.frame = CGRectMake(self.view.frame.size.width-44, 0,44 , 44);
[rightBtn setImage:[UIImage imageNamed:@"right.png"] forState:UIControlStateNormal];
[rightBtn addTarget:self action:@selector(toggleRight) forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem *rightBar = [[UIBarButtonItem alloc] initWithCustomView:rightBtn];
self.navigationItem.rightBarButtonItem = rightBar;
; }

接着连个按钮事件,为了显示明显我们可以设置一下三个视图背景颜色

-(void)toggleLeft
{
[self.swipeController showLeft];
} -(void)toggleRight
{
[self.swipeController showRight];
}

 

RNSwipeViewController有一个协议方法,可以监听当前视图显示百分比(0~100)

RNSwipeViewController have a protocol method, can monitor the current view shows percentage (0 ~ 100)

#import <UIKit/UIKit.h>
#import "RNRevealViewControllerProtocol.h"
@interface LeftViewController : UIViewController<RNRevealViewControllerProtocol> @end

协议方法,当左侧视图完全显示时弹出一个alertView

-(void)changedPercentReveal:(NSInteger)percent
{
if (percent == 100) { UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@"提示" message:@"这是一个测试" delegate:self cancelButtonTitle:@"OK" otherButtonTitles: nil];
[alert show ]; }
}

源码下载地址:https://github.com/XFZLDXF/XFSwipeView.git

原创博客欢迎转载分享,请注明出处http://blog.csdn.net/duxinfeng2010

使用RNSwipeViewController类库进行视图切换的更多相关文章

  1. iOS开发系列--视图切换

    概述 在iOS开发中视图的切换是很频繁的,独立的视图应用在实际开发过程中并不常见,除非你的应用足够简单.在iOS开发中常用的视图切换有三种,今天我们将一一介绍: UITabBarController ...

  2. pushViewController addSubview presentModalViewController视图切换

    1.pushViewController和popViewController来进行视图切换,首先要确保根视图是NavigationController,不然是不可以用的, pushViewContro ...

  3. IOS 视图切换动画

    我在网上找到的这个小方法,被我举一反三使用的屡试不爽.比如用在,当视图需要执行某一方法跳转到新的一个UIView上,从底层渐变浮到最上层.就是一个不错的视觉效果或者当需要类似keyboard的效果从底 ...

  4. UI3_视图切换

    // // ViewController.m // UI3_视图切换 // // Created by zhangxueming on 15/7/3. // Copyright (c) 2015年 z ...

  5. UI2_视图切换ViewController

    // // SubViewController.h // UI2_视图切换 // // Created by zhangxueming on 15/7/3. // Copyright (c) 2015 ...

  6. UI1_ViewController视图切换及Appdelegate

    // // ThirdViewController.h // UI1_ViewController视图切换及Appdelegate // // Created by zhangxueming on 1 ...

  7. UI2_视图切换

    // // ViewController.m // UI2_视图切换 // // Created by zhangxueming on 15/7/1. // Copyright (c) 2015年 z ...

  8. Tabbar视图切换,返回上一视图,添加item

    前面有一篇博文iOS学习之Tab Bar的使用和视图切换 这是在AppDelegate里使用Tabbar,这样的程序打开就是TabbarView了,有时候我们需要给程序做一些帮助页面,或者登录页面,之 ...

  9. MFC视图切换大全总结

    单纯视图之间的切换 单文档多视图切换是我在学习MFC中遇到的一个老大难问题,在今天总算是一一破解了.我觉得视图切换分为三个等级,第一是在未切分窗格的情况下切换视图类:第二是在分割窗格的一个窗格内实行视 ...

随机推荐

  1. CPU自制入门——笔记

    最近在看日本人的那本书<CPU自制入门>就开始自己捣鼓.把工程方到QuartusII 里面后发现编译不通过,总是提示找不到头文件.工程的目录架构是这个样子的 而.v文件中的.h 是这么包含 ...

  2. zookeeper perl 版本需求

    [root@wx03 ~]# perl -v This is perl 5, version 22, subversion 1 (v5.22.1) built for x86_64-linux Cop ...

  3. perl 5.22手动安装Mysql DBI和DBD

    mysql 手动安装DBI 和DBD: DBI版本: [root@dr-mysql01 DBD-mysql-4.033]# perl -MDBI -le 'print $DBI::VERSION;' ...

  4. vpn技术原理详解

    转载于:http://blog.csdn.net/quqi99/article/details/7334617 假设有这样一个需求,需要从家中访问公司内网机器,可以用ssh遂道技术来作转发,遂道分正向 ...

  5. MSSql跨数据库查询

    select d.PostTime ,l.name from DatabaseLog d ,lumigent.dbo.test l 一定要加.dbo,不加dbo不行啊 select * from lu ...

  6. VS2010 ,工程文件减肥

    写一个bat文件来清理VS2010工程文件. 将其放入到工程文件夹下,双击即可自动将sdf,ipch等占用空间很大的文件删除. 这样的方式较之于转移浏览数据库文件的位置而言更为灵活一些,不用特别的设置 ...

  7. 网页制作之html基础学习6-CSS浏览器兼容问题

    初学html和css时,每天切图,总会遇到很多浏览器兼容性问题.最近一直关注移动平台开发,就html和css来说,不用考虑那么多浏览器兼容性问题.到现在,以至于很多浏览器兼容性几乎忘光了.今天把以前总 ...

  8. HTML5给我们带来了什么

    websocket 根据维基定义 WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端直接向客户端推送数据而不需要客户端进行请求,在 WebSocket API 中,浏览器和服 ...

  9. 自定义类似QMutexLocker的CMutexLocker

    最近做项目遇到一个需求,有一个buttonSlot()执行要耗点时间,为了防止用户无限制的乱点出现问题,考虑加一个互斥锁,使得每次执行完后才允许执行下一次.大概意思是: //QMutex  m_mut ...

  10. set global read_only=0; 关闭只读,可以读写 set global read_only=1; 开始只读模式

    mysql> set global read_only=0; Query OK, 0 rows affected (0.00 sec) mysql> show variables like ...