155 votes

Quelle est la meilleure façon de développer un menu à glissement latéral comme celui de la nouvelle application iOS de Facebook ?

Il semble que les menus latéraux deviennent un élément d'interface de plus en plus courant à mesure que les applications iPhone contiennent de plus en plus d'informations. Facebook l'a inclus dans sa dernière version et la nouvelle application Gmail semble l'inclure également . Je me demandais si quelqu'un avait des idées sur la manière la plus efficace de développer quelque chose de ce genre, car cela devient un élément d'interface de plus en plus courant. Bien que j'aie mes propres idées sur la façon de construire ce système, je suis curieux d'entendre ce que d'autres personnes pensent.

Facebook swipe navigation

84voto

Chris Knadler Points 1755

Il y a une grande bibliothèque pour cela par Tom Adriaenssen : Inferis/ViewDeck

Il est très facile à utiliser et a un public assez large.

EDITAR:

Pour quelque chose d'un peu plus léger, allez voir : mutualmobile/MMDrawerController

Il ne dispose pas de toutes les fonctionnalités de ViewDeck mais est plus simple à modifier et à étendre.

48voto

Michael Frederick Points 12700

J'ai créé une bibliothèque pour cela. Elle s'appelle MFSideMenu .

Il prend notamment en charge les formats iphone+ipad, portrait+paysage, le menu à gauche ou à droite, le contrôleur UITabBarController et les gestes de panoramique.

34voto

Zaky German Points 7002

Je suis récemment tombé sur ce site, je n'ai pas vraiment regardé le code ou testé le contrôle, mais il semble que ce soit un bon point de départ.

jtrevealsidebar

Modifier : Le lecteur devrait également jeter un coup d'œil aux autres réponses :)

29voto

kcharwood Points 1667

Consultez MMDrawerController :

MMDrawerController

On n'a pas trouvé de bibliothèque qui nous convenait, alors on a créé la nôtre.

12voto

János Points 1512

El idée clé que vous devez définir le cadre ou le centre de la vue de self.navigationController.view . Il y a deux événements que vous devez gérer. (1) barButtonItem press . (2) geste de panique à cause du swiping.

Vous pouvez envoyer le contrôleur de vue en arrière-plan comme ceci :

[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);
            }];
        }
    }
}

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X