Presentation2 IOS 2020 Détaillée
Presentation2 IOS 2020 Détaillée
Presentation2 IOS 2020 Détaillée
iOS
Le système d'exploitation développé par Apple
pour ses appareils mobiles : l'iPhone, de l'iPad, ainsi
que de l'iPod Touch.
Il est dérivé de OS X
Anciennement iPhone OS, Ce nom a été changé le
7 juin 2010 pour iOS
Introduction
Xcode
Les modules
StoryBoard
Simulateur/Debugger
Instrument Profiler
Analyse statistique
Gestionnaire de versions intégrés
Git, Subversion
Accès directe à la documentation
Construction des interfaces
Deux approches
¨ Inscription gratuite
• Vous donne votre identifiant développeur Apple
(AppleID).
• Vous donne accès aux outils logiciels de base
(comme Xcode et iOS SDK) dont vous avez besoin
pour développer des applications pour iOS.
• Vous permet de tester vos applications iOS en
utilisant des simulateurs dans Xcode et devices
• Vous fournit la documentation Apple relative au
développement iOS.
• Vous permet de signaler les bugs et de participer
aux événements Apple
Rejoindre le programme développeur
Apple
Interactions
UIKit, Événements tactiles
Multimédia
Traitement images, Audio, Vidéo,
Animations, 2D, 3D
Noyau Unix
Fonctionnalités primaire du système
d’exploitation Sécurité, Alimentation,
Sockets
Cycle de vie de l'application iOS
1.application:willFinishLaunchingWithOptions:
1
6 2.application:didFinishLaunchingWithOptions:
4
3. applicationDidBecomeActive:
2
3 4. applicationWillResignActive:
5. applicationDidEnterBackground:
5
6. applicationWillEnterForeground:
7. applicationWillTerminate: si != suspended
7
Interface Graphique
Dans
• l’iOS en utilise le MVC.
Modèle , view, controlleur
• Modèle:
Quellques sont vos données?
• Vue: UIView (storyboard)
Où sont presentées les données?
• Controlleur UIViewController
Comment sont presentées les données?
Interface Graphique
Interface Graphique
UViews
• Une UIView : est une surface rectangulaire dans laquelle on
peut dessiner et gerer les evènements.
• Hierarchie : une vue a une superview et des sous- views.
Interface Graphique
Storyboard
• Storyboard un fichier qui contient tous les ecrans de
l'application et les liens etablis entre chaque ecran.
Interface Graphique
Widgets
• UIButton
• UITableView
• UITextView
• UIImageView
• UIWebView
• UIScrollView
• UILabel
• UITextField
• ....
Interface Graphique
Les contrôles
UILabel
• Les contrôles Label sont utilises
pour afficher des textes sur une ou
plusieurs lignes. Leur contenu ne
peut pas être modifie par
l'utilisateur.
• Les caracteristiques d'un Label
peuvent être definies dans Interface
Builder ou bien avec le code.
Label, TextField & Button
Exemple :
monLabel.text = "Un court texte affiché dans le
contrôle Label sur deux lignes"
monLabel.numberOfLines = 2
monLabel.font = UIFont( name:"Courier", size : 14)
monLabel.textAlignment = .center
Les contrôles
UITextField
• Les Text Field sont des
zones de texte monoligne.
• Ils sont utilises pour saisir
des donnees textuelles
courtes, comme un nom ou
un mot de passe
• Tout comme pour les
Labels, vous pouvez choisir
l'alignement, la police et la
couleur du texte, dans
Interface Builder ou avec du
code
Label, TextField & Button
Exemple :
monTextField.text = Un court texte affiché dans le
contrôle Label sur deux lignes"
monTextField.placeholder = "Entrez votre nom"
Label, TextField & Button
Les contrôles
UITextView
• Les Text View sont
des zones de texte
multiligne.
• Ce contrôle peut
être affiche en
lecture seule ou en
lecture/ecriture.
UILabel, UITextField & UIButton
Application : UIButton & UITextField
Alerte & Actions
Application : Devinette avec alertes et actions
Slider, Stiper & Segmented
UISlider, UIStiper & UISegmented
Le slider : (de classe UISlider)
la vue qui vous permet de choisir une valeur entre 0 et 99. Bien sûr, vous pouvez choisir les
valeurs que vous voulez.
UISlider, UISteper & UISegmented
Le steper : (de classe UISteper)
Un "+" et un "-" qui incrémente ou décrémente une valeur. Valeurs comprises entre 0 et 99
également avec un pas de 1.
Application : UISlider & UISegment
FENÊTRES, VUES ET CONTRÔLES
Les contrôles
UIImageView
• Le contrôle Image
View permet
d'afficher une image.
• Les images sont
chargees via des
objets UIImage.
FENÊTRES, VUES ET CONTRÔLES
Exemple :
Image dans Assets.xcassets
*(Allow Arbitrary Loads key to YES under App Transport Security Settings
dictionary in your .plist file)
Navigation Bar & Toolbar
Youssef
BALOUKI
Sélection parmi des choix multiples
UIPickerView
Objectif : permettre aux utilisateurs de votre application de
sélectionner à partir d'une liste de valeurs.
Youssef
BALOUKI
Sélection parmi des choix multiples
UIPickerView
Youssef
BALOUKI
Sélection d'une date dans un contrôle
spécialisé :UIDatePicker
* Le contrôle Date Picker est très proche du contrôle Picker View,
Youssef
BALOUKI
Sélection d'une date dans un contrôle
spécialisé :UIDatePicker
p_dpk.datePickerMode = .date
Youssef
BALOUKI
Sélection d'une date dans un contrôle
spécialisé :UIDatePicker
Youssef
BALOUKI
Sélection d'une date dans un contrôle
spécialisé :UIDatePicker
Youssef
BALOUKI
Recognizer Gesture
Recognizer Gesture
Sélection d’une image:
UIImagePickerController
Sélection d'une image :UIImagePickerController
Youssef
BALOUKI
Configurer Info.plist.
Youssef
BALOUKI
Table view
Youssef
BALOUKI
La réutilisation des cellules de table
Youssef
BALOUKI
La réutilisation des cellules de table
Youssef
BALOUKI
Loading a list into a Table View
Personnaliser Table View
Youssef
BALOUKI
Loading a list into a Table View
Youssef
BALOUKI
Personnaliser Table View
Personnaliser Table View
Youssef
BALOUKI
TP :
Navigation : Segue
Segue Personnalisé
Segue Personnalisé
Segue Personnalisé : Sélection dans TableView
Segue Personnalisé : Sélection dans TableView
Segue Personnalisé : Sélection dans TableView
Tab Application
Une vue secondaire pour l’ajout
Une vue secondaire pour l’ajout
Loading a list & Delete Row
Youssef
BALOUKI
Stockage Permanent :UserDefaults :
Youssef
BALOUKI
Costomized Cell
Image Picker
Image Picker
TableView avec UiImagePicker
Mode Programmation
Solution
Utilisation de la classe :UIButton.
Youssef
BALOUKI
Ajout de boutons à l'interface utilisateur
avec UIButton
Youssef
BALOUKI
Définir le bouton dans le view controller
Youssef
BALOUKI
Définir le bouton dans le view controller
Youssef
BALOUKI
Youssef
BALOUKI
Personnaliser un UIButton
Création, utilisation et Personnalisation
de commutateurs avec : UISwitch
Objectif : la possibilité d'activer ou désactiver une option.
: la clasee UISwich
Youssef
BALOUKI
Création, utilisation et Personnalisation
de commutateurs avec : UISwitch
Objectif : la possibilité d'activer ou désactiver une option.
: la clasee UISwich
Youssef
BALOUKI
Affichage des alerts et des actions
(action sheet)
Objectif : afficher des vues d'alerte et / ou des actions à l'utilisateur.
- UIAlertController
Affichage des alerts et des actions
(action sheet)
les étapes pour créer une vue d'alerte simple ou une action:
Youssef
BALOUKI
Ajouter des actions sheets
Youssef
BALOUKI
Slider
Youssef
BALOUKI
Slider
Slider
Youssef
BALOUKI
Regroupement d'options avec
UISegmentedControl
Youssef
BALOUKI
Regroupement d'options avec
UISegmentedControl
Youssef
BALOUKI
Regroupement d'options avec
UISegmentedControl
Youssef
BALOUKI
les options de partage avec
UIActivityViewController
les options de partage avec
UIActivityViewController
Ajout d’une image au navigation Bar
Objectif :Vous souhaitez afficher une image au lieu de texte comme titre du
contrôleur de vue en cours sur le contrôleur de navigation.
Ajout du bouton au navigation Bar
avec UIBarButtonItem
Youssef
BALOUKI
Ajout du bouton + au navigation Bar
avec UIBarButtonItem
Ajout switch au navigation Bar
avec UIBarButtonItem
Ajout du segment au navigation Bar
avec UIBarButtonItem
Ajout du segment au navigation Bar
avec UIBarButtonItem
Rating Contrôle
Step 1: Création d’un Horizontal Stack view
Rating Contrôle
Step 2 : Création d’une classe de type StackView
Rating Contrôle
Step 3 : Définir une fonction qui pose des boutons étoiles dans le StackView
Rating Contrôle
Step4 : Définr l’action de vote (choisir le nombre des étoiles)
Rating Contrôle
Step 6 : Lier le StackView sur storyBoard avec la classe MaEvaluation
Stockage persistants : CoreData
Core Data est une base de données locale, munie
d'une API orientée objet.
les données sont stockées dans une base de données
SQLite.
les données sont stockées sur le téléphone et pas sur un
serveur distant, cloud ou ….
Core Data transforme tout en objets Swift, puis les
stocke en SQLite.
Core Data
Complex/Offline
Enregistrer et Annuler(undo)
Tri et Filtrage
Réduction du code
Gestion optimale de la mémoire
Affichage facile des données
Data GUI (prend en charge les types de stokage persitants :XML &
SQLite)
Core Data
Core Data est considéré comme :
Un graph d'objets conçu pour gérer les objets de
données.
Un cadre de mapping objet-relationnel
Fichiers
DataModel.xcdatamodeld
DataModel.momd
DataModel.sqlite
Collection de descriptions d’entités
S’initialiser avec
Compilé en.
ModelDonnees.xcdatamodled
Stockage persistants : CoreData
Une instance de NSManagedObjectContext
représente un seul "espace objet" dans une
application. Sa principale responsabilité est de
gérer une collection d'objets. Ces objets forment un
groupe d'objets de modèle apparentés qui
représentent une vue cohérente en interne d'un ou
plusieurs stockage persistants. Une seule instance
d'objet (géré) existe dans un seul et même contexte,
mais plusieurs copies d'un objet peuvent exister
dans différents contextes. Ainsi, l'élimination des
objets est portée dans un contexte particulier.
ModelDonnees.sqlite
NSManagedObjectContext
Créé par le
déveoppeur
Compilé en.
ModelDonnees.xcdatamodled
NSManagedObject
NSManagedObject
NSManagedObject manipule
ModelDonnees.sqlite
Fournir les objets
NSPersistentStoreCoordinator
S’initialiser avec
NSManaged ModelObject se sert du modèle pour convertir les
données stockées dans la base en
objets.
Compilé en.
ModelDonnees.xcdatamodled
NSPersistentCoordinator-iOS10
ModelDonnees.sqlite
Stocker/récupérer les données
S’initialiser avec
se sert du modèle pour convertir les données en objets.
ModelDonnees.momd
NSPersistentContainer
Compilé en.
Créé par le
déveoppeur
ModelDonnees.xcdatamodled
NSPersistentContainer
Permet de réduire l'installation de Core Data à seulement
trois étapes :
Inserer un Etudiant :
Deuxième
• let v = UIImagePNGRepresentation(UIImage(named: "cloud_small")!) façon pour
• newEtudiant.setValue("farah", forKey: "nom") insérer un
newEtudiant.setValue(293, forKey: "age")
•
étudiant
• newEtudiant.setValue(v, forKey: "photo”)
Youssef
BALOUKI
TP : Map + Géolocalisation