programmation ios l3 informatique -...

126
Programmation iOS L3 informatique Étienne Payet Département de mathématiques et d’informatique Ces transparents sont mis à disposition selon les termes de la Licence Creative Commons Paternité - Pas d’Utilisation Commerciale - Pas de Modification 3.0 non transcrit. Étienne Payet (DMI) Prog. iOS – L3 informatique 1 / 126

Upload: others

Post on 19-Apr-2020

1 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Programmation iOSL3 informatique

Étienne Payet

Département de mathématiques et d’informatique

Ces transparents sont mis à disposition selon les termes de la Licence Creative Commons Paternité - Pasd’Utilisation Commerciale - Pas de Modification 3.0 non transcrit.

Étienne Payet (DMI) Prog. iOS – L3 informatique 1 / 126

Page 2: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Plan

1 Introduction

2 Anatomie d’une application iOS

3 Déploiement d’une application

4 Objective C

5 Éléments de base des interfaces graphiques

6 Présentation sous forme de listes

7 Contrôleurs de vues

8 Persistance des données

Étienne Payet (DMI) Prog. iOS – L3 informatique 2 / 126

Page 3: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Ressources

http://developer.apple.com

Standford CS193P (niveau L2-L3)http://www.stanford.edu/class/cs193p/cgi-bin/drupal/Vidéos sur iTunes U

livres : il y en a beaucoup...iOS Programming : The Big Nerd Ranch Guide (Conway & Hillegass)voir à la BUprivilégiez ceux traitant des dernières versions d’iOSObjective C 2.0

Étienne Payet (DMI) Prog. iOS – L3 informatique 3 / 126

Page 4: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Pour pouvoir travailler

développement : Mac Intel + OS X ≥ 10.6.6 (Snow Leopard) +Xcode + iOS SDK

déploiement : Apple ID + appareil iOS

par défaut, tout développeur a accès à Xcode, à l’iOS SDK et auxforums, peut déployer sur un appareil iOS mais ne peut pas distribuerson application sur l’App Store

des abonnements payants sont proposés à ceux qui veulent distribuerleur application

Étienne Payet (DMI) Prog. iOS – L3 informatique 4 / 126

Page 5: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Workflow iOS

1. Développement 2. Test 3. Publication

XcodeÉmulateur ouAppareil mobile

(iPhone, iPad, iPod Touch)App Store

Étienne Payet (DMI) Prog. iOS – L3 informatique 5 / 126

Page 6: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Les frameworks d’iOS

Cocoa Touch

Media

Core Services

Core OSnoyau OS X (BSD - Mach 3.0),sockets, système de fichiers, . . .

Étienne Payet (DMI) Prog. iOS – L3 informatique 6 / 126

Page 7: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Les frameworks d’iOS

Cocoa Touch

Media

Core Servicesservices réseau, SQLite, contacts,préférences, géo-localisation, . . .

Core OSnoyau OS X (BSD - Mach 3.0),sockets, système de fichiers, . . .

Étienne Payet (DMI) Prog. iOS – L3 informatique 7 / 126

Page 8: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Les frameworks d’iOS

Cocoa Touch

MediaPDF, JPG, PNG, TIFF, audio, vidéo,animations, OpenGL, . . .

Core Servicesservices réseau, SQLite, contacts,préférences, géo-localisation, . . .

Core OSnoyau OS X (BSD - Mach 3.0),sockets, système de fichiers, . . .

Étienne Payet (DMI) Prog. iOS – L3 informatique 8 / 126

Page 9: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Les frameworks d’iOS

Cocoa Touch UIKit, Foundation, MapKit, . . .

MediaPDF, JPG, PNG, TIFF, audio, vidéo,animations, OpenGL, . . .

Core Servicesservices réseau, SQLite, contacts,préférences, géo-localisation, . . .

Core OSnoyau OS X (BSD - Mach 3.0),sockets, système de fichiers, . . .

Étienne Payet (DMI) Prog. iOS – L3 informatique 9 / 126

Page 10: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice : Hello World !

Étienne Payet (DMI) Prog. iOS – L3 informatique 10 / 126

Page 11: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice : Hello World !

Étienne Payet (DMI) Prog. iOS – L3 informatique 11 / 126

Page 12: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Plan

1 Introduction

2 Anatomie d’une application iOS

3 Déploiement d’une application

4 Objective C

5 Éléments de base des interfaces graphiques

6 Présentation sous forme de listes

7 Contrôleurs de vues

8 Persistance des données

Étienne Payet (DMI) Prog. iOS – L3 informatique 12 / 126

Page 13: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Anatomie d’une application iOS

voir ici pour une description complète

certains éléments sont présentés ci-après

Étienne Payet (DMI) Prog. iOS – L3 informatique 13 / 126

Page 14: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Cycle de vie d’une application

Étienne Payet (DMI) Prog. iOS – L3 informatique 14 / 126

Page 15: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

La fonction main : transfère le contrôle à UIKit

#import <UIKit/UIKit.h>#import "AppDelegate.h"

int main(int argc, char * argv[]){

@autoreleasepool {return UIApplicationMain(argc, argv, nil,

NSStringFromClass([AppDelegate class]));}

}

Étienne Payet (DMI) Prog. iOS – L3 informatique 15 / 126

Page 16: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

La fonction UIApplicationMain

crée l’objet application delegatecharge l’interface graphique à partir des fichiers Storyboardinitialise l’applicationlance la boucle des événements

Étienne Payet (DMI) Prog. iOS – L3 informatique 16 / 126

Page 17: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

L’objet application delegate

présent dans toute application iOSgère les messages systèmeimplémente le protocole UIApplicationDelegate

Étienne Payet (DMI) Prog. iOS – L3 informatique 17 / 126

Page 18: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Le protocole UIApplicationDelegate

Ses méthodes permettent de répondre aux événements du cycle de vie :

application:didFinishLaunchingWithOptions:

applicationDidBecomeActive:

applicationWillResignActive:

applicationDidEnterBackground:

applicationWillEnterForeground:

applicationWillTerminate:

Étienne Payet (DMI) Prog. iOS – L3 informatique 18 / 126

Page 19: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice

Repérez tous ces éléments dans votre application Hello World !

Étienne Payet (DMI) Prog. iOS – L3 informatique 19 / 126

Page 20: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Plan

1 Introduction

2 Anatomie d’une application iOS

3 Déploiement d’une application

4 Objective C

5 Éléments de base des interfaces graphiques

6 Présentation sous forme de listes

7 Contrôleurs de vues

8 Persistance des données

Étienne Payet (DMI) Prog. iOS – L3 informatique 20 / 126

Page 21: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Processus de déploiement

Étienne Payet (DMI) Prog. iOS – L3 informatique 21 / 126

Page 22: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Provisioning profile

basé sur la notion d’équipe (team)

peut être créé automatiquement par Xcode à partirde l’équipe associée au projet ou peut être créé parle chef d’équipe

constitué de :certificats développeurs (un ou plus)iDevices IDs (un ou plus)un App ID (un seul)

à installer sur les iDevices (à partir de Xcode)

Étienne Payet (DMI) Prog. iOS – L3 informatique 22 / 126

Page 23: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice

Déployez votre application Hello World ! sur votre iDevice.

Étienne Payet (DMI) Prog. iOS – L3 informatique 23 / 126

Page 24: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Plan

1 Introduction

2 Anatomie d’une application iOS

3 Déploiement d’une application

4 Objective C

5 Éléments de base des interfaces graphiques

6 Présentation sous forme de listes

7 Contrôleurs de vues

8 Persistance des données

Étienne Payet (DMI) Prog. iOS – L3 informatique 24 / 126

Page 25: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Sur-ensemble strict du C ANSI

programmation orientée objet :

classesméthodes, envoi de messageshéritage, délégation (protocoles)introspection· · ·

Étienne Payet (DMI) Prog. iOS – L3 informatique 25 / 126

Page 26: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Classes : déclaration

fichier d’en-tête (.h)

Étienne Payet (DMI) Prog. iOS – L3 informatique 26 / 126

Page 27: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Classes : implémentation

fichier source (.m)

#import "MyClass.h"

@implementation MyClass- (id)initWithString:(NSString *)aName {

self = [super init];if (self) {

name = [aName copy];}return self;

}

+ (MyClass *)createMyClassWithString: (NSString *)aName {return [[[self alloc] initWithString:aName] autorelease];

}@end

Étienne Payet (DMI) Prog. iOS – L3 informatique 27 / 126

Page 28: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Méthodes : déclaration

Étienne Payet (DMI) Prog. iOS – L3 informatique 28 / 126

Page 29: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Méthodes : appel

envoi de messages :

syntaxe : [myArray insertObject:anObject atIndex:0]

obligatoire destinataire sélecteur paramètres

imbrication :[[myAppObject theArray]insertObject:[myAppObject objectToInsert]atIndex:0

]

Étienne Payet (DMI) Prog. iOS – L3 informatique 29 / 126

Page 30: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Chaînes de caractères

types NSString et NSMutableString

constantes : @"Hello World!"

déclaration :NSString * ma_chaine = @"Hello World!";

Étienne Payet (DMI) Prog. iOS – L3 informatique 30 / 126

Page 31: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Chaînes de caractères

NSString *meteo = @"beau";NSString *message = [NSString stringWithFormat:@"Il fait %@", meteo];

NSLog(@"il fait %d degres", [meteo temperature]);

Étienne Payet (DMI) Prog. iOS – L3 informatique 31 / 126

Page 32: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Chaînes de caractères

NSString *ma_chaine = @"Hello";NSString *chaine;chaine = [ma_chaine stringByAppendingString: @" World!"];

NSMutableString *ma_chaine = [NSMutableString string];[ma_chaine appendString:@"Meteo : "];[ma_chaine appendFormat:@"ciel %@ temperature %d degres",

[meteo ciel], [meteo temperature]];

Étienne Payet (DMI) Prog. iOS – L3 informatique 32 / 126

Page 33: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Collections

ordonnées : NSArray et NSMutableArray

non-ordonnées, sans doublons : NSSet et NSMutableSet

couples {clé,valeur} : NSDictionary et NSMutableDictionary

Étienne Payet (DMI) Prog. iOS – L3 informatique 33 / 126

Page 34: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

NSArray et NSMutableArray

NSArray *couleurs = [NSArray arrayWithObjects:@"vert",@"bleu",nil];NSLog(@"nombre de couleurs : %d", [couleurs count]);NSLog(@"troisieme couleur : %@", [couleurs objectAtIndex:2]);

NSMutableArray *couleurs = [NSMutableArray array];[couleurs addObject:@"vert"];[couleurs addObject:@"bleu"];[couleurs insertObject:@"jaune" atIndex:1];[couleurs removeObjectAtIndex:0];

Étienne Payet (DMI) Prog. iOS – L3 informatique 34 / 126

Page 35: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

NSDictionary et NSMutableDictionary

NSDictionary *couleurs =[NSDictionary dictionaryWithObjectsAndKeys:

@"vert",@"00FF00",@"bleu",@"0000FF",nil];

NSString *bleu = [couleurs objectForKey:@"0000FF"];if ([couleurs objectForKey:@"FFFFFF"]) NSLog(@"le blanc existe !");

NSMutableDictionary *couleurs = [NSMutableDictionary dictionary];[couleurs setObject:@"vert" forKey:@"00FF00"];[couleurs removeObjectForKey:@"000000"];[couleurs removeAllObjects];

Étienne Payet (DMI) Prog. iOS – L3 informatique 35 / 126

Page 36: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Fast enumeration

peu efficace :

NSArray *couleurs = [NSArray arrayWithObjects:@"vert",@"bleu",nil];int combien = [couleurs count];for (int i = 0; i < combien; i++) {

NSLog(@"couleur %@", [couleurs objectAtIndex:i]);}

efficace :

for (NSString *uneCouleur in couleurs)NSLog(@"couleur %@", uneCouleur);

Étienne Payet (DMI) Prog. iOS – L3 informatique 36 / 126

Page 37: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Gestion mémoire : création d’un objet

2 étapes :

1 allocation mémoire : +(id)alloc2 initialisation de l’objet : -(id)init

Etudiant * unEtudiant = [[Etudiant alloc] init];

Étienne Payet (DMI) Prog. iOS – L3 informatique 37 / 126

Page 38: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Gestion mémoire : initialisation d’un objet

re-définition de la méthode init :

-(id)init {if (self = [super init]) {

numero = 0;nom = @"";

}return self;

}

définition de méthodes init-like :

-(id)initWithNumero:(int)unNumero;-(id)initWithNumero:(int)unNumero nom:(NSString*)unNom;

Étienne Payet (DMI) Prog. iOS – L3 informatique 38 / 126

Page 39: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Gestion mémoire : destruction d’un objet

pas de garbage-collector

le dual de +(id)alloc est -(void)dealloc

ne jamais appeler dealloc

trouver l’équilibre allocation/désallocation

Étienne Payet (DMI) Prog. iOS – L3 informatique 39 / 126

Page 40: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Gestion mémoire : compter les références

chaque objet a un compteur de références :tant que compteur > 0, l’objet peut vivredès que compteur ≤ 0, l’objet est détruit

+(id)alloc crée un objet avec compteur = 1

-(id)retain incrémente le compteur (+1)

-(void)release décrémente le compteur (−1)

Étienne Payet (DMI) Prog. iOS – L3 informatique 40 / 126

Page 41: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Gestion mémoire : trouver l’équilibre

Etudiant * unEtudiant = [[Etudiant alloc] initWithNumero:007];...[unEtudiant release];

Etudiant * unEtudiant = [[Etudiant alloc] initWithNumero:007];...[unEtudiant release];[unEtudiant identite]; // CRASH !!

Étienne Payet (DMI) Prog. iOS – L3 informatique 41 / 126

Page 42: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Gestion mémoire : champs d’un objet

classe Etudiant avec les champs d’instance nom et binome :

- (void)setNom:(NSString*)unNom {if (nom != unNom) {

[nom release];nom = [unNom copy];

}}- (void)setBinome:(Etudiant*)unBinome {

if (binome != unBinome) {[binome release];binome = [unBinome retain];

}}-(void)dealloc {

[nom release];[binome release];

}

Étienne Payet (DMI) Prog. iOS – L3 informatique 42 / 126

Page 43: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Gestion mémoire : méthode retournant un objet

- (NSString*)identite {NSString * resultat;resultat = [[NSString alloc] initWithFormat:@"%d-%@",numero,nom];[resultat release];return resultat;

}

NON : à la fin de la méthode, la chaîne de caractères créée est desallouée

Étienne Payet (DMI) Prog. iOS – L3 informatique 43 / 126

Page 44: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Gestion mémoire : méthode retournant un objet

- (NSString*)identite {NSString * resultat;resultat = [[NSString alloc] initWithFormat:@"%d-%@",numero,nom];return resultat;

}

OK : l’objet qui reçoit le résultat doit se charger du release

Étienne Payet (DMI) Prog. iOS – L3 informatique 44 / 126

Page 45: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Gestion mémoire : méthode retournant un objet

autorelease :

indique qu’un release va être envoyé à l’objet . . . bientôtéquivalent à un sursis

- (NSString*)identite {NSString * resultat;resultat = [[NSString alloc] initWithFormat:@"%d-%@",numero,nom];return [resultat autorelease]; //resultat existe... pour le moment

}

OK : l’objet qui reçoit le résultat doit faire un retain

Étienne Payet (DMI) Prog. iOS – L3 informatique 45 / 126

Page 46: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Gestion mémoire : comment savoir ?

l’objet qui reçoit doit-il faire release ou retain ?

convention :si le nom de la méthode appelée contient alloc, init ou copy, l’objet quireçoit le résultat doit se charger du release

sinon, le résultat est en autorelease

Étienne Payet (DMI) Prog. iOS – L3 informatique 46 / 126

Page 47: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Propriétés

pour chaque attribut :

remplacent la déclaration et l’implémentation des méthodes d’accès(getters/setters)

des qualificatifs permettent de spécifier le comportement enenvironnement multi-thread, le mode d’accès (lecture/écriture) et lagestion mémoire

Étienne Payet (DMI) Prog. iOS – L3 informatique 47 / 126

Page 48: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Propriétés : dans le .h

@interface Etudiant: NSObject

@property (nonatomic,readonly,copy) NSString * nom;@property (nonatomic,readwrite,assign) int numero;

@end

Étienne Payet (DMI) Prog. iOS – L3 informatique 48 / 126

Page 49: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Propriétés : dans le .m

@implementation Etudiant

@synthesize nom;@synthesize numero;

...

@end

ou

@implementation Etudiant

@synthesize nom, numero;

...

@end

Étienne Payet (DMI) Prog. iOS – L3 informatique 49 / 126

Page 50: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Propriétés : atomicité des accès

comportement en environnement multi-thread

2 qualificatifs possibles :

atomic (par défaut) : performances dégradées

nonatomic

Étienne Payet (DMI) Prog. iOS – L3 informatique 50 / 126

Page 51: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Propriétés : accès à l’attribut

2 qualificatifs possibles :

readonly : seule une méthode de lecture (getter) est créée

readwrite (par défaut) : une méthode de lecture (getter) et uneméthode d’écriture (setter) sont créées

Étienne Payet (DMI) Prog. iOS – L3 informatique 51 / 126

Page 52: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Propriétés : gestion mémoire

3 qualificatifs possibles :

assign (par défaut) : le setter réalise une affectation simple

retain : le setter fait un retain

copy : le setter crée un nouvel objet

Étienne Payet (DMI) Prog. iOS – L3 informatique 52 / 126

Page 53: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Propriétés : gestion mémoire

assign- (void)setBinome:(Etudiant*)unBinome { binome = unBinome; }

retain- (void)setBinome:(Etudiant*)unBinome {

if (binome != unBinome) {[binome release];binome = [unBinome retain];

}}

copy- (void)setBinome:(Etudiant*)unBinome {

if (binome != unBinome) {[binome release];binome = [unBinome copy];

}}

Étienne Payet (DMI) Prog. iOS – L3 informatique 53 / 126

Page 54: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Automatic Reference Counting (ARC)

mécanisme fourni par les dernières versions d’Xcode

automatise la gestion des compteurs de références : ne plus utiliserretain, release, autorelease (le compilateur les ajouteautomatiquement)

nouveaux qualificatifs pour la gestion de la mémoire des propriétés detype objet : strong (par défaut) et weak

Étienne Payet (DMI) Prog. iOS – L3 informatique 54 / 126

Page 55: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice : Hello World !

la couleur du texte change à chaqueaffichage

Étienne Payet (DMI) Prog. iOS – L3 informatique 55 / 126

Page 56: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice : Dizainier

Étienne Payet (DMI) Prog. iOS – L3 informatique 56 / 126

Page 57: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Plan

1 Introduction

2 Anatomie d’une application iOS

3 Déploiement d’une application

4 Objective C

5 Éléments de base des interfaces graphiques

6 Présentation sous forme de listes

7 Contrôleurs de vues

8 Persistance des données

Étienne Payet (DMI) Prog. iOS – L3 informatique 57 / 126

Page 58: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Fenêtre

toute application iOS a au moins une fenêtre (en général exactement une) :

instance de UIWindow

surface remplissant tout l’écran et accueillant des vues

Étienne Payet (DMI) Prog. iOS – L3 informatique 58 / 126

Page 59: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Vue

mécanisme de base pour l’interaction avec l’utilisateur :

instance de UIView

rectangle où on peut dessiner, sensible aux événements

contenue dans une fenêtre

tous les composants graphiques (widgets) d’iOS sont des vues :boutons, étiquettes, zones de texte, . . .

Étienne Payet (DMI) Prog. iOS – L3 informatique 59 / 126

Page 60: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Organisation hiérarchique des vues

chaque vue :

a une super-vue

peut avoir aucune, une seule ou plusieurs sous-vues

est propriétaire de ses sous-vues (elle fait un retain sur ses sous-vues)

Étienne Payet (DMI) Prog. iOS – L3 informatique 60 / 126

Page 61: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Création et organisation des vues

2 possibilités :

avec Storyboard

dans le code :

-(id)initWithFrame:(CGRect)aRect

-(void)addSubview:(UIView*)view

-(void)removeFromSuperview

. . .

Étienne Payet (DMI) Prog. iOS – L3 informatique 61 / 126

Page 62: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Associer une vue à l’application

compléter l’application delegate :application:DidFinishLaunchingWithOptions

allocation/initialisation de la vue :

CGRect appWindow = [window bounds];newView = [[MyView alloc] initWithFrame:appWindow];

création de la hiérarchie :

[window addSubview:newView];

Étienne Payet (DMI) Prog. iOS – L3 informatique 62 / 126

Page 63: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Position et taille des vues

2 propriétés de type CGRect :

frame = rectangle de la vue, dans le système de coordonnées de lasuper-vue

bounds = rectangle de la vue, dans le système de coordonnées de lavue elle-même

struct CGRect { | struct CGPoint { | struct CGSize {CGPoint origin; | CGFloat x; | CGFloat width;CGSize size; | CGFloat y; | CGFloat height;

}; | }; | };

Étienne Payet (DMI) Prog. iOS – L3 informatique 63 / 126

Page 64: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Construire ses propres vues

créer une classe héritant de UIView :

affichage :

-(void)drawRect:(CGRect)rect

capture des événements tactiles :

-(void)touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event

-(void)touchesMoved:(NSSet*)touches withEvent:(UIEvent*)event

-(void)touchesEnded:(NSSet*)touches withEvent:(UIEvent*)event

forcer le rafraîchissement :

-(void)setNeedsDisplay

Étienne Payet (DMI) Prog. iOS – L3 informatique 64 / 126

Page 65: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Construire ses propres vues

réagir à une secousse :

-(BOOL)canBecomeFirstResponder { return YES; }

dans initWithFrame :

[self becomeFirstResponder];

toute secousse provoque l’exécution de la méthode :

-(void)motionBegan:(UIEventSubtype)motionwithEvent:(UIEvent*)event

Étienne Payet (DMI) Prog. iOS – L3 informatique 65 / 126

Page 66: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Dessiner en 2D dans une vue

CoreGraphics (CG) :

bibliothèque complète de dessin

fonctions C, pas d’objets

les fonctions utilisent un contexte graphique :

UIGraphicsGetCurrentContext() dans drawRect

formes, couleurs, polices, . . .

Étienne Payet (DMI) Prog. iOS – L3 informatique 66 / 126

Page 67: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Dessiner en 2D dans une vue

un rectangleCGRect square = CGRectMake(50, 50, 250, 250);CGContextAddRect(context, square);CGContextStrokePath(context); // dessine le contour

un disqueCGContextAddArc(context, 200, 200, 70, 0, M_PI*2, YES);CGContextFillPath(context); // peint le disque

un triangleCGContextBeginPath(context);CGContextMoveToPoint(context, 75, 10);CGContextAddLineToPoint(context, 10, 150);CGContextAddLineToPoint(context, 160, 150);CGContextClosePath(context);CGContextStrokePath(context); // dessine le contour

Étienne Payet (DMI) Prog. iOS – L3 informatique 67 / 126

Page 68: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Couleurs et polices

-(void)drawRect:(CGRect)rect {CGContextRef context = UIGraphicsGetCurrentContext();CGContextSetLineWidth(context, 4);

[[UIColor redColor] setStroke];[[UIColor colorWithRed:0.3 green:0.5 blue:0 alpha:0.9] setFill];

CGRect square = CGRectMake(50, 100, 200, 200);CGContextAddRect(context, square);

CGContextDrawPath(context, kCGPathFillStroke);

[[UIColor blueColor] setFill];square.origin.x += 10; square.origin.y += 10;NSString *message = @"truc";UIFont *font = [UIFont boldSystemFontOfSize:20];[message drawInRect:square withFont:font];

}

Étienne Payet (DMI) Prog. iOS – L3 informatique 68 / 126

Page 69: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Couleurs et polices

le code précédent donne :

Étienne Payet (DMI) Prog. iOS – L3 informatique 69 / 126

Page 70: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Scroll et zoom : UIScrollView + UIScrollViewDelegate

@interface ViewController : UIViewController <UIScrollViewDelegate> {

MyView *maVue; // la vue sur laquelle les scrolls et// les zooms seront actifs

}

@property (weak, nonatomic) IBOutlet UIScrollView *maScrollView;

@end

dans Storyboard :indiquer que le délégué (delegate) de la Scroll View est le ViewControllerfixer les valeurs min et max du zoom

Étienne Payet (DMI) Prog. iOS – L3 informatique 70 / 126

Page 71: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Scroll et zoom : UIScrollView + UIScrollViewDelegate

@implementation ViewController

- (void)viewDidLoad {[super viewDidLoad];CGRect square = CGRectMake(0, 0, 1500, 1500);maVue = [[MyView alloc] initWithFrame:square];[[self maScrollView] addSubview:maVue];[[self maScrollView] setContentSize:[maVue bounds].size];[[self maScrollView] setContentOffset:[maVue center]];

}

-(UIView*)viewForZoomingInScrollView:(UIScrollView *)scrollView {return maVue;

}...@end

Étienne Payet (DMI) Prog. iOS – L3 informatique 71 / 126

Page 72: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Faire disparaître le clavier d’un TextField

@interface ViewController : UIViewController <UITextFieldDelegate>

@property (weak, nonatomic) IBOutlet UITextField *monTextField;...@end

@implementation ViewController...- (BOOL)textFieldShouldReturn:(UITextField *)textField {

if (textField == monTextField)[textField resignFirstResponder];

return YES;}@end

dans Storyboard indiquer que le délégué du TextField est leViewController

Étienne Payet (DMI) Prog. iOS – L3 informatique 72 / 126

Page 73: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice : Cercles

créer une classe CerclesView

compléter drawRect : dessiner20 cercles gris, position auhasard, rayon croissant,épaisseur du trait : 5 pixels

une secousse efface l’écran etdessine 20 nouveaux cercles

scroll + zoom

Étienne Payet (DMI) Prog. iOS – L3 informatique 73 / 126

Page 74: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice : Cercles (variante)

Étienne Payet (DMI) Prog. iOS – L3 informatique 74 / 126

Page 75: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice : Cercles (variante)

gérer le cas où l’utilisateur a laissé une zone de texte vide

tenir compte des changements d’orientation de l’écran

anglais par défaut + proposer une version françaisevoir le premier chapitre du cours de M1

2 zones de texte de même taille occupant la largeur de l’écran ?

Étienne Payet (DMI) Prog. iOS – L3 informatique 75 / 126

Page 76: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Plan

1 Introduction

2 Anatomie d’une application iOS

3 Déploiement d’une application

4 Objective C

5 Éléments de base des interfaces graphiques

6 Présentation sous forme de listes

7 Contrôleurs de vues

8 Persistance des données

Étienne Payet (DMI) Prog. iOS – L3 informatique 76 / 126

Page 77: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Tables

classe UITableViewController(sous-classe de UIViewController)

présentation des données :une seule colonne, plusieurs lignes (cellules)découpage en sectionsdéfilement verticalgestion optimisée de la mémoire

Étienne Payet (DMI) Prog. iOS – L3 informatique 77 / 126

Page 78: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Styles de présentation

UITableViewStylePlain UITableViewStyleGrouped

Étienne Payet (DMI) Prog. iOS – L3 informatique 78 / 126

Page 79: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Composants

une en-tête et un pied-de-page

des sections, chacune composée :

d’une en-tête et d’un pied-de-page

de cellules

Étienne Payet (DMI) Prog. iOS – L3 informatique 79 / 126

Page 80: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Les données

affichage à la demande

seules les données affichées sont allouées

les données proviennent d’une source (ex : un tableau, une base dedonnées. . . )

Étienne Payet (DMI) Prog. iOS – L3 informatique 80 / 126

Page 81: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Les méthodes à implémenter

-tableView:cellForRowAtIndexPath:

-numberOfSectionsInTableView:

-tableView:numberOfRowsInSection:

-tableView:titleForHeaderInSection:

-tableView:titleForFooterInSection:

. . .

Étienne Payet (DMI) Prog. iOS – L3 informatique 81 / 126

Page 82: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exemple d’implémentation

-(NSInteger)numberOfSectionsInTableView:(UITableView*)tableView {return 2;

}

-(NSInteger)tableView:(UITableView*)tableViewnumberOfRowsInSection:(NSInteger)section {

if (section == 0) return 3;else return 1;

}

-(NSString*) tableView:(UITableView*)tableViewtitleForHeaderInSection:(NSInteger)section {

if (section == 0) return @"Professionnel";else return @"Personnel";

}

Étienne Payet (DMI) Prog. iOS – L3 informatique 82 / 126

Page 83: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Affichage

attribut tableView (instance de UITableView) répond aux méthodes :

reloadData (rafraîchit l’affichage)

insertRowsAtIndexPaths:withRowAnimation:

deleteRowsAtIndexPaths:withRowAnimation:

setTableHeaderView: (en-tête de la table)

setTableFooterView: (pied-de-page de la table)

Étienne Payet (DMI) Prog. iOS – L3 informatique 83 / 126

Page 84: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Comment remplir une cellule

implémenter tableView:cellForRowAtIndexPath:

cette méthode renvoie la cellule pointée par l’index path fourni enargument

index path = (numéro section, numéro ligne)

Étienne Payet (DMI) Prog. iOS – L3 informatique 84 / 126

Page 85: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exemple : afficher l’index path de chaque cellule

-(UITableViewCell*)tableView:(UITableView*)tableViewcellForRowAtIndexPath:(NSIndexPath*)indexPath {

UITableViewCell *cell = ...;

...

[[cell textLabel] setText:[NSString stringWithFormat:@"section: %d, ligne: %d",

[indexPath section],[indexPath row]

]];

return cell;}

Étienne Payet (DMI) Prog. iOS – L3 informatique 85 / 126

Page 86: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Réutilisation des cellules

-(UITableViewCell*)tableView:(UITableView*)tableViewcellForRowAtIndexPath:(NSIndexPath*)indexPath {

UITableViewCell *cell =[tableView dequeueReusableCellWithIdentifier:@"Cell"

forIndexPath:indexPath];

...

return cell;}

Étienne Payet (DMI) Prog. iOS – L3 informatique 86 / 126

Page 87: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Ajout de données

- (void)insertNewObject:(id)sender {// Ajout dans la source de données :[self.objects insertObject:

[[Tache alloc] initWithPriorite:0 andTitre:@"A faire"] atIndex:0];

// Ajout dans la vue :NSIndexPath *indexPath = [NSIndexPath indexPathForRow:0 inSection:0];[self.tableView insertRowsAtIndexPaths:@[indexPath]

withRowAnimation:UITableViewRowAnimationAutomatic];}

Étienne Payet (DMI) Prog. iOS – L3 informatique 87 / 126

Page 88: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Suppression de données

-(void)tableView:(UITableView*)tableViewcommitEditingStyle:(UITableViewCellEditingStyle)editingStyleforRowAtIndexPath:(NSIndexPath*)indexPath {

if (editingStyle == UITableViewCellEditingStyleDelete) {// Suppression dans la source de données :[self.objects removeObjectAtIndex:indexPath.row];

// Suppression dans la vue :[tableView deleteRowsAtIndexPaths:@[indexPath]

withRowAnimation:UITableViewRowAnimationFade];}

else if (editingStyle == UITableViewCellEditingStyleInsert) {...

}

}

Étienne Payet (DMI) Prog. iOS – L3 informatique 88 / 126

Page 89: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice : Tâches

Étienne Payet (DMI) Prog. iOS – L3 informatique 89 / 126

Page 90: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice : Tâches

choisir le template Master-Detail Application lors de la création duprojet

créer une classe Tache avec les propriétés :NSString* titreint priorite (∈ [0, 4])

créer un tableau de tâches initiales (voir transparent précédent)

le bouton + ajoute une tâche de titre À faire et de priorité 0

le bouton Edit permet de supprimer des tâches

Étienne Payet (DMI) Prog. iOS – L3 informatique 90 / 126

Page 91: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Déplacer des données

compléter la méthode

-(void)tableView:(UITableView*)tableViewmoveRowAtIndexPath:(NSIndexPath*)fromIndexPathtoIndexPath:(NSIndexPath*)toIndexPath

algorithme à implémenter :

trouver l’élément à déplacerle supprimer de la source de donnéesl’ajouter au bon endroit dans la source de données

l’affichage est actualisé automatiquement

Étienne Payet (DMI) Prog. iOS – L3 informatique 91 / 126

Page 92: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Déplacer des données

autoriser le déplacement :

- (BOOL)tableView:(UITableView *)tableViewcanMoveRowAtIndexPath:(NSIndexPath *)indexPath {

return YES;

}

Étienne Payet (DMI) Prog. iOS – L3 informatique 92 / 126

Page 93: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice : Tâches

créer 4 sections autoriser le déplacement

Étienne Payet (DMI) Prog. iOS – L3 informatique 93 / 126

Page 94: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Plan

1 Introduction

2 Anatomie d’une application iOS

3 Déploiement d’une application

4 Objective C

5 Éléments de base des interfaces graphiques

6 Présentation sous forme de listes

7 Contrôleurs de vues

8 Persistance des données

Étienne Payet (DMI) Prog. iOS – L3 informatique 94 / 126

Page 95: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Contrôleur de vues

instance de UIViewController

correspond à un écran de l’application

associé à une hiérarchie de vues

gère la création, la présentation, la destruction de ses vues

gère les interactions entre ses vues et d’autres objets de l’application

ex : UITableViewController, UISplitViewController, . . .

Étienne Payet (DMI) Prog. iOS – L3 informatique 95 / 126

Page 96: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Interactions entre contrôleurs de vues

la plupart des applications iOS sont constituées de plusieurscontrôleurs de vues entre lesquels l’utilisateur peut naviguer

Storyboard permet de créer des segues pour modéliser cesinteractions : avec un clic droit, tirer une flèche entre les contrôleursde vues qui interagissent

Storyboard permet d’attribuer un identifiant à un segue

Étienne Payet (DMI) Prog. iOS – L3 informatique 96 / 126

Page 97: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Interactions entre contrôleurs de vues

dans le contrôleur de vues parent, la méthode suivante est appelée justeavant l’activation d’un segue :

- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)s {if ([[segue identifier] isEqualToString:@"..."]) {

...}

}

Étienne Payet (DMI) Prog. iOS – L3 informatique 97 / 126

Page 98: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Affichage d’un contrôleur de vues

présentation modale

Navigation Controller

TabBar Controller

Étienne Payet (DMI) Prog. iOS – L3 informatique 98 / 126

Page 99: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Présentation modale

utilisation : interruption temporaire du programme pour

saisie immédiate d’informations par l’utilisateur

affichage temporaire d’informations

. . .

affichage à partir d’un autre contrôleur de vues (le parent)

Étienne Payet (DMI) Prog. iOS – L3 informatique 99 / 126

Page 100: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Présentation modale : exemple

Étienne Payet (DMI) Prog. iOS – L3 informatique 100 / 126

Page 101: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Création d’une présentation modale

deux possibilités :

dans Storyboard : créer un segue et choisir l’option present modally

dans le code, dans le contrôleur de vues parent :

UIViewController *controller = ...;[self presentViewController:controller

animated:YES completion:NULL];

Étienne Payet (DMI) Prog. iOS – L3 informatique 101 / 126

Page 102: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Terminer une présentation modale : solution 1

par ex. dans un contrôleur de vues présenté modalement pour éditer unetâche et dans lequel on trouve un bouton Sauver :

-(IBAction)sauver:(id)sender {...[monParent editionTerminee:tache]; // monParent = controleur de vue

}

dans le contrôleur de vues parent (par ex. un UITableViewController) :

- (void)editionTerminee:(Tache*)tache {...[self.tableView reloadData];[self dismissViewControllerAnimated:YES completion:NULL];

}

Étienne Payet (DMI) Prog. iOS – L3 informatique 102 / 126

Page 103: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Terminer une présentation modale : solution 2

ou alors :

-(IBAction)sauver:(id)sender {...[[self presentingViewController]

dismissViewControllerAnimated:YES completion:NULL];[monParent editionTerminee:tache]; // monParent = controleur de vue

}

et :

- (void)editionTerminee:(Tache*)tache {...[self.tableView reloadData];

}

Étienne Payet (DMI) Prog. iOS – L3 informatique 103 / 126

Page 104: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice : Tâches avec présentations modales

−→

appui sur bouton +

Étienne Payet (DMI) Prog. iOS – L3 informatique 104 / 126

Page 105: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice : Tâches avec présentations modales

−→

sélection d’une tâche appui sur bouton Edit

Étienne Payet (DMI) Prog. iOS – L3 informatique 105 / 126

Page 106: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Navigation Controller

instance de UINavigationController

gère une pile de contrôleurs de vues

sommet de la pile = contrôleur de vues actif (visible)

Étienne Payet (DMI) Prog. iOS – L3 informatique 106 / 126

Page 107: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Navigation Controller : exemple

Étienne Payet (DMI) Prog. iOS – L3 informatique 107 / 126

Page 108: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Navigation Controller : barre de navigation

en haut de l’écran

peut contenir :

le titre du contrôleur de vue courant

des boutons (par exemple un bouton pour revenir à l’écran précédent)

Étienne Payet (DMI) Prog. iOS – L3 informatique 108 / 126

Page 109: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Navigation Controller : installation

dans Storyboard ou

dans le code :

UITableViewController *tableController =[[UITableViewController alloc]

initWithStyle:UITableViewStylePlain];

UINavigationController *navigationController =[[UINavigationController alloc]

initWithRootViewController:tableController];

Étienne Payet (DMI) Prog. iOS – L3 informatique 109 / 126

Page 110: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Navigation Controller : push et pop

ajouter un contrôleur de vues au sommet de la pile :

UIViewController *viewController = ...;

[navigationControllerpushViewController:viewController animated:YES];

retirer un contrôleur de vues du sommet de la pile :

iOS s’en charge (ajoute automatiquement à la barre de navigation unbouton de retour vers le contrôleur précédent)

Étienne Payet (DMI) Prog. iOS – L3 informatique 110 / 126

Page 111: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Navigation Controller : gérer la barre de navigation

tous les détails sont dans l’objet navigationItem :

UINavigationItem *nav = [self navigationItem];

[nav setTitle:@"Truc"];

UIBarButtonItem *trucButton =[[UIBarButtonItem alloc]

initWithTitle:@"truc"style:UIBarButtonItemStyleBordered

target:selfaction:@selector(truc:)

];

[nav setLeftBarButtonItem:trucButton];

Étienne Payet (DMI) Prog. iOS – L3 informatique 111 / 126

Page 112: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Navigation Controller : boutons spéciaux

bouton Edit (basculer en mode édition) :

[[self navigationItem]setLeftBarButtonItem:[self editButtonItem]];

bouton + :

UIBarButtonItem *addButton =[[UIBarButtonItem alloc]

initWithBarButtonSystemItem:UIBarButtonSystemItemAddtarget:selfaction:@selector(addTruc)];

. . .

Étienne Payet (DMI) Prog. iOS – L3 informatique 112 / 126

Page 113: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

TabBar Controller

instance de UITabBarController

gère un tableau de contrôleurs de vues

une tab bar en bas de l’écran contient des items, chacun associé à uncontrôleur de vues du tableau

chaque item permet de sélectionner le contrôleur de vues associé et del’afficher

Étienne Payet (DMI) Prog. iOS – L3 informatique 113 / 126

Page 114: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

TabBar Controller : exemple

Étienne Payet (DMI) Prog. iOS – L3 informatique 114 / 126

Page 115: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

TabBar Controller : installation

dans Storyboard ou

dans le code :création d’une instance de UITabBarController

création d’un tableau de UIViewController

NSArray *viewControllers = [NSArray arrayWithObjects:...];

ajout du tableau dans le TabBarController

[tabBarController setViewControllers:viewControllers];

création de la filiation entre la fenêtre de l’application et le TabBarController

Étienne Payet (DMI) Prog. iOS – L3 informatique 115 / 126

Page 116: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

TabBar Controller : gérer la barre d’items

tous les détails sont dans l’objet tabBarItem :

UITabBarItem *bar = [self tabBarItem];[bar setTitle:@"Parametres"];[bar setImage:[UIImage imageNamed:@"sliders-small.png"]];

Étienne Payet (DMI) Prog. iOS – L3 informatique 116 / 126

Page 117: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice : Cercles

Étienne Payet (DMI) Prog. iOS – L3 informatique 117 / 126

Page 118: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Plan

1 Introduction

2 Anatomie d’une application iOS

3 Déploiement d’une application

4 Objective C

5 Éléments de base des interfaces graphiques

6 Présentation sous forme de listes

7 Contrôleurs de vues

8 Persistance des données

Étienne Payet (DMI) Prog. iOS – L3 informatique 118 / 126

Page 119: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Core Data

abstraction d’un modèle relationnel SQLite en un modèle objet :

une table A ↔ une classe A

une ligne dans la table A ↔ une instance de la classe A

une colonne de la table A ↔ une variable d’instance de la classe A

voir la documentation Apple

Étienne Payet (DMI) Prog. iOS – L3 informatique 119 / 126

Page 120: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Core Data

transforme les lignes des tables en objets :

création d’un objet ⇒ insertion d’une ligne dans la tablecorrespondante

modification d’un objet ⇒ mise à jour de la ligne correspondante

destruction d’un objet ⇒ suppression de la ligne correspondante

Étienne Payet (DMI) Prog. iOS – L3 informatique 120 / 126

Page 121: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Core Data

une table/classe est appelée entité

une colonne/variable d’instance est appelée attribut

un modèle (fichier .xcdatamodeld) décrit les entités, leurs attributset les relations entre les entités

Étienne Payet (DMI) Prog. iOS – L3 informatique 121 / 126

Page 122: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Core Data

un objet correspondant à une ligne d’une table

est une instance de la classe NSManagedObject

vit dans un contexte : la classe NSManagedObjectContext se chargede l’adéquation entre la base de données SQLite et les objets (elle gèreles créations, modifications, suppressions de données)

est récupéré grâce à une requête (classe NSFetchRequest) sur uncontexte

Étienne Payet (DMI) Prog. iOS – L3 informatique 122 / 126

Page 123: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Étienne Payet (DMI) Prog. iOS – L3 informatique 123 / 126

Page 124: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Création d’une application

sous XCode, pour créer une application utilisant Core Data avec affichagedes données sous forme de listes :

File → New → New Project...

Master-Detail Application

cocher Use Core Data

l’essentiel du code est créé automatiquement !

Étienne Payet (DMI) Prog. iOS – L3 informatique 124 / 126

Page 125: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Création d’une application

création des entités et des relations sous XCode :

cliquer sur le fichier dont le nom se termine par .xcdatamodeld

deux modes de visualisation (boutons Editor Style en bas à droite)

Étienne Payet (DMI) Prog. iOS – L3 informatique 125 / 126

Page 126: Programmation iOS L3 informatique - univ-reunion.frlim.univ-reunion.fr/staff/epayet/Teaching/Prog...Plan 1 Introduction 2 Anatomied’uneapplicationiOS 3 Déploiementd’uneapplication

Exercice : Tâches

rendez les tâches persistantes

Étienne Payet (DMI) Prog. iOS – L3 informatique 126 / 126