# Quickstart: Hello World en ~10 min

> Una MainWindow con Label y Button ejecutándose en el escritorio — y los 4 hechos que lo sostienen todo.

Source: https://crossfly.dev/es/docs/get-started/quickstart — CrossFly documentation. Full docs as one file: https://crossfly.dev/llms-full.txt

# Quickstart: Hello World

El momento "¡funciona!". Al final de esta página tienes una app interactiva ejecutándose en el escritorio.

## Ejemplo completo (copiar, pegar y ejecutar)
Crea tu ventana principal — una subclase de `dev.crossfly.ui.Window`:
```java
package com.exemplo.app;

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

public class MainWindow extends Window {
   @Override
   public void onShow() throws Exception {
      super.onShow();                       // obligatorio: bounds válidos + dispara onAdd
      setLayout(new VerticalLayout());

      Label saudacao = new Label("Olá, CrossFly!");
      Button botao = new Button("Clique");
      botao.onAction(c -> saudacao.setText("Você clicou!"));   // corre en el paint thread

      add(LAY_AUTO, saudacao);              // LAY_AUTO = altura natural
      add(LAY_AUTO, botao);
   }
}
```

## Ejecutar
```bash
gradlew :lwjgl3:run
```
Se abre una ventana con el texto y el botón; al hacer clic cambia el texto. 🎉

## Los 4 hechos que sostienen todo lo demás
1. **Pantalla = subclase de `Window`.** Cada pantalla de la app es una `Window`.
2. **La UI se monta en `onShow()`**, no en el constructor (allí los bounds aún no son válidos) — y siempre
   con `super.onShow()`.
3. **Todo es `Component`** y `add(tamaño, comp)` delega la disposición al `Layout` (`LAY_AUTO`=natural,
   `LAY_FILL`=rellena lo que sobra).
4. **La `MainWindow` se apunta por *classname*** (ver [Anatomía de un proyecto](/docs/get-started/project-structure)).

> Sin binding reactivo: el clic **muta** el `Label` (`setText`) — actualizas la UI a mano. Es el modelo
> imperativo de CrossFly (ver [Estado y flujo de datos](/docs/concepts/state-and-data-flow)).

## Próximos pasos
→ [Tu primera app (guiada, de punta a punta)](/docs/get-started/your-first-app)

## Ver también
- [Button](/docs/ui/widgets/button) · [Label](/docs/ui/widgets/label) · [VerticalLayout](/docs/ui/layouts/vertical-layout)
