iOS之UI--使用SWRevealViewController实现侧边菜单功能详解实例

使用SWRevealViewController实现侧边菜单功能详解

  下面通过两种方法详解SWRevealViewController实现侧边菜单功能:

1.使用StoryBoard实现 2.纯代码实现


前言:手机屏幕始终有限,如何在有限的展示空间提供便捷的导航入口呢?Facebook的App设计了一个可以从屏幕侧边滑出的导航,这一设计模式引得各大主流 App尽相模仿。一时间,Path,Mailbox,Gmail都采用了这种设计。Github 上也有很多侧栏导航的解决方案,这里我们使用John的SWRevealViewController类来实现,这里就通过分别详细的通过StoryBoard和纯代码结合xib来实现。

SWRevealViewController在github下载地址: 点击这里

它的工作流程:

  • 用户点击“list”按钮,导航向右滑出
  • 用户再次点击“list”按钮,导航向左收起
  • 通过左右滑动也能达到同样的效果

不管接下来用的是StoryBoard方法实现还是纯代码实现,首先都要做的一件事情就是将框架里的主要的源码拷贝进项目中:


开始:

一、使用StoryBoard实现:

1、首先建立UI框架:


2、上面的图的连线在这里也详细补充一下吧:

ContentVC里用了三个UINavigationVC以及自带的连线,当然你可以自己更换UINavigationVC的rootViewController,比如我这里就是换成了普通的ViewController,然后自己添加子控件比如UIView,最后连线连上Navigation的rootViewController连线。(这里会点StoryBoard就应该秒懂)

接下来讲的连线是就是比较重要的,反正我之前没用过的连线,也是到别的大神博客里学习来的。


剩下需要连线的是ContainerVC、MenuVC,三个UINavigationVC之间的连线,而这里他们的连线上面一个图给出了,但是连接的模式有些细节上的不一样,对于ContainerVC作为容器的连线,都是选择reveal view controller set Controller :


而除了容器控制器ContainerVC之外的连线,也就是作为MenuVC的TabVC连接三个作为ContentVC的UINavigationVC,都是用reveal view controller push Controller连线:


接下来设置两个Segue 的 identifier, 设置成“sw_front”,告诉 SWRevealViewController 这是前置控制器。

rear英文就是后背的意思,这里设置sw_rear就是告诉SWRevealViewController这是后背控制器


接下来为对应的控制器创建类,然后为对应的控制器指派类Class。

首先最重要的是要将主要的作为容器的控制器ContainerVC,将作为侧滑栏的容器视图的指派类Class设置为SWRevealViewController


然后指派的类用图快速表示表示:


为了能够当视图从 ContentVC —> MenuVC ,所以需要在三个TabView的toolBar上添加需要响应的item控件,并设置图标:


接着需要在OneVC控制器类中,结合代码将框架和这个第一个页面对应的控制器联系起来


然后第二个页面和第三个页面也是这样。

通过以上storyboard实现侧滑菜单的运行效果:


到这里源码百度云下载链接: http://pan.baidu.com/s/1c1coLLu 密码: avgw

SwRevealViewController提供了很多方法来配置菜单栏的样式。比如你想更改菜单栏的宽度,你就可以更新rearViewRevealWidth属性即可:


其实这只是实现侧滑菜单的很多方法中的一种,你也可以试着自己从空项目开始写,使用自定义的动画去实现;或者是寻找别的开源类库去实现,比如ENSwiftSideMenu

二、纯代码结合xib实现:

用纯代码实现比较灵活,比如可以设置右边的侧滑菜单,StoryBoard目前我还不知道怎么连线添加右边的侧滑菜单。不过StoryBoard想实现右边侧滑在前面项目示例基础上可以使用源代码实现添加哦。其实本质还是接下来要讲解的全纯代码实现:

在用纯代码之前,设置Main清除掉,然后愿意的话删除Main.storyboard也是可以的。


接着开始在AppDelegate中敲代码,管理需要创建的所有的控制器


一步一步跟着我的代码步骤很好理解的哦。


到这里我就试着运行了一下,发现只是打开了一个空白的Navigation视图,没有什么卵用,那是当然的拉,还没有为各自控制器设置事件监听或者手势监听,甚至界面的控件都没添加,当然没什么效果了。

接着就要为各自的视图添加UI喽,首先添加item需要的素材,素材备份百度云下载链接: http://pan.baidu.com/s/1jHh2oV8 密码: p7me :


然后首先在FrontViewController中添加代码:


上效果图展示:


接着要要丰富这个框架喽,先处理RearViewController


然后要记得为UITableView控件添加数据源和代理


然后运行一下,自己看看效果吧,这里暂时不上图了。

然后接着为这个RearViewController的两个cell添加向导到目标控制器

补充下图缺少的部分代码:

/** 辅助变量 表示是否是刚刚显示过的控制器 */

@property (nonatomic,assign)NSInteger isSameViewController;

然后在这里我将之前的画板的控制器拷贝拖进来了,然后#import “CanvasViewController.h”就直接使用了


然后现在必须要看运行效果了:

时间: 2024-11-01 06:39:47

iOS之UI--使用SWRevealViewController实现侧边菜单功能详解实例的相关文章

thinkPHP实现的联动菜单功能详解

本文实例讲述了thinkPHP实现的联动菜单功能.分享给大家供大家参考,具体如下: 联动菜单,首先给你看看前端是怎么写的: <div id="newCat"> <div class="all_type" id="allGoogsCat">所有商品分类</div> <div class="spfl-warp <?php if(CONTROLLER_NAME != 'Index' || ACT

iOS中nil、Nil、NULL、NSNull详解

  这篇文章主要介绍了iOS中nil.Nil.NULL.NSNull详解的相关资料,需要的朋友可以参考下 ObjC 里面的几个空值符号经常会差点把我搞死,这些基础的东西一点要弄清楚才行,以提高码农的基本素质. nil nil 是 ObjC 对象的字面空值,对应 id 类型的对象,或者使用 @interface 声明的 ObjC 对象. 例如: ? 1 2 3 4 NSString *someString = nil; NSURL *someURL = nil; id someObject = n

iOS中关于信鸽推送的使用demo详解_IOS

最近在看推送方面的知识,用的是信鸽推送主要是因为后台用的是信鸽 推送用第三方推送,也就是在客户端建一个广播接收器,当服务器发送消息时发送到信鸽,信鸽再发送一次,广播接受器接受下: 我实现的功能比较简单,当app在运行状态时,会在主页展示一个弹窗展示推送的消息:如果app不在运行状态且service没被销毁就展示默认的通知 那么如何在主页展示弹窗:当广播接受器收到我要的消息时,用观察者模式,收到消息在发送个消息个主界面 官方的Demo连接:http://xg.qq.com/xg/help/ctr_

自定义右键菜单代码详解

菜单|详解|右键 < style > < !-- /*定义菜单方框的样式1*/ .skin0 { position:absolute; text-align:left; width:200px; /*宽度,可以根据实际的菜单项目名称的长度进行适当地调整*/ border:2px solid black; background-color:menu; /*菜单的背景颜色方案,这里选择了系统默认的菜单颜色*/ font-family:Verdana; line-height:20px; cu

精彩动态导航菜单制作详解

菜单|导航|动态|详解 公式在制作特效中非常有用,著名的三星导航菜单就用到了此公式.现在许多韩国网站出尽风头,其中缓冲导航是其一大亮点.本文以一德国网站的导航为例,详解缓冲导航的制作.感谢溶剂提供的坐标算法. 本例效果预览: 制作思路 1.图片缩放控制 利用缓冲公式设置图片的缩放比例,如果鼠标滑过某图片,放大1.8倍.如果其它图片的序号与此图片的序号相差1,就是此图片两边的图片,放大1.4倍,其它的为原始大小. 2.图片坐标控制 当某图片放大时,相邻的图片的坐标等于此图片的坐标加上这两张图片的宽

iOS 7.1新功能详解

最新iOS7.1新功能汇总 iOS 7.1作为一次从iOS 7.0.4的一个较大版本提升,带来了许多项目的优化与改进.针对不少果粉用户比较关心的iOS7.1新功能以及是否影响后期越狱等问题,本文将会与大家做个基本介绍,还不了解苹果最新iOS 7.1系统的朋友,不妨一起来看看: 一.iOS7.1新功能汇总 1.增加黑灰色键盘背景设置 在iOS 7设置中的辅助设置中,我们可以看到iOS 7.1新增了键盘颜色切换功能,可以将之前的灰白色背景切换成黑灰色,用户体验方面更为出色,如下图所示: 增加黑灰色键

iOS开发:多线程编程之NSThread的使用详解

  1.简介: 1.1 iOS有三种多线程编程的技术,分别是: 1..NSThread 2.Cocoa NSOperation (iOS多线程编程之NSOperation和NSOperationQueue的使用) 3.GCD 全称:Grand Central Dispatch( iOS多线程编程之Grand Central Dispatch(GCD)介绍和使用) 这三种编程方式从上到下,抽象度层次是从低到高的,抽象度越高的使用越简单,也是Apple最推荐使用的. 这篇我们主要介绍和使用NSThr

iOS设备远程Push功能详解

作为一个现代应用,没有Push功能,你已经过时了,为了紧跟时代潮流,我决定研究下如何实现苹果的Push功能. 关心APNS是如何实现的朋友们请移步Apple Push Notification Service,关系怎么在iOS设备上实现Push功能的同学,请继续往下看. 总的来说,分为六个内容:新建App,设置AppPush证书,如何在应用内注册Push,如何处理Push,Push内容详解. 1.首先我们需要一个测试使用的App. 进入iOS Provisioning Portal,App ID

iOS开发之UIPickerView实现城市选择器的步骤详解_IOS

前言 UIPickerView是一个选择器控件,它可以生成单列的选择器,也可生成多列的选择器,而且开发者完全可以自定义选择项的外观,因此用法非常灵活.UIPickerView直接继承了UIView,没有继承UIControl,因此,它不能像UIControl那样绑定事件处理方法,UIPickerView的事件处理由其委托对象完成. 本文借助于UIPickerView来实现城市选择器,第一列为省份,第二列为第一列省份对应的城市或者区,数据放在plist中,plist结构如下图所示,第一层是一个Di