Connexion
S'inscrire
Actualités
Quoi de neuf
Activités générales
Auteurs
Forums
Nouveaux messages
Rechercher un forum
Wiki
Pages
Dernière activité
Quoi de neuf
Nouveaux messages
Nouveaux messages de profil
Activités générales
Membres
Membres inscrits
Visiteurs actuels
Nouveaux messages de profil
Rechercher dans les messages des profils
Teams
Créé ton équipe
Quoi de neuf ?
Nouveaux messages
Rechercher un forum
Menu
Connexion
S'inscrire
Install the app
Install
Forums
Forums généraux
Informatique
Développement
Le Swift : Développement d'une application iOS | Zoom sur des composants #1 | Partie 3
JavaScript is disabled. For a better experience, please enable JavaScript in your browser before proceeding.
Vous utilisez un navigateur non à jour ou ancien. Il ne peut pas afficher ce site ou d'autres sites correctement.
Vous devez le mettre à jour ou utiliser un
navigateur alternatif
.
Répondre à la discussion
Message
<blockquote data-quote="Mathieu ?" data-source="post: 6995048" data-attributes="member: 712193"><p style="text-align: center">[ATTACH=full]103326[/ATTACH]</p> <p style="text-align: center"></p> <p style="text-align: center"><span style="font-family: 'Poppins'"><span style="font-size: 15px"><a href="https://reality-gaming.fr/threads/le-swift-developpement-dune-application-ios-les-composants-controller-partie-1.584830/" target="_blank">Le Swift : Développement d'une application iOS | Les composants controller | Partie 1</a></span></span></p> <p style="text-align: center"><span style="font-family: 'Poppins'"><a href="https://reality-gaming.fr/threads/le-swift-developpement-dune-application-ios-les-composants-les-plus-utilises-partie-2.584853/" target="_blank">Le Swift : Développement d'une application iOS | Les composants les plus utilisés | Partie 2</a></span></p> <p style="text-align: center"></p> <p style="text-align: center"><strong><span style="font-family: 'Open Sans'"><span style="font-size: 18px">Zoom sur TableView & TableViewController</span></span></strong></p> <p style="text-align: center"></p> <p style="text-align: center"><span style="font-family: 'MyriadPro Light'">La TableView et la TableViewController sont deux éléments similaire comme expliquer dans les parties précédentes. Je vais donc expliquer les différentes fonction en prenant la TableViewController et je passerais rapidement sur l’intégration de la TableView sur une ViewController.</span></p> <p style="text-align: center"></p> <p style="text-align: center"><span style="font-family: 'MyriadPro Light'">Lorsque vous ajouter un Controller vous devez aussi créer le fichier CocoaTouch assigner a celui-ci (Tout seras expliquer dans une prochaine partie).</span></p><p></p><p><span style="font-family: 'MyriadPro Light'"><strong>Le fichier d'une table view controller contient ce code par défaut:</strong></span></p><p>[CODE=swift]//</p><p>// TUTOTableViewController.swift</p><p>// tutoRG</p><p>//</p><p>// Created by Marent on 28/12/2016.</p><p>// Copyright © 2016 Marent. All rights reserved.</p><p>//</p><p></p><p>import UIKit</p><p></p><p>class TUTOTableViewController: UITableViewController {</p><p></p><p> override func viewDidLoad() {</p><p> super.viewDidLoad()</p><p></p><p> // Uncomment the following line to preserve selection between presentations</p><p> // self.clearsSelectionOnViewWillAppear = false</p><p></p><p> // Uncomment the following line to display an Edit button in the navigation bar for this view controller.</p><p> // self.navigationItem.rightBarButtonItem = self.editButtonItem()</p><p> }</p><p></p><p> override func didReceiveMemoryWarning() {</p><p> super.didReceiveMemoryWarning()</p><p> // Dispose of any resources that can be recreated.</p><p> }</p><p></p><p> // MARK: - Table view data source</p><p></p><p> override func numberOfSections(in tableView: UITableView) -> Int {</p><p> // #warning Incomplete implementation, return the number of sections</p><p> return 0</p><p> }</p><p></p><p> override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {</p><p> // #warning Incomplete implementation, return the number of rows</p><p> return 0</p><p> }</p><p></p><p></p><p> override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {</p><p> let cell = tableView.dequeueReusableCell(withIdentifier: "reuseIdentifier", for: indexPath)</p><p></p><p> // Configure the cell...</p><p></p><p> return cell</p><p> }</p><p></p><p></p><p> /*</p><p> // Override to support conditional editing of the table view.</p><p> override func tableView(_ tableView: UITableView, canEditRowAt indexPath: IndexPath) -> Bool {</p><p> // Return false if you do not want the specified item to be editable.</p><p> return true</p><p> }</p><p> */</p><p></p><p> /*</p><p> // Override to support editing the table view.</p><p> override func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCellEditingStyle, forRowAt indexPath: IndexPath) {</p><p> if editingStyle == .delete {</p><p> // Delete the row from the data source</p><p> tableView.deleteRows(at: [indexPath], with: .fade)</p><p> } else if editingStyle == .insert {</p><p> // Create a new instance of the appropriate class, insert it into the array, and add a new row to the table view</p><p> }</p><p> }</p><p> */</p><p></p><p> /*</p><p> // Override to support rearranging the table view.</p><p> override func tableView(_ tableView: UITableView, moveRowAt fromIndexPath: IndexPath, to: IndexPath) {</p><p></p><p> }</p><p> */</p><p></p><p> /*</p><p> // Override to support conditional rearranging of the table view.</p><p> override func tableView(_ tableView: UITableView, canMoveRowAt indexPath: IndexPath) -> Bool {</p><p> // Return false if you do not want the item to be re-orderable.</p><p> return true</p><p> }</p><p> */</p><p></p><p> /*</p><p> // MARK: - Navigation</p><p></p><p> // In a storyboard-based application, you will often want to do a little preparation before navigation</p><p> override func prepare(for segue: UIStoryboardSegue, sender: Any?) {</p><p> // Get the new view controller using segue.destinationViewController.</p><p> // Pass the selected object to the new view controller.</p><p> }</p><p> */</p><p></p><p>}</p><p>[/CODE]</p><p></p><p style="text-align: center"><span style="font-family: 'MyriadPro Light'">Nous pouvons y retrouver <span style="color: #0080ff">2 fonction</span> présente sur tout les controller qui sont <span style="color: #0080ff">viewDidLoad </span>et <span style="color: #0080ff">didReceiveMemoryWarning</span>. La première fonction permet de faire une ou plusieurs action au moment du chargement de la View et la deuxième qui n'est jamais utiliser enfin autrement dit elle n'est jamais appeler par le programme pour être exécuté a moins que la mémoire de l'appareil soit bas.</span></p> <p style="text-align: center"></p> <p style="text-align: center"><span style="font-family: 'MyriadPro Light'">Il y a <span style="color: #0080ff">trois fonctions</span> importante pour avoir une Table View Controller fonctionelle qui sont : <strong>numberOfSections</strong>, <strong>numberOfRowsInsection</strong>, <strong>cellForRowAt</strong>.</span></p> <p style="text-align: center"></p> <p style="text-align: center"><span style="font-family: 'MyriadPro Light'">Je vais vous présenter la table view avec le minimum c'est a dire 1 section et la cellule de base (Titre seulement).</span></p> <p style="text-align: center"></p><p><u><strong><span style="font-family: 'MyriadPro Light'">Commençons tout de suite par mettre le nombre de section a 1 ce qui nous donne:</span></strong></u></p><p>[CODE=swift]</p><p> override func numberOfSections(in tableView: UITableView) -> Int {</p><p> // #warning Incomplete implementation, return the number of sections</p><p> return 1</p><p> }</p><p>[/CODE]</p><p></p><p><u><strong><span style="font-family: 'MyriadPro Light'">Ensuite nous allons renseigner le nombre de cellule (lignes) que nous voulons :</span></strong></u></p><p>[CODE=swift] override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {</p><p> // #warning Incomplete implementation, return the number of rows</p><p> return 4 //Mettez le nombre que vous shouaitez !</p><p> }[/CODE]</p><p></p><p><u><span style="font-family: 'MyriadPro Light'"><strong>Et enfin nous allons configurer la fonction qui va permettre de remplir les lignes, dans un premier temps elles auront tous le même contenue :</strong></span></u></p><p>[CODE=swift] override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {</p><p> let cell = tableView.dequeueReusableCell(withIdentifier: "cellname")! as UITableViewCell</p><p></p><p> // Configure the cell...</p><p> cell.textlabel?.text = "Swift Tuto"</p><p> return cell</p><p> }[/CODE]</p><p></p><p style="text-align: center"><span style="font-family: 'MyriadPro Light'">Nous allons ensuite aller sur<span style="color: #0080ff"><strong> Main.storyboard</strong></span>, puis sélectionner la première cellule. Dans les paramètres a droite modifier sont identifier par celui renseigner dans le code qui est <span style="color: #ff0000"><strong>cellname</strong></span>. Vous pouvez maintenant appuyer sur le bouton <span style="color: #00b359">[fa]fa-play[/fa]</span> pour lancer votre application. Vous devriez obtenir ceci :</span></p><p></p><p style="text-align: center">[ATTACH=full]103328[/ATTACH]</p> <p style="text-align: center"></p> <p style="text-align: center"><span style="font-family: 'MyriadPro Light'">Voila vous avez maintenant les bases de la Table View & Table View Controller</span></p> <p style="text-align: center"></p> <p style="text-align: center"><span style="font-family: 'Open Sans'"><span style="font-size: 18px"><strong>Intégration d'une Table View a une View Controller</strong></span></span></p> <p style="text-align: center"></p> <p style="text-align: center"><span style="font-family: 'MyriadPro Light'">Pour intégrer une Table View rien de plus simple, glisser l’élément table View sur votre View puis relier les Outlets dataSource et delegate a la view controller en clickant dessus comme ceci :</span></p><p></p><p style="text-align: center">[ATTACH=full]103330[/ATTACH][ATTACH=full]103331[/ATTACH]</p> <p style="text-align: center"></p> <p style="text-align: center"><span style="font-family: 'MyriadPro Light'">Une fois cela fais rendez vous dans le fichier swift de votre view controller</span></p> <p style="text-align: center"></p><p>Le code présent de base:</p><p>[CODE=swift]//</p><p>// ViewController.swift</p><p>// tutoRG</p><p>//</p><p>// Created by Marent on 28/12/2016.</p><p>// Copyright © 2016 Marent. All rights reserved.</p><p>//</p><p></p><p>import UIKit</p><p></p><p>class ViewController: UIViewController {</p><p></p><p> override func viewDidLoad() {</p><p> super.viewDidLoad()</p><p> // Do any additional setup after loading the view, typically from a nib.</p><p> }</p><p></p><p> override func didReceiveMemoryWarning() {</p><p> super.didReceiveMemoryWarning()</p><p> // Dispose of any resources that can be recreated.</p><p> }</p><p></p><p></p><p>}[/CODE]</p><p></p><p><span style="font-family: 'MyriadPro Light'"><strong>Nous allons devoir étendre notre classe pour la rendre compatible avec notre Table View pour cela ajouter a la place de ceci :</strong></span></p><p>[CODE=swift]class ViewController: UIViewController {[/CODE]</p><p><span style="font-family: 'MyriadPro Light'"><strong>Le code suivant:</strong></span></p><p>[CODE=swift]class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {[/CODE]</p><p></p><p><span style="font-family: 'MyriadPro Light'"><strong>Voila maintenant votre classe est compatible avec la tableview il ne vous reste plus qu'a y ajouter les 2 fonction qui permette le bon fonctionnement de la tableview :</strong></span></p><p>[CODE=swift]func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {</p><p> return 4</p><p> }</p><p> func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {</p><p> let cell = tableView.dequeueReusableCell(withIdentifier: "cellname")! as UITableViewCell</p><p> </p><p> cell.textLabel?.text = "Swift Tuto"</p><p> return cell</p><p> }</p><p>[/CODE]</p><p></p><p style="text-align: center"><span style="color: #000000"><span style="font-family: 'MyriadPro Light'"><span style="font-size: 15px">Conclusion la TableView n’est pas un éléments compliquer a coder il faut juste le coup de mains et ensuite de belle choses peuvent être faites. Nous verrons plus tard comment ajouter une action au swipe ou même comment déplacer des cellules <img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" class="smilie smilie--sprite smilie--sprite400" alt="::):" title="Smile ::):" loading="lazy" data-shortname="::):" /></span></span></span></p> <p style="text-align: center"></p> <p style="text-align: center"><span style="font-family: 'Poppins'"><a href="https://reality-gaming.fr/threads/le-swift-developpement-dune-application-ios-zoom-sur-des-composants-2-partie-4.585020/" target="_blank">Le Swift : Développement d'une application iOS | Zoom sur des composants #2 | Partie 4</a></span></p> <p style="text-align: center"></p> <p style="text-align: center"></p></blockquote><p></p>
[QUOTE="Mathieu ?, post: 6995048, member: 712193"] [CENTER][ATTACH=full]103326[/ATTACH] [FONT=Poppins][SIZE=4][URL='https://reality-gaming.fr/threads/le-swift-developpement-dune-application-ios-les-composants-controller-partie-1.584830/']Le Swift : Développement d'une application iOS | Les composants controller | Partie 1[/URL][/SIZE] [URL='https://reality-gaming.fr/threads/le-swift-developpement-dune-application-ios-les-composants-les-plus-utilises-partie-2.584853/']Le Swift : Développement d'une application iOS | Les composants les plus utilisés | Partie 2[/URL][/FONT] [B][FONT=Open Sans][SIZE=5]Zoom sur TableView & TableViewController[/SIZE][/FONT][/B] [FONT=MyriadPro Light]La TableView et la TableViewController sont deux éléments similaire comme expliquer dans les parties précédentes. Je vais donc expliquer les différentes fonction en prenant la TableViewController et je passerais rapidement sur l’intégration de la TableView sur une ViewController.[/FONT] [FONT=MyriadPro Light]Lorsque vous ajouter un Controller vous devez aussi créer le fichier CocoaTouch assigner a celui-ci (Tout seras expliquer dans une prochaine partie).[/FONT][/CENTER] [FONT=MyriadPro Light][B]Le fichier d'une table view controller contient ce code par défaut:[/B][/FONT] [CODE=swift]// // TUTOTableViewController.swift // tutoRG // // Created by Marent on 28/12/2016. // Copyright © 2016 Marent. All rights reserved. // import UIKit class TUTOTableViewController: UITableViewController { override func viewDidLoad() { super.viewDidLoad() // Uncomment the following line to preserve selection between presentations // self.clearsSelectionOnViewWillAppear = false // Uncomment the following line to display an Edit button in the navigation bar for this view controller. // self.navigationItem.rightBarButtonItem = self.editButtonItem() } override func didReceiveMemoryWarning() { super.didReceiveMemoryWarning() // Dispose of any resources that can be recreated. } // MARK: - Table view data source override func numberOfSections(in tableView: UITableView) -> Int { // #warning Incomplete implementation, return the number of sections return 0 } override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { // #warning Incomplete implementation, return the number of rows return 0 } override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "reuseIdentifier", for: indexPath) // Configure the cell... return cell } /* // Override to support conditional editing of the table view. override func tableView(_ tableView: UITableView, canEditRowAt indexPath: IndexPath) -> Bool { // Return false if you do not want the specified item to be editable. return true } */ /* // Override to support editing the table view. override func tableView(_ tableView: UITableView, commit editingStyle: UITableViewCellEditingStyle, forRowAt indexPath: IndexPath) { if editingStyle == .delete { // Delete the row from the data source tableView.deleteRows(at: [indexPath], with: .fade) } else if editingStyle == .insert { // Create a new instance of the appropriate class, insert it into the array, and add a new row to the table view } } */ /* // Override to support rearranging the table view. override func tableView(_ tableView: UITableView, moveRowAt fromIndexPath: IndexPath, to: IndexPath) { } */ /* // Override to support conditional rearranging of the table view. override func tableView(_ tableView: UITableView, canMoveRowAt indexPath: IndexPath) -> Bool { // Return false if you do not want the item to be re-orderable. return true } */ /* // MARK: - Navigation // In a storyboard-based application, you will often want to do a little preparation before navigation override func prepare(for segue: UIStoryboardSegue, sender: Any?) { // Get the new view controller using segue.destinationViewController. // Pass the selected object to the new view controller. } */ } [/CODE] [CENTER][FONT=MyriadPro Light]Nous pouvons y retrouver [COLOR=#0080ff]2 fonction[/COLOR] présente sur tout les controller qui sont [COLOR=#0080ff]viewDidLoad [/COLOR]et [COLOR=#0080ff]didReceiveMemoryWarning[/COLOR]. La première fonction permet de faire une ou plusieurs action au moment du chargement de la View et la deuxième qui n'est jamais utiliser enfin autrement dit elle n'est jamais appeler par le programme pour être exécuté a moins que la mémoire de l'appareil soit bas.[/FONT] [FONT=MyriadPro Light]Il y a [COLOR=#0080ff]trois fonctions[/COLOR] importante pour avoir une Table View Controller fonctionelle qui sont : [B]numberOfSections[/B], [B]numberOfRowsInsection[/B], [B]cellForRowAt[/B].[/FONT] [FONT=MyriadPro Light]Je vais vous présenter la table view avec le minimum c'est a dire 1 section et la cellule de base (Titre seulement).[/FONT] [/CENTER] [U][B][FONT=MyriadPro Light]Commençons tout de suite par mettre le nombre de section a 1 ce qui nous donne:[/FONT][/B][/U] [CODE=swift] override func numberOfSections(in tableView: UITableView) -> Int { // #warning Incomplete implementation, return the number of sections return 1 } [/CODE] [U][B][FONT=MyriadPro Light]Ensuite nous allons renseigner le nombre de cellule (lignes) que nous voulons :[/FONT][/B][/U] [CODE=swift] override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { // #warning Incomplete implementation, return the number of rows return 4 //Mettez le nombre que vous shouaitez ! }[/CODE] [U][FONT=MyriadPro Light][B]Et enfin nous allons configurer la fonction qui va permettre de remplir les lignes, dans un premier temps elles auront tous le même contenue :[/B][/FONT][/U] [CODE=swift] override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "cellname")! as UITableViewCell // Configure the cell... cell.textlabel?.text = "Swift Tuto" return cell }[/CODE] [CENTER][FONT=MyriadPro Light]Nous allons ensuite aller sur[COLOR=#0080ff][B] Main.storyboard[/B][/COLOR], puis sélectionner la première cellule. Dans les paramètres a droite modifier sont identifier par celui renseigner dans le code qui est [COLOR=#ff0000][B]cellname[/B][/COLOR]. Vous pouvez maintenant appuyer sur le bouton [COLOR=#00b359][fa]fa-play[/fa][/COLOR] pour lancer votre application. Vous devriez obtenir ceci :[/FONT][/CENTER] [CENTER][ATTACH=full]103328[/ATTACH] [FONT=MyriadPro Light]Voila vous avez maintenant les bases de la Table View & Table View Controller[/FONT] [FONT=Open Sans][SIZE=5][B]Intégration d'une Table View a une View Controller[/B][/SIZE][/FONT] [FONT=MyriadPro Light]Pour intégrer une Table View rien de plus simple, glisser l’élément table View sur votre View puis relier les Outlets dataSource et delegate a la view controller en clickant dessus comme ceci :[/FONT][/CENTER] [CENTER][ATTACH=full]103330[/ATTACH][ATTACH=full]103331[/ATTACH] [FONT=MyriadPro Light]Une fois cela fais rendez vous dans le fichier swift de votre view controller[/FONT] [/CENTER] Le code présent de base: [CODE=swift]// // ViewController.swift // tutoRG // // Created by Marent on 28/12/2016. // Copyright © 2016 Marent. All rights reserved. // import UIKit class ViewController: UIViewController { override func viewDidLoad() { super.viewDidLoad() // Do any additional setup after loading the view, typically from a nib. } override func didReceiveMemoryWarning() { super.didReceiveMemoryWarning() // Dispose of any resources that can be recreated. } }[/CODE] [FONT=MyriadPro Light][B]Nous allons devoir étendre notre classe pour la rendre compatible avec notre Table View pour cela ajouter a la place de ceci :[/B][/FONT] [CODE=swift]class ViewController: UIViewController {[/CODE] [FONT=MyriadPro Light][B]Le code suivant:[/B][/FONT] [CODE=swift]class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {[/CODE] [FONT=MyriadPro Light][B]Voila maintenant votre classe est compatible avec la tableview il ne vous reste plus qu'a y ajouter les 2 fonction qui permette le bon fonctionnement de la tableview :[/B][/FONT] [CODE=swift]func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { return 4 } func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { let cell = tableView.dequeueReusableCell(withIdentifier: "cellname")! as UITableViewCell cell.textLabel?.text = "Swift Tuto" return cell } [/CODE] [CENTER][COLOR=#000000][FONT=MyriadPro Light][SIZE=4]Conclusion la TableView n’est pas un éléments compliquer a coder il faut juste le coup de mains et ensuite de belle choses peuvent être faites. Nous verrons plus tard comment ajouter une action au swipe ou même comment déplacer des cellules ::):[/SIZE][/FONT][/COLOR] [FONT=Poppins][URL='https://reality-gaming.fr/threads/le-swift-developpement-dune-application-ios-zoom-sur-des-composants-2-partie-4.585020/']Le Swift : Développement d'une application iOS | Zoom sur des composants #2 | Partie 4[/URL][/FONT] [/CENTER] [/QUOTE]
Insérer les citations…
Vérification
Publier la réponse
Forums
Forums généraux
Informatique
Développement
Le Swift : Développement d'une application iOS | Zoom sur des composants #1 | Partie 3
Ce site utilise des cookies. En continuant à utiliser ce site, vous acceptez l'utilisation des cookies.
Acceptez
En savoir plus.…
Haut