iOS Componentes

Delegate e DataSource: Dando Vida a UITableView

Tiago Aguiar Desenvolvedor ios

Escrito por Tiago Aguiar

em 16/07/2017

enter image description here

UITableView ​é a View mais usada em aplicativos iOS, competindo apenas com o seu "primo" ​UICollectionView​.

Aplicativos como Facebook, Instagram e Spotify são exemplos empíricos de que a UITableView ​está presente em boa parte dos aplicativos mais comuns.

Seja você iniciante ou Expert, dominar esse componente irá te ajudar a criar aplicativos de mercado além de aumentar a sua capacidade de criação de novos projetos. Isso porque a UITableView ​​está presente em ​mais de 80% dos aplicativos já criados​.

A ​​UITableView​ ​permite que o usuário final do aplicativo faça duas coisas que são, na minha opinião, essenciais na era da informação:

  1. Listar dados (de uma forma elegante, customizada e eficiente)
  2. Permitir a interação dos dados com outras Views (ver detalhes, reordenar, excluir, etc)

Neste artigo quero compartilhar um conceito muito importante sobre a TableView e que você usará em diversos outros componentes iOS. Delegate e DataSource.

UITableView Delegate: Escutando Eventos na UITableView

O delegate em curtas palavras é um protocol com assinaturas de funções obrigatórios ou opcionais onde, aquela classe que implementar (concordar) com aquele delegate, terá em mãos o "poder" para utilizar determinadas funções/métodos. Vou te dar um exemplo:

Imagine você declarando uma nova ViewController chamada ListProductViewController, ok?

No momento em que dissermos ao programa que nossa ViewController estará de acordo em implementar um UITableViewDelegate, você desenvolvedor iOS está dizendo que aquela classe (ListProductViewController) irá conter métodos que responderão à eventos de uma determinada UITableView. Logo, se a sua classe declarada diz ao programa que ela será o delegate daquela UITableView, literalmente os eventos (Listeners) daquela UITableView estarão nesta classe.

class ListProductViewController: UIViewController, UITableViewDelegate {
    @IBOutlet weak var tableView: UITableView!
    override func viewDidLoad() {
        super.viewDidLoad()
        self.tableView.delegate = self
    }
}

O código acima demonstra exatamente nossa classe implementando um Delegate da UITableView (em alguns casos como na própria documentação da Apple, você encontrará a palavra conforms para indicar que a classe implementa o protocol).

Simplesmente agora, todos os eventos desse objeto tableView serão "escutados" pela classe ListProductViewController.

Acesse a documentação da UITableViewDelegate da própria Apple e veja a quantidade de métodos que podemos utilizar a partir de agora na nossa classe. O mais comum e básico para quem está começando é utilizar o método tableView(_:didSelectRowAt:) didSelectRowAt que responde a eventos quando o usuário clica em uma linha (célula) da tableview.

Importante observar aqui é que esses métodos são executados em determinadas situações que ocorram com a UITableView, como no caso do didSelectRowAt. Por isso muitos programadores gostam de chamar esses eventos como listeners.

Outro ponto importante também é que alguns métodos são obrigatórios e outros são opcionais como no caso optional func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView?. Esse método não é obrigatório porque nem todas as UITableView precisam e tem um cabeçalho.

A minha sugestão é que você olhe a documentação no site da Apple e comece a testar diferentes métodos deste protocol para aprender mais. De fato, nós só aprendemos colocando a "mão na massa" ;).

UITableView DataSource: Representando o Data-Model de uma UITableView


A UITableViewDataSource é um outro protocol que usamos para representar um modelo de dados para a nossa UITableView. De fato ela é semelhante a uma UITableViewDelegate com alguns métodos que nos permite:

  • Customizar nossas células
  • Definir a quantidade de linhas
  • Quantidade de seções
  • O que acontece quando editamos
  • Ou reordenamos as células e muito mais.

Veja a documentação da UITableViewDataSource e navegue nos diversos métodos disponíveis.

O métodos fundamentais para construir uma tabela são:

  • tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int
  • tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell

O primeiro para dizer que nossa tabela terá X números de linhas naquela seção e o segundo para dizer qual objeto UITableViewCell terá em cada linha e o que exibir nesta linha.

Ok! Vamos criar nossa UITableView, e seus respectivos protocols (leia-se listeners) para fazer nosso aplicativo funcionar.

Adicione o protocol UITableViewDataSource para nossa tableview trabalhar com os dados da nossa classe.

class ListProductViewController: UIViewController, UITableViewDelegate, UITableViewDataSource {
    // ... variaveis
    override func viewDidLoad() {
        super.viewDidLoad()
        self.tableView.delegate = self
        self.tableView.dataSource = self
    }
}

Adicione os métodos obrigatórios do UITableViewDataSource

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "cellIdentifier")!
    cell.textLabel?.text = "row at \(indexPath.row)"
    return cell
}

O cellIdentifier deve ser definido no seu storyboard. em identifier UITableViewCell.

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

Adicione o seguinte método do UITableViewDelegate para que as ações de cliques do usuários seja escutada.

func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
    print(indexPath.row)
}

Pronto! Agora podemos clicar em cada célula e teremos uma simples UITableView com diversas linhas clicáveis.

enter image description here

Se você gostou deste artigo, compartilhe com um amigo ou alguém que quer aprender a criar aplicativos iOS. Esse conteúdo pode ajudar essa pessoa de alguma coisa.

Como Criar um aplicativo iOS TODO

Para aqueles que querem dar um passo além neste tutorial e começar a criar um app a partir da UITableView, assista esse video:

Até a póxima!


Comece antes de estar pronto! Just do it!


Se você quer se aprofundar mais sobre programação e como criar aplicativos iOS profissionalmente, essa video-aula completa sobre como criar seu primeiro app iOS profissional (usando arquitetura de software eficiente) Como Criar Aplicativos iOS Profissionais

Me siga nas redes sociais:


Artigos Relacionados

iOS Swift

Como Criar Um Aplicativo iOS do Zero: Primeiros passos no Playground

Conheça os primeiros passos para criar um aplicativo para iPhone e iOS do absoluto zero, mesmo que você nunca tenh...

iOS Arquitetura

Recriando o Feed de Filmes do Aplicativo Netflix iOS

Nos últimos tempos em venho criando uma série de vídeos no canal do Youtube onde irei recriar o feed de filmes de ...

iOS Componentes

UITableView Tutorial: Como Criar Listas em um App No Xcode 9

Primeiro, você precisa saber que a Table View é um dos componentes mais utilizados na construção de Interfaces em ...

iOS Design

AutoLayout e Visual Format Sem Storyboard (Programaticamente)

Conheça o método para criar seus aplicativos utilizando o conceito de Autolayout sem ter que necessariamente utili...

Marketing de Aplicativos: O Jeito Mais Inteligente e Efetivo De Promover Seu Aplicativo.