# EvenlySpacedLayout

> Distribuye los hijos con espaciado igual en un eje, preservando el tamaño de cada uno.

Source: https://crossfly.dev/es/docs/ui/layouts/evenly-spaced-layout — CrossFly documentation. Full docs as one file: https://crossfly.dev/llms-full.txt

# EvenlySpacedLayout

Distribuye los hijos con **espaciado igual** en un eje (horizontal por defecto), **preservando el
tamaño de cada uno**. Ideal para toolbars de iconos/botones de tamaño propio.

> 🟡 · **Paquete:** `dev.crossfly.ui.layout` · **Extiende:** `Layout`

## Cuándo usar
- Barras de acciones / toolbars de iconos que deben quedar igualmente espaciados.

## Cuándo NO usar
- Cuando los elementos deben **estirarse** para rellenar → usa fracciones en
  [HorizontalLayout](/docs/ui/layouts/horizontal-layout).

## `add(...)` y constructores
```java
public EvenlySpacedLayout add(Component c);      // (o add(Component...))
new EvenlySpacedLayout();                          // HORIZONTAL (default)
new EvenlySpacedLayout(Orientation.VERTICAL);      // eje vertical
```

## ⚠️ Punto clave: NO dimensiona los elementos
El layout solo **distribuye los espacios** — el **tamaño** de cada elemento viene de los bounds actuales o del
auto-size. Para elementos responsivos, dales un tamaño mediante el **estilo** (`autoWidth`/`autoHeight`) con
`Relative`.

## Ejemplo completo (copiar, pegar y ejecutar)
```java
package com.exemplo;

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

/** Pantalla principal ejecutable. Apunta el launcher (classname) y corre: gradlew :lwjgl3:run */
public class MainWindow extends Window
{
   @Override
   public void onShow() throws Exception
   {
      super.onShow();

      String[] icones = { "home", "search", "settings", "person" };

      Component toolbar = new Component();
      toolbar.setLayout(new EvenlySpacedLayout());                 // horizontal
      Relative lado = Relative.ofScreen(0.12f, ScreenSize.MIN);    // 12% del lado menor → cuadrado responsivo
      for (String glyph : icones) {
         Button b = new Button(new MaterialIcon(glyph));
         b.getStyle().autoWidth(lado).autoHeight(lado);            // tamaño responsivo por el estilo
         toolbar.add(b);
      }

      setLayout(new VerticalLayout(Position.START, Position.START));
      add(LAY_FILL, new Component());   // contenido (placeholder)
      add(LAY_AUTO, toolbar);           // barra de acciones en el pie
   }
}
```

> Los fragmentos siguientes muestran **solo el núcleo** (lo que va dentro de `onShow()`). Para ejecutar, colócalos en el esqueleto `MainWindow` anterior.

## Uso básico
```java
Component toolbar = new Component();
toolbar.setLayout(new EvenlySpacedLayout());                 // horizontal
Relative lado = Relative.ofScreen(0.12f, ScreenSize.MIN);    // 12% del lado menor → cuadrado responsivo
for (String glyph : icones) {
   Button b = new Button(new MaterialIcon(glyph));
   b.getStyle().autoWidth(lado).autoHeight(lado);            // tamaño responsivo por el estilo
   toolbar.add(b);
}
```

## Cómo distribuye
```
│   [i1]     [i2]     [i3]   │   ← espaços iguais entre e nas bordas; itens mantêm seu tamanho
```

## Buenas prácticas
- Da el tamaño de los elementos con `Relative` (`ofScreen(..., ScreenSize.MIN)` para cuadrados que se adaptan a
  portrait/landscape).

## Errores comunes
- Esperar que los elementos queden del mismo tamaño automáticamente — no lo hacen; define el tamaño.
- Usar píxeles fijos para el tamaño de los elementos.

## Ver también
- [HorizontalLayout](/docs/ui/layouts/horizontal-layout) · [Responsividad](/docs/ui/layouts/responsiveness)