Какой лучший способ разработать боковое меню, как в новом iOS-приложении Facebook? - PullRequest
155 голосов
/ 03 ноября 2011

Похоже, что боковые меню становятся все более распространенным элементом интерфейса, так как больше информации попадает в каждое приложение для iPhone.Facebook включил его в свою последнюю версию, и новое приложение Gmail также включает его .Мне было интересно, есть ли у кого-нибудь мысли о наиболее эффективном способе разработки чего-то подобного, так как это становится более распространенным элементом интерфейса.Хотя у меня есть свои мысли о том, как это построить, мне любопытно услышать, что думают другие люди.

Facebook swipe navigation

Ответы [ 18 ]

84 голосов
/ 21 июня 2012

Том Адриаенсен (Tom Adriaenssen) предлагает для этого прекрасную библиотеку: Inferis / ViewDeck

Он очень прост в использовании и имеет довольно много подписчиков.

EDIT:

Для чего-то более легкого, проверьте: взаимный мобильный / MMDrawerController

Он не обладает всеми функциями ViewDeck, но его проще модифицировать и расширять.

48 голосов
/ 20 марта 2012

Я создал библиотеку для этого.Он называется MFSideMenu .

Помимо прочего, он включает поддержку iphone + ipad, портрет + пейзаж, меню слева или справа, UITabBarController и жесты панорамирования.

34 голосов
/ 21 ноября 2011

Я недавно сталкивался с этим, на самом деле не смотрел код и не тестировал элемент управления, но похоже, что это может быть очень неплохой отправной точкой.

jtrevealsidebar

Редактировать: Читатель также должен взглянуть на другие ответы:)

29 голосов
/ 16 мая 2013

Проверьте MMDrawerController:

MMDrawerController

Мы не смогли найти библиотеку, которая нам понравилась, поэтому мы просто свернули свою собственную.

12 голосов
/ 13 октября 2013

ключевая идея , что вам нужно установить рамку или центр self.navigationController.view .Существует два события , которые вы должны обработать.(1) barButtonItem нажмите .(2) жест панорамирования из-за смахивания.

Вы можете отправить контроллер вида на фон следующим образом:

[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);
            }];
        }
    }
}
11 голосов
/ 21 декабря 2011

Реализация Facebook размещает UIPanGestureRecognizer на UINavigationBar.Таким образом, позволяя ловить удары там, где это необходимо.

Это позволяет делать такие вещи, как прямое распознавание направления касания в x / z и скорости, с которой они произошли.

Также такой видработа с UIViews (более одного на экране одновременно с явно разными задачами -> таким образом, разными контроллерами) должна (я испытываю желание сказать, должна) использовать в iOS новые функции ViewController-Containment.Любая реализация без этого просто плоха, так как она работает с иерархией представлений не так, как задумано Apple.

О заметке: если вам действительно интересно, как это можно сделать как можно ближе к Facebookвозможно, ознакомьтесь с проектом, который я открыл на Github PKRevealController .

11 голосов
/ 13 мая 2013

Еще лучше JASidePanels .Легко реализуется и работает как для iPhone, так и для iPad.

Ссылка на Github: JASidePanels

8 голосов
/ 13 октября 2013

Существуют десятки различных библиотек, созданных разработчиками для реализации навигации в стиле Facebook / Path для приложений iOS. Я могу перечислить все из них, но, как вы просили лучший, вот мои два варианта, которые я использую для реализации бокового навигационного меню:

1) ECSlidingViewController Его очень легко реализовать и использовать раскадровки. У меня не было проблем с его реализацией, я не получал ошибок или чего-то подобного. Ссылка, которую я предоставил, содержит почти все объяснения, чтобы использовать ее.

2) SWRevealViewController Эта библиотека проста в использовании, и вы можете найти учебное пособие ЗДЕСЬ , в котором показано, как ее реализовать, со всеми пояснениями и изображениями. Вы можете просто следовать учебнику и поблагодарить меня позже.

7 голосов
/ 12 марта 2013

Другой вариант - использовать Scringo . Это дает вам боковое меню, как в приложениях YouTube / Facebook, а также все виды встроенных функций в меню, которые вы можете добавить (например, чат, пригласить друзей и т. Д.)

Добавление бокового меню осуществляется простым вызовом [ScringoAgent startSession ...], и все настройки можно выполнить на сайте.

4 голосов
/ 01 июня 2013

Обратитесь сюда, очень хорошая отправная точка: Выдвиньте навигацию, как Facebook и путь

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...