3. Pensando em componentes

O que você vai aprender: Component como base de tudo, o ciclo de vida, composição e como criar um componente reutilizável. Pré-requisitos: Janelas e navegação.

Exemplo completo (copiar, colar e rodar)

Um componente reutilizável (CardTarefa) montado uma vez em onAdd e re-vinculado por dados via bind(...). A janela cria três cards com dados diferentes. Compila como está.

package com.exemplo;

import dev.crossfly.ui.*;
import dev.crossfly.ui.layout.*;

public class MainWindow extends Window
{
   @Override
   public void onShow() throws Exception
   {
      super.onShow();
      setLayout(new VerticalLayout());

      CardTarefa c1 = new CardTarefa(); add(LAY_AUTO, c1); c1.bind(new Tarefa("Comprar pão"));
      CardTarefa c2 = new CardTarefa(); add(LAY_AUTO, c2); c2.bind(new Tarefa("Pagar conta"));
      CardTarefa c3 = new CardTarefa(); add(LAY_AUTO, c3); c3.bind(new Tarefa("Estudar CrossFly"));
   }
}

class Tarefa                                             // modelo mínimo
{
   final String titulo;
   Tarefa(String titulo) { this.titulo = titulo; }
}

class CardTarefa extends Component
{
   private final Label titulo = new Label();

   @Override
   public void onAdd(boolean firstTime) throws Exception  // monta a estrutura UMA vez
   {
      super.onAdd(firstTime);
      setLayout(new HorizontalLayout());
      add(LAY_FILL, titulo);
   }

   public void bind(Tarefa t)                             // re-vincula por dados (barato)
   {
      titulo.setText(t.titulo);
      repaint();
   }
}

Os trechos abaixo mostram só o miolo (o que vai dentro de onShow()). Para rodar, coloque-os no esqueleto MainWindow acima.

Tudo é Component, container = Component + Layout

Um Label é um Component. Um Button é um Component. Qualquer Component vira container ao receber um Layout, e add(...) delega o arranjo ao layout.

Component painel = new Component();
painel.setLayout(new VerticalLayout());
painel.add(LAY_AUTO, new Label("Título"));

Ciclo de vida

Componente reutilizável com bind(...)

O padrão de “card” reciclável: monte a estrutura uma vez (em onAdd) e re-vincule por dados:

public class CardTarefa extends Component {
   private final Label titulo = new Label();
   @Override public void onAdd(boolean firstTime) throws Exception {
      super.onAdd(firstTime);
      setLayout(new HorizontalLayout());
      add(LAY_FILL, titulo);
   }
   public void bind(Tarefa t) {      // re-vincula por dados (barato, chamado muitas vezes)
      titulo.setText(t.titulo);
      repaint();
   }
}

Esse é exatamente o padrão que o VirtualListView usa para reciclar views (ver Carregando dados).

Constrói neste passo

O componente CardTarefa reutilizável — montado uma vez, re-vinculado por tarefa.

Recapitulando

Component é a base; container = Component + Layout; inicialize em onAdd(firstTime), libere em onRemove(); componentes custom separam montar (uma vez) de vincular (bind, muitas vezes).

Próximos passos

→ Layouts

Veja também

• Conceito: Tudo é um Component · Ciclo de vida