# Espacio

> Huecos fijos y separadores flexibles. Un componente nativo de Pyzed para GUIs de escritorio en Python, con vista previa, ejemplos y su API.

Source: https://albakore.github.io/pyzed/es/library/spacing/

:::tip[En pocas palabras]
Espacio vacío: un hueco fijo, o un muelle que separa las cosas.
:::

`pz.space(width, height)` es una caja vacía de un tamaño dado. `pz.hspace()` y `pz.vspace()` son huecos flexibles que ocupan el espacio libre y empujan a sus hermanos a los extremos de una fila o columna.

`pz.space` · Categoría: [Disposición](https://albakore.github.io/pyzed/es/library/#disposición) · [Referencia completa →](https://albakore.github.io/pyzed/es/reference/widgets/#space)

**Código:**

```python
box = lambda text, w=90, h=44: pz.container(ui.label(text), center=True, width=w, height=h, bg=pz.theme.current().element, radius=6)
pz.column([
    pz.row([box("left"), pz.hspace(), box("right")], width=440),
    pz.row([box("a"), pz.space(width=60), box("60 px later", w=140)]),
], spacing=16)
```

## Cuándo usarlo

- Para llevar acciones a la derecha de una barra, o un pie al fondo de un panel.

## Uso

```python
import pyzed as pz
from pyzed import ui

box = lambda text, w=90, h=44: pz.container(ui.label(text), center=True, width=w, height=h, bg=pz.theme.current().element, radius=6)
pz.column([
    pz.row([box("left"), pz.hspace(), box("right")], width=440),
    pz.row([box("a"), pz.space(width=60), box("60 px later", w=140)]),
], spacing=16)
```

## Variantes

:::note[Sobre estas capturas]
Cada captura la graba pyzed mismo, fuera de pantalla a 2x, en One Dark o One Light según el tema de este sitio, y recortada al componente para que se vea a su tamaño real. El puntero pasa por encima, pulsa o escribe en él; un componente que no reacciona al puntero recorre algunos temas. Con movimiento reducido ves el primer fotograma. Abre **Código** bajo una captura para ver el fragmento que la dibuja; los nombres libres como `on_save` son tus propios callbacks.
:::

### Opciones

```python
box = lambda text, w=90, h=44: pz.container(ui.label(text), center=True, width=w, height=h, bg=pz.theme.current().element, radius=6)
pz.row([box("left"), pz.hspace(), box("right")], width=320)
```

```python
box = lambda text, w=90, h=44: pz.container(ui.label(text), center=True, width=w, height=h, bg=pz.theme.current().element, radius=6)
pz.row([box("a"), pz.space(width=60), box("b")])
```

```python
box = lambda text, w=90, h=44: pz.container(ui.label(text), center=True, width=w, height=h, bg=pz.theme.current().element, radius=6)
pz.column([box("top"), pz.vspace(), box("bottom")], height=150)
```

## Eventos

Espacio no tiene eventos propios: muestra lo que le das. Como todo widget, también tiene los **18 eventos comunes** (`click`, `double_click`, `right_click`, `mouse_enter`, `drag`, `key_down`, `resize`…), que se conectan con `.on(...)`: mira [Eventos](https://albakore.github.io/pyzed/es/guides/events/) y [Eventos de cada componente](https://albakore.github.io/pyzed/es/library/events/).

## Propiedades y API

### `pz.space`

```python
space(width=None, height=None)
```

Espacio vacío de un tamaño dado.

| Propiedad | Por defecto | Descripción |
| --- | --- | --- |
| `width` | `None` | Ancho: píxeles, `"fill"`, `"shrink"` o `"fill:N"` (proporción). |
| `height` | `None` | Alto: píxeles, `"fill"`, `"shrink"` o `"fill:N"` (proporción). |

[Referencia completa →](https://albakore.github.io/pyzed/es/reference/widgets/#space)

### `pz.hspace`

```python
hspace(width='fill')
```

Hueco horizontal flexible: empuja a los hermanos de una fila hacia los extremos.

| Propiedad | Por defecto | Descripción |
| --- | --- | --- |
| `width` | `"fill"` | Ancho: píxeles, `"fill"`, `"shrink"` o `"fill:N"` (proporción). |

[Referencia completa →](https://albakore.github.io/pyzed/es/reference/widgets/#hspace)

### `pz.vspace`

```python
vspace(height='fill')
```

Hueco vertical flexible: empuja a los hermanos de una columna hacia los extremos.

| Propiedad | Por defecto | Descripción |
| --- | --- | --- |
| `height` | `"fill"` | Alto: píxeles, `"fill"`, `"shrink"` o `"fill:N"` (proporción). |

[Referencia completa →](https://albakore.github.io/pyzed/es/reference/widgets/#vspace)

## Relacionados

- [Fila](https://albakore.github.io/pyzed/es/library/row/): Coloca los hijos en horizontal.
- [Columna](https://albakore.github.io/pyzed/es/library/column/): Apila los hijos en vertical.
- [Divisor](https://albakore.github.io/pyzed/es/library/divider/): Una línea fina en el color de borde del tema.