web-dev-qa-db-fra.com

Exemple UITableView pour Swift

Je travaille avec Swift et iOS depuis plusieurs mois maintenant. Je connais pas mal de façons de faire les choses, mais je ne suis pas assez bon pour pouvoir simplement écrire des choses sans regarder. Dans le passé, j’appréciais Stack Overflow pour ses réponses rapides à mes problèmes récurrents (par exemple, exemple AsyncTask Android ).

UITableView d'iOS est dans cette catégorie pour moi. Je les ai fait plusieurs fois, mais j'oublie quels sont les détails. Je ne pouvais pas trouver une autre question sur StackOverflow qui ne demande qu'un exemple de base et je cherche quelque chose de plus court que la plupart des tutoriels en ligne (bien que celui-ci soit très bon).

Je fournis une réponse ci-dessous pour ma référence future et la vôtre.

49
Suragch

L'exemple ci-dessous est une adaptation et une simplification de n message plus long de We ❤ Swift. Voici à quoi ça va ressembler:

enter image description here

Créer un nouveau projet

Il peut s'agir simplement de l'application Single View habituelle.

Ajouter le code

Remplacez le code ViewController.Swift par le code suivant:

import UIKit
class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {

    // Data model: These strings will be the data for the table view cells
    let animals: [String] = ["Horse", "Cow", "Camel", "Sheep", "Goat"]

    // cell reuse id (cells that scroll out of view can be reused)
    let cellReuseIdentifier = "cell"

    // don't forget to hook this up from the storyboard
    @IBOutlet var tableView: UITableView!

    override func viewDidLoad() {
        super.viewDidLoad()

        // Register the table view cell class and its reuse id
        self.tableView.register(UITableViewCell.self, forCellReuseIdentifier: cellReuseIdentifier)

        // (optional) include this line if you want to remove the extra empty cell divider lines
        // self.tableView.tableFooterView = UIView()

        // This view controller itself will provide the delegate methods and row data for the table view.
        tableView.delegate = self
        tableView.dataSource = self
    }

    // number of rows in table view
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return self.animals.count
    }

    // create a cell for each table view row
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

        // create a new cell if needed or reuse an old one
        let cell:UITableViewCell = self.tableView.dequeueReusableCell(withIdentifier: cellReuseIdentifier) as UITableViewCell!

        // set the text from the data model
        cell.textLabel?.text = self.animals[indexPath.row]

        return cell
    }

    // method to run when table view cell is tapped
    func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
        print("You tapped cell number \(indexPath.row).")
    }
}

Lisez les commentaires dans le code pour voir ce qui se passe. Les points forts sont

  • Le contrôleur de vue adopte les protocoles UITableViewDelegate et UITableViewDataSource.
  • La méthode numberOfRowsInSection détermine le nombre de lignes dans la vue Table.
  • La méthode cellForRowAtIndexPath configure chaque ligne.
  • La méthode didSelectRowAtIndexPath est appelée chaque fois qu'une ligne est exploitée.

Ajouter une vue de table au storyboard

Faites glisser un UITableView sur votre contrôleur View. Utilisez la mise en page automatique pour épingler les quatre côtés.

enter image description here

Branchez les points de vente

Control faites glisser de la vue Table dans IB vers la sortie tableView dans le code.

Fini

C'est tout. Vous devriez pouvoir exécuter votre application maintenant.

Cette réponse a été testée avec Xcode 9 et Swift 4


Variations

Suppression de lignes

Vous devez uniquement ajouter une seule méthode au projet de base ci-dessus si vous souhaitez permettre aux utilisateurs de supprimer des lignes. Voir cet exemple de base pour savoir comment.

enter image description here

Espacement des lignes

Si vous souhaitez que les lignes soient espacées, voir cet exemple supplémentaire .

enter image description here

Cellules personnalisées

La disposition par défaut des cellules de la vue tableau peut ne pas correspondre à vos besoins. Consultez cet exemple pour vous aider à créer vos propres cellules personnalisées.

enter image description here

Hauteur de cellule dynamique

Parfois, vous ne voulez pas que chaque cellule ait la même hauteur. À partir de iOS 8, il est facile de régler automatiquement la hauteur en fonction du contenu de la cellule. Voir cet exemple pour tout ce dont vous avez besoin pour commencer.

enter image description here

Lectures complémentaires

173
Suragch

Par souci d'exhaustivité, et pour ceux qui ne souhaitent pas utiliser Interface Builder, voici une manière de créer le même tableau que dans La réponse de Suragch entièrement par programme - bien que la taille et la position soient différentes.

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource  {

    var tableView: UITableView = UITableView()
    let animals = ["Horse", "Cow", "Camel", "Sheep", "Goat"]
    let cellReuseIdentifier = "cell"

    override func viewDidLoad() {
        super.viewDidLoad()

        tableView.frame = CGRectMake(0, 50, 320, 200)
        tableView.delegate = self
        tableView.dataSource = self
        tableView.registerClass(UITableViewCell.self, forCellReuseIdentifier: cellReuseIdentifier)

        self.view.addSubview(tableView)
    }

    func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return animals.count
    }

    func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        let cell:UITableViewCell = tableView.dequeueReusableCellWithIdentifier(cellReuseIdentifier) as UITableViewCell!

        cell.textLabel?.text = animals[indexPath.row]

        return cell
    }

    func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
        print("You tapped cell number \(indexPath.row).")
    }

}

Assurez-vous que vous vous êtes rappelé de import UIKit.

23
Matt Le Fleur
//    UITableViewCell set Identify "Cell"
//    UITableView Name is  tableReport

UIViewController,UITableViewDelegate,UITableViewDataSource,UINavigationControllerDelegate, UIImagePickerControllerDelegate {

    @IBOutlet weak var tableReport: UITableView!  

    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
            return 5;
        }

        func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
            let cell = tableReport.dequeueReusableCell(withIdentifier: "Cell", for: indexPath)
            cell.textLabel?.text = "Report Name"
            return cell;
        }
}
1
Ananda Aiwale

Dans Swift 4.1 et Xcode 9.4.1

1) Ajoutez UITableViewDataSource, UITableViewDelegate délégué à votre classe.

2) Créer une variable et un tableau de vue tableau.

3) Dans viewDidLoad, créer une vue tabulaire.

4) les délégués de la vue des tables d'appels

5) Appelez les fonctions de délégué de la vue tableau en fonction de vos besoins.

import UIKit
class yourViewController: UIViewController , UITableViewDataSource, UITableViewDelegate { // 1

var yourTableView:UITableView = UITableView()// 2
let myArray = ["row 1", "row 2", "row 3", "row 4"]

override func viewDidLoad() {
    super.viewDidLoad()

    // 3
    yourTableView.frame = CGRect(x: 10, y: 10, width: view.frame.width-20, height: view.frame.height-200)
    self.view.addSubview(yourTableView)

    // 4
    yourTableView.dataSource = self
    yourTableView.delegate = self

}

// 5
// MARK - UITableView Delegates
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {

    return myArray.count
}

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {

var cell : UITableViewCell? = tableView.dequeueReusableCell(withIdentifier: "cell")
    if cell == nil {
        cell = UITableViewCell(style: UITableViewCellStyle.default, reuseIdentifier: "cell")
    }
    if self. myArray.count > 0 {
        cell?.textLabel!.text = self. myArray[indexPath.row]
    }
    cell?.textLabel?.numberOfLines = 0

    return cell!
}

func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {

    return 50.0
}

Si vous utilisez le storyboard, pas besoin de étape 3

Mais vous devez créer IBOutlet de votre vue table, puis étape 4

1
iOS

Voici la version de Swift 4.

import Foundation
import UIKit

class ViewController: UIViewController, UITableViewDelegate, UITableViewDataSource
{ 
    var tableView: UITableView = UITableView()
    let animals = ["Horse", "Cow", "Camel", "Sheep", "Goat"]
    let cellReuseIdentifier = "cell"

    override func viewDidLoad()
    {
        super.viewDidLoad()

        tableView.frame = CGRect(x: 0, y: 50, width: UIScreen.main.bounds.size.width, height: UIScreen.main.bounds.size.height)
        tableView.delegate = self
        tableView.dataSource = self
        tableView.register(UITableViewCell.self, forCellReuseIdentifier: cellReuseIdentifier)

        self.view.addSubview(tableView)
    }

    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int
    {
        return animals.count
    }

    internal func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell
    {
        let cell:UITableViewCell = tableView.dequeueReusableCell(withIdentifier: cellReuseIdentifier) as UITableViewCell!

        cell.textLabel?.text = animals[indexPath.row]

        return cell
    }

    private func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: IndexPath)
    {
        print("You tapped cell number \(indexPath.row).")
    }

}
0
Ahmet Akkök