开发像 Facebook 新 iOS 应用程序那样的侧滑菜单的最佳方法是什么？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7989020/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
What's the best way to develop a sideswipe menu like the one in Facebook's new iOS app?
提问by Nick ONeill
It appears that side-swipe menus are becoming a more common interface element as more information gets crammed into each iPhone app. Facebook has included it in their latest version and the new Gmail app appears to include it as well. I was wondering if anybody had thoughts on the most efficient way of developing something like this as it's becoming a more common interface element. While I have my own thoughts on how to build this, I'm curious to hear what other people think.
随着越来越多的信息被塞进每个 iPhone 应用程序，侧滑菜单似乎正在成为一种更常见的界面元素。Facebook 已将其包含在其最新版本中，新的 Gmail 应用程序似乎也包含它。我想知道是否有人想过开发这样的东西的最有效方法，因为它正在成为一个更常见的界面元素。虽然我对如何构建它有自己的想法，但我很想知道其他人的想法。
采纳答案by Zaky German
I recently came across this, didn't actually look at the code or test the control, but looks like it may be a very decent starting point.
我最近遇到了这个，实际上并没有查看代码或测试控件，但看起来它可能是一个非常不错的起点。
Edit: The reader should also take a look at the other answers :)
编辑：读者还应该看看其他答案:)
回答by Chris Knadler
There is a great library for this by Tom Adriaenssen: Inferis/ViewDeck
Tom Adriaenssen 有一个很棒的图书馆：Inferis/ViewDeck
It's very easy to use and has a fairly large following.
它非常易于使用并且拥有相当多的追随者。
EDIT:
编辑：
For something a little more lightweight, check out: mutualmobile/MMDrawerController
对于更轻量的东西，请查看：mutualmobile/MMDrawerController
It doesn't have all of the features of ViewDeck but is simpler to modify and extend.
它没有 ViewDeck 的所有功能，但更易于修改和扩展。
回答by Michael Frederick
I created a library for this. It is called MFSideMenu.
我为此创建了一个库。它被称为MFSideMenu。
Among other things it includes support for iphone+ipad, portrait+landscape, menu on the left or right side, UITabBarController, and pan gestures.
其中包括对 iphone+ipad、纵向+横向、左侧或右侧菜单、UITabBarController 和平移手势的支持。
回答by kcharwood
Check out MMDrawerController:
查看 MMDrawerController：
We couldn't find a library that we liked, so we just rolled our own.
我们找不到我们喜欢的图书馆，所以我们只推出了自己的图书馆。
回答by János
The key ideathat you have to set self.navigationController.view's frame or center. There is two eventthat you have to handle. (1) barButtonItem press. (2) pan gesturebecause of swiping.
您必须设置 self.navigationController.view 的 frame 或 center的关键思想。有两个事件，你必须处理。(1) barButtonItem 按。(2)由于滑动而产生平移手势。
You can send view controller to the background like this:
您可以像这样将视图控制器发送到后台：
[self.view sendSubviewToBack:menuViewController.view];
- (void)viewDidLoad
{
[super viewDidLoad];
UIBarButtonItem *barButtonItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemDone target:self action:@selector(buttonPressed:)];
UIPanGestureRecognizer *panGestureRecognizer = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handlePan:)];
[self.navigationController.view addGestureRecognizer:panGestureRecognizer];
self.navigationItem.leftBarButtonItem = barButtonItem;
}
- (void)buttonPressed:(id)sender {
CGRect destination = self.navigationController.view.frame;
if (destination.origin.x > 0) {
destination.origin.x = 0;
} else {
destination.origin.x = 320;
}
[UIView animateWithDuration:0.25 animations:^{
self.navigationController.view.frame = destination;
}];
}
- (void)handlePan:(UIPanGestureRecognizer *)recognizer
{
static CGPoint originalCenter;
if (recognizer.state == UIGestureRecognizerStateBegan)
{
originalCenter = recognizer.view.center;
} else if (recognizer.state == UIGestureRecognizerStateChanged)
{
CGPoint translation = [recognizer translationInView:self.view];
recognizer.view.center = CGPointMake(originalCenter.x + translation.x, originalCenter.y);
}
else if (recognizer.state == UIGestureRecognizerStateEnded || recognizer.state == UIGestureRecognizerStateCancelled || recognizer.state == UIGestureRecognizerStateFailed)
{
if (recognizer.view.frame.origin.x < 160) {
[UIView animateWithDuration:0.25 animations:^{
recognizer.view.center = CGPointMake(384, 487.5);
}];
} else {
[UIView animateWithDuration:0.25 animations:^{
recognizer.view.center = CGPointMake(384 + 320, 487.5);
}];
}
}
}
回答by pkluz
Facebook's implementation places a UIPanGestureRecognizer on the UINavigationBar. Thus allowing to catch swipes where it's needed.
Facebook 的实现在 UINavigationBar 上放置了一个 UIPanGestureRecognizer。从而允许在需要的地方捕捉滑动。
That allows to do things like, recognizing the touch direction in x/z directly as well as the speed they occurred with.
这允许做这样的事情，直接识别 x/z 中的触摸方向以及它们发生的速度。
Also such kind of tinkering with UIViews (more than one on screen at a time with evidently different tasks -> thus different controllers) should (I'm tempted to say must) use iOS new ViewController-Containment features. Every implementation without that is simply bad as it tinkers with the view hierarchy in a way not intended by Apple.
同样，这种对 UIViews 的修改（一次在屏幕上有多个明显不同的任务 -> 因此不同的控制器）应该（我很想说必须）使用 iOS 新的 ViewController-Containment 功能。没有它的每个实现都非常糟糕，因为它以 Apple 不希望的方式修改视图层次结构。
On a sidenote: If you're really curious on how it can be done as close to Facebook's way as possible, check out the project I open sourced on Github PKRevealController.
旁注：如果您真的对如何尽可能接近 Facebook 的方式感到好奇，请查看我在 Github PKRevealController上开源的项目。
回答by user2330922
Even better is JASidePanels. Easily implemented and works for both iPhone and iPad.
更好的是JASidePanels。易于实施并适用于 iPhone 和 iPad。
Github link: JASidePanels
Github 链接：JASidePanels
回答by AJ112
There are tens of different libraries that developers have created to implement the Facebook/Path style navigation for iOS apps. I can list all of them but as you have asked for the best one, here are my two choices that i use to implement the side swipe navigation menu:
开发人员创建了数十种不同的库来为 iOS 应用程序实现 Facebook/Path 风格的导航。我可以列出所有这些，但正如您所要求的那样，这是我用来实现侧滑导航菜单的两个选择：
1) ECSlidingViewControllerIts very easy to implement and use Storyboards also. I haven't had any issues implementing it nor received any errors or anything like that. The link i provided has pretty much all the explanation in order to use it.
1) ECSlidingViewController它也很容易实现和使用故事板。我在实施它时没有遇到任何问题，也没有收到任何错误或类似的问题。我提供的链接几乎包含了使用它的所有解释。
2) SWRevealViewControllerThis library is easy to use and you can find a tutorial HERE, that shows how to implement it with all the explanation along with images. You can just follow the tutorial and thank me later.
2) SWRevealViewController这个库很容易使用，你可以在这里找到一个教程，它展示了如何使用所有的解释和图像来实现它。您可以按照教程进行操作，稍后再感谢我。
回答by hungary54
Another option is to use Scringo. It gives you a side-menu like in youtube/facebook apps, and also all kind of built-in features in the menu that you can choose to add (e.g chat, invite friends, etc...)
另一种选择是使用Scringo。它为您提供了一个类似于 youtube/facebook 应用程序的侧菜单，以及您可以选择添加的菜单中的所有内置功能（例如聊天、邀请朋友等...）
Adding the side-menu is simply by calling [ScringoAgent startSession...] and all configuration can be done on the site.
添加侧菜单只需调用 [ScringoAgent startSession...]，所有配置都可以在站点上完成。
回答by ZTAN
Refer to here, a very good starting point: slide out navigation like facebook and path
参考这里，一个很好的起点： 像facebook和path一样滑出导航
