iOS开发UI篇--一个侧滑菜单SlidingMenu
一、简介
侧滑菜单已经成为app一个极常用的设计,不管是事务类,效率类还是生活类app。侧滑菜单因Path 2.0和Facebook为开发者熟知,国内目前也有很多流行app用到了侧滑菜单,比如QQ、网易邮箱、知乎等等。
iOS官方并没有提供类似于侧滑栏之类的组件,所以我们需要自己写一个侧滑栏控件,为了不要重复造轮子,我在github上找到了一个使用简单方便,新手容易入手的侧滑菜单控件,地址:https://github.com/John-Lluch/SWRevealViewController/tree/master/
下面我们就是使用上面的控件,来做一个侧滑栏的小Demo,来教大家快速入门侧滑栏控件。
Demo界面演示如下:

二、使用说明
第一步:导入SWRevealViewController.h和SWRevealViewController.m文件
第二步:编写中间显示界面CenterViewController
在viewDidLoad方法中设置SWRevealViewController中的panGestureRecognizer方法,即可实现在主界面上滑动就可以出现左侧或者右侧菜单。设置revealToggle:方法就可以实现点击进行左边菜单和中间界面的切换。设置rightRevealToggle:方法就可以实现右边菜单和中间界面的切换。下面就是中间界面的相关代码:
//注册该页面可以执行滑动切换
SWRevealViewController *revealController = self.revealViewController;
[self.view addGestureRecognizer:revealController.panGestureRecognizer];
// 注册该页面可以执行点击切换
[leftBtn addTarget:revealController action:@selector(revealToggle:) forControlEvents:UIControlEventTouchUpInside];
[rightBtn addTarget:revealController action:@selector(rightRevealToggle:) forControlEvents:UIControlEventTouchUpInside];
第三步、编写左侧菜单栏LeftViewController
左侧菜单栏是由一个UITableView组成的,我们在每个cell的点击方法中执行 [revealViewController pushFrontViewController:viewController animated:YES];切换中间界面的操作。代码如下:
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
SWRevealViewController *revealViewController = self.revealViewController;
UIViewController *viewController;
switch (indexPath.row) {
case 0:
viewController = [[CenterView1Controller alloc] init];
break;
case 1:
viewController = [[CenterView2Controller alloc] init];
break;
default:
break;
}
[revealViewController pushFrontViewController:viewController animated:YES];
}
第四步、编写右侧菜单栏RightViewController
这里主要演示左侧菜单栏,这里就不做过多描述。就以一个简单的ViewController代替。
第五步、在AppDelegate.m文件中的- (BOOL)application:(UIApplication )application didFinishLaunchingWithOptions:(NSDictionary )launchOptions方法中配置以上界面,可以分别设置左侧菜单栏、右侧菜单栏和中间首页。
详见代码注释:
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
//左侧菜单栏
LeftViewController *leftViewController = [[LeftViewController alloc] init];
//首页
CenterView1Controller *centerView1Controller = [[CenterView1Controller alloc] init];
//右侧菜单栏
RightViewController *rightViewController = [[RightViewController alloc] init];
SWRevealViewController *revealViewController = [[SWRevealViewController alloc] initWithRearViewController:leftViewController frontViewController:centerView1Controller];
revealViewController.rightViewController = rightViewController;
//浮动层离左边距的宽度
revealViewController.rearViewRevealWidth = 230;
// revealViewController.rightViewRevealWidth = 230;
//是否让浮动层弹回原位
//mainRevealController.bounceBackOnOverdraw = NO;
[revealViewController setFrontViewPosition:FrontViewPositionLeft animated:YES];
self.window.rootViewController = revealViewController;
self.window.backgroundColor = [UIColor whiteColor];
[self.window makeKeyAndVisible];
return YES;
}
三、总结
接下来准备使用这个界面作为主框架,写一系列关于IOS动画的总结 和 facebook开源动画项目pop动画的使用的博客。敬请期待。
四、下载地址
github下载地址:https://github.com/yixiangboy/IOSAnimationDemo
如果觉得对你还有些用,给一颗star吧。你的支持是我继续的动力。
博主的话
以前看过很多别人的博客,学到不少东西。现在准备自己也开始写写博客,希望能够帮到一些人。
iOS开发UI篇--一个侧滑菜单SlidingMenu的更多相关文章
- IOS开发UI篇--一个支持图文混排的ActionSheet
一.简单介绍 UIActionSheet是IOS提供给我们开发人员的底部弹出菜单控件.一般用于菜单选择.操作确认.删除确认等功能.IOS官方提供的下面方式对UIActionView进行实例化: - ( ...
- ios开发UI篇—使用纯代码自定义UItableviewcell实现一个简单的微博界面布局
本文转自 :http://www.cnblogs.com/wendingding/p/3761730.html ios开发UI篇—使用纯代码自定义UItableviewcell实现一个简单的微博界面布 ...
- iOS开发UI篇—使用嵌套模型完成的一个简单汽车图标展示程序
iOS开发UI篇—使用嵌套模型完成的一个简单汽车图标展示程序 一.plist文件和项目结构图 说明:这是一个嵌套模型的示例 二.代码示例: YYcarsgroup.h文件代码: // // YYcar ...
- iOS开发UI篇—使用xib自定义UItableviewcell实现一个简单的团购应用界面布局
iOS开发UI篇—使用xib自定义UItableviewcell实现一个简单的团购应用界面布局 一.项目文件结构和plist文件 二.实现效果 三.代码示例 1.没有使用配套的类,而是直接使用xib文 ...
- iOS开发UI篇—使用UItableview完成一个简单的QQ好友列表(一)
iOS开发UI篇—使用UItableview完成一个简单的QQ好友列表(一) 一.项目结构和plist文件 二.实现代码 1.说明: 主控制器直接继承UITableViewController // ...
- iOS开发UI篇—使用picker View控件完成一个简单的选餐应用
iOS开发UI篇—使用picker View控件完成一个简单的选餐应用 一.实现效果 说明:点击随机按钮,能够自动选取,下方数据自动刷新. 二.实现思路 1.picker view的有默认高度为162 ...
- iOS开发UI篇—CAlayer(自定义layer)
iOS开发UI篇—CAlayer(自定义layer) 一.第一种方式 1.简单说明 以前想要在view中画东西,需要自定义view,创建一个类与之关联,让这个类继承自UIView,然后重写它的Draw ...
- iOS开发UI篇—UITabBarController简单介绍
iOS开发UI篇—UITabBarController简单介绍 一.简单介绍 UITabBarController和UINavigationController类似,UITabBarControlle ...
- iOS开发UI篇—CAlayer层的属性
iOS开发UI篇—CAlayer层的属性 一.position和anchorPoint 1.简单介绍 CALayer有2个非常重要的属性:position和anchorPoint @property ...
随机推荐
- XHTML是什么?XHTML与HTML的区别
经常看到web前端开发人员口中提到XHTML,相信很多web前端开发的新手们感到很疑惑,甚至有些时候认为XHTML就是HTML,这个观点是错误的,今天零度就给大家好好说道说道XHTML和HTML的区别 ...
- POJ 2111 DP+记录路径
题意: 思路: 类似滑雪 //By SiriusRen #include <cstdio> #include <cstring> #include <algorithm& ...
- Kinect 开发 —— Hello,Kinect
控制台输出深度数据: using System; using System.Collections.Generic; using System.Linq; using System.Text; usi ...
- 多行文本溢出显示...的方法(-webkit-line-clamp)
限制在一个块元素显示的文本的行数. -webkit-line-clamp 是一个 不规范的属性(unsupported WebKit property),它没有出现在 CSS 规范草案中. 为了实现该 ...
- 结构体类型重声明导致的bug一个
bug前提条件 当模块比較多.头文件较多,某个结构体类型会在当前模块中又一次声明进而引用其成员,而不直接包括其它模块的头文件. 这种优点是不引入不须要的类型声明到此模块.头文件包括的交叉:坏处是,添加 ...
- cocos2d-x 3.0 Loading界面实现
这个世界每一天都在验证我们的渺小,但我们却在努力创造,不断的在这生活的画卷中留下自己的脚印.或许等到我们老去的那一天,老得不能动仅仅能靠回顾的那一天.你躺在轮椅上,不断的回顾过去.相思的痛苦忘不了,相 ...
- PHP 版本简单记录
PHP 版本简单记录 PHP 博物馆 http://museum.php.net/php5/ PHP 版本发布 https://secure.php.net/release ...
- layoutParams-动态更改某个控件的margin
其实它的方法也非常的简单,如下 LinearLayout.LayoutParams layoutParams = (LayoutParams) bt1.getLayoutParams(); int a ...
- Button- 自定义控件添加自定义属性
今天自定义了一个button按钮,需要添加一个属性,具体步骤如下 1.新属性的信息设定:在values目录下添加attrs.xml文件,在里面添加属性信息 <?xml version=" ...
- matlab (.m)文件生成 windows 可执行(.exe)文件
mex -setup:设置 C 语言编译器:(如果本地安装有 visual studio 20xx 集成开发环境,则会自动选择其下的 C/C++ 编译器 ) 将运行时环境(runtime enviro ...