[Objective-c] Xcode 4 et storyboard

décembre 17, 2011

Une grosse nouveauté de Xcode 4 est le storyboard. La possibilité de gérer encore plus de chose graphiquement. C’est un complément d’interface builder, un moyen de gérer les transitions.
Dans ce tutorial on va créer un petit projet qui permet de passer d’une vue à une autre, en passant en paramètre un petit texte.

Nous allons donc créer un nouveau projet de type Single View Application. N’oubliez pas de cocher « Use Storyboard » et « Use Automatic Reference ».

Puis on va créer une nouvelle vue. Pour cela, aller dans le menu fichier, « new file » puis comme classe UIViewController, nommez la SecondViewController. Attention à ne pas créer de fichier Xib.

Dans la liste des fichiers, cliquez sur MainStoryboard, la vous avez votre première vue. Selectionnez la, et dans le menu editor, Embed In, choisissez Navigation Controller. Cela à pour effet de rajouter automatiquement un Navigation controller. On voit apparaitre en haut de la fenêtre la zone du controller.

On va y ajouter un bouton, et une zone de saisie (nommez la textSaisie). En appuyant sur contrôle et en tirant vers la page de code, Xcode rajoute automatiquement le code. Magique 🙂

Maintenant, ajouter un objet View Controller. Configurez la classe avec celle que vous avez crée au début. Ajoutez un UILabel (secondLabel) et un NSString (secondText) qui récupérera le texte. Et de la meme manière, glissez du label vers la page de code. Ajouter à la main le code pour le NSString.

Une fois cette définition créé, faite de même du bouton, glissez vers la nouvelle vue et sélectionner ‘Push’, cela va créer automatiquement le changement de vue.
Vous pouvez ajouter un titre dans la bar du controller.

Maintenant, il ne reste plus qu’à mettre en place le mécanisme permettant de récupérer le texte saisie et l’envoyer dans la 2eme vue. Et c’est la méthode prepareForSegue qui fait tout le boulot ou presque. N’oubliez pas d’importer la classe!!

Dans la première classe ajoutez :

- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender  {
        SecondViewController *mainView= segue.destinationViewController;
        mainView.secondText=textSaisie.text;
}

Dans la 2eme, dans le viewDidLoad:

secondLabel.text=secondText;

Et voilà.
Une petite vidéo récapitulative de cet introduction rapide au Storyboard de Xcode 4. Et le code source sur https://github.com/Jekar/jkraft-tuto

Catégorie(s): Développement, iPad, Iphone, Objective-C | Comments (5)