Swift使用MMDrawerController框架打造通用侧滑抽屉效果模版

这篇文章使用快速的、方便的的实现方法来构建和facebook一样的”滑出式导航”。包括官方在内，资料都是使用oc来完成效果的实现，自己就使用Swift纯代码来构建，以后也可以慢慢使用到较大项目中。

对于这个导航的实现，已经有了非常优秀的第三方库来供我们使用：John-Llunch的SWRevealViewController和Mutual Mobile的MMDrawerController，这里我使用的是MMDrawerController，有兴趣的可以使用SWRevealViewControler来实现一遍。

开始实战：

第一步：使用COcoapods导入框架

pod 'MMDrawerController','~> 0.5.7'

第二步：初始化根试图、左视图和中心视图（这里只做了左视图，右视图类似）

var window: UIWindow?

var drawerController:MMDrawerController!

func application(application: UIApplication,didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {

//创建窗口
let mainFrame = UIScreen.mainScreen().bounds
window = UIWindow(frame: mainFramE)
//设置视图
let leftViewController = LeftViewController()
let centerViewController = CenterViewController()

let centerNavigationController = UINavigationController(rootViewController: centerViewController)
//let leftNavigationController = UINavigationController(rootViewController: leftViewController)

drawerController = MMDrawerController(centerViewController: centerNavigationController,leftDrawerViewController: leftViewController)

drawerController.maximumLeftDrawerWidth = Common.screenWidth * 0.70
//手势
drawerController.openDrawerGestureModeMask = MMOpenDrawerGestureMode.All
drawerController.closeDrawerGestureModeMask = MMCloseDrawerGestureMode.All

//设置动画，这里是设置打开侧栏透明度从0到1
drawerController.setDrawerVisualStateBlock { (drawerController,drawerSide,percentVisiblE) -> Void in

var sideDrawerViewController:UIViewController?
if(drawerSide == MMDrawerSide.Left){
sideDrawerViewController = drawerController.leftDrawerViewController;
}
sideDrawerViewController?.view.alpha = percentVisible
}
//设置根试图
self.window?.rootViewController = drawerController
//设置可见
window?.makeKeyAndVisible()
return true
}

针对第二步，基本属性和方法的使用请参考Github的文档介绍，可以参考oc的讲解和这里的Swift代码来理解。

第三步：增加按钮来控制拉出和收回抽屉

override func viewDidLoad() {
super.viewDidLoad()

self.view.BACkgroundColor = UIColor.whiteColor()

navigationItem.title = “主页”
self.navigationItem.leftBarButtonItem = UIBarButtonItem(image: UIImage(named: “Done”),style: UIBarButtonItemStyle.Plain,target: self,action: “doneslide”)
}

func doneslide(){

let appDelegate = UIApplication.sharedApplication().delegate as! AppDelegate
appDelegate.drawerController.toggleDrawerSide(MMDrawerSide.Left,animated: true,completion: nil)

}

针对第三步，我觉得比较难理解的地方是toggleDrawerSlide方法，框架里源代码注释为：

自行翻译��，大概意思就是控制抽屉的开关
####第四步：使用TableVIew实现左侧划页面
代码太多，只张贴部分，项目代码可以去源代码下载

tableView = UITableView(frame: CGRectMake(0,Common.screenWidth * 0.7,view.frame.height),style: UITableViewStyle.Plain)

tableView.delegate = self
tableView.datasource = self
tableView.separatorStyle = UITableViewCellSeparatorStyle.SingleLine
view.addSubview(tableView)

//设置headView
let headImageViewHight: CGFloat = 160
let headImageView = UIImageView(frame: CGRectMake(0,headImageViewHight))
headImageView.image = UIImage(named: “quesheng”)

tableView.tableHeaderView = headImageView
//去掉下部空白格
self.tableView.tableFooterView = UIView()

第五步：实现视图联动

在这里实现点击左视图中菜单时，主视图自动联动的功能。采取的措施就是点击不同的Cell，把相对应的视图设置为中心视图

func tableView(tableView: UITableView,didSELEctRowATindexPath indexPath: NSIndexPath) {

switch (indexPath.row){
case 0:
let centerViewController = CenterViewController()
let centerNavigationController = UINavigationController(rootViewController: centerViewController)
let appDelegate = UIApplication.sharedApplication().delegate as! AppDelegate
appDelegate.drawerController.centerViewController = centerNavigationController
appDelegate.drawerController.toggleDrawerSide(MMDrawerSide.Left,completion: nil)
default:

let otherViewController = OtherViewController()
let otherNavigationController = UINavigationController(rootViewController: otherViewController)
let appDelegate = UIApplication.sharedApplication().delegate as! AppDelegate
appDelegate.drawerController.centerViewController = otherNavigationController
appDelegate.drawerController.toggleDrawerSide(MMDrawerSide.Left,completion: nil)
}
}

第六步：实现代码重用与优化

今天时间太紧，代码重用存在一些问题，近期会马上优化，希望可以继续关注

如果叙述存在问题，请留言告诉我，谢谢
代码地址：点个赞哦
微博地址：互粉互粉

iOS进阶一百（第四天）