2. Ventanas y navegación

Lo que vas a aprender: la unidad de pantalla (Window), dónde montar la UI y el modelo de navegación por pila. Prerrequisitos: El panorama.

Ejemplo completo (copiar, pegar y ejecutar)

Dos pantallas navegando por pila (push/hide), con datos pasados por el constructor. MainWindow es la lista; TelaDetalhe es el detalle. Compila tal cual.

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());

      add(LAY_AUTO, new Label("Minhas tarefas"));

      Button abrir = new Button("Abrir tarefa 42");
      abrir.onAction(c -> new TelaDetalhe(42).show());   // push: apila el detalle
      add(LAY_AUTO, abrir);
   }
}

class TelaDetalhe extends Window
{
   private final int id;

   public TelaDetalhe(int id) { this.id = id; }          // datos por el constructor

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

      add(LAY_AUTO, new Label("Tarefa " + id));

      Button voltar = new Button("Voltar");
      voltar.onAction(c -> hide());                       // pop: desapila, vuelve a la lista
      add(LAY_AUTO, voltar);
   }
}

Los fragmentos de abajo muestran solo el núcleo (lo que va dentro de onShow()). Para ejecutar, colócalos en el esqueleto MainWindow de arriba.

Window y onShow()

Cada pantalla es una subclase de Window (que es un Component). Monta la UI en onShow() — con super.onShow() — donde los bounds ya son válidos (nunca en el constructor).

La pila de navegación (LIFO)

show() apila (push) una ventana; hide() desapila (pop). La ventana del tope recibe el input.

public class TelaLista extends Window {
   @Override public void onShow() throws Exception {
      super.onShow();
      setLayout(new VerticalLayout());
      Button abrir = new Button("Abrir tarefa 42");
      abrir.onAction(c -> new TelaDetalhe(42).show());   // push
      add(LAY_AUTO, abrir);
   }
}

public class TelaDetalhe extends Window {
   private final int id;
   public TelaDetalhe(int id) { this.id = id; }          // datos por el constructor
   @Override public void onShow() throws Exception {
      super.onShow();
      setLayout(new VerticalLayout());
      add(LAY_AUTO, new Label("Tarefa " + id));
      Button voltar = new Button("Voltar");
      voltar.onAction(c -> hide());                       // pop
      add(LAY_AUTO, voltar);
   }
}

Pasar datos y retornar valores

• Ir a una pantalla con datos: por el constructor (new TelaDetalhe(42).show()).
• Retornar un valor: los pickers usan show(onAnswer); las pantallas comunes usan un callback por el constructor; los diálogos (Alert) responden por buttonAction (ver Retornar valores).

Construyes en este paso

El esqueleto de dos pantallas de la app hilo conductor: lista → detalle, navegando entre sí.

Recapitulando

Pantalla = Window; UI en onShow()+super.onShow(); show()/hide() = push/pop; datos por el constructor.

Próximos pasos

→ Pensando en componentes

Ver también

• Navegación (ui) · Concepto: El ciclo de vida