# Pila

> Superpone los hijos; `pin` coloca uno en x, y. 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/stack/

:::tip[En pocas palabras]
Pone las cosas unas encima de otras, como hojas de papel.
:::

Superpone sus hijos, el último encima de todos: la base de capas, modales y notificaciones. `pz.pin(child, x=, y=)` coloca un hijo en una posición dentro de la pila.

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

**Código:**

```python
t = pz.theme.current()
pz.stack([
    pz.container(width=320, height=180, bg=t.element, radius=10),
    pz.pin(pz.container(ui.label("pinned at 24, 24"), padding=10, bg=t.panel, radius=6,
                        border_color=t.border, border_width=1), x=24, y=24),
    pz.pin(ui.count_badge(3), x=290, y=8),
    pz.pin(pz.container(ui.label("on top", color="#ffffff"), padding=10, bg=t.accent, radius=6), x=150, y=110),
], width=320, height=180)
```

## Cuándo usarlo

- Para insignias encima de iconos, capas y para colocar cosas libremente.

## Uso

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

t = pz.theme.current()
pz.stack([
    pz.container(width=320, height=180, bg=t.element, radius=10),
    pz.pin(pz.container(ui.label("pinned at 24, 24"), padding=10, bg=t.panel, radius=6,
                        border_color=t.border, border_width=1), x=24, y=24),
    pz.pin(ui.count_badge(3), x=290, y=8),
    pz.pin(pz.container(ui.label("on top", color="#ffffff"), padding=10, bg=t.accent, radius=6), x=150, y=110),
], width=320, height=180)
```

## 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
t = pz.theme.current()
pz.stack([pz.container(width=180, height=100, bg=t.element, radius=10),
          pz.container(ui.label("on top"), center=True, width=180, height=100)])
```

```python
t = pz.theme.current()
pz.stack([pz.container(width=180, height=100, bg=t.element, radius=10),
          pz.pin(ui.count_badge(3), x=150, y=8)], width=180, height=100)
```

```python
pz.stack([pz.container(ui.icon_button("bell", on_press, size="lg"), padding=6),
          pz.pin(ui.indicator("error", size=8), x=24, y=6)], width=40, height=40)
```

## Eventos

Pila 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.stack`

```python
stack(children=None, *, width=None, height=None)
```

Superpone los hijos, el último encima. Base de capas, modales y notificaciones.

| Propiedad | Por defecto | Descripción |
| --- | --- | --- |
| `children` | `None` | Lista de hijos. Se aplanan listas anidadas y se ignoran `None` y `False`, así que puedes escribir `cond and widget`. |
| `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/#stack)

### `pz.pin`

```python
pin(content, *, x=0.0, y=0.0, width=None, height=None)
```

Coloca `content` en `(x, y)` dentro de una caja. Úsalo en un `stack` para posicionar popovers y menús contextuales.

| Propiedad | Por defecto | Descripción |
| --- | --- | --- |
| `content` | *obligatorio* | Contenido: un `Widget`, un texto o un número (se convierte en texto). |
| `x` | `0.0` | Posición horizontal. |
| `y` | `0.0` | Posición vertical. |
| `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/#pin)

## Relacionados

- [Capa](https://albakore.github.io/pyzed/es/library/layer/): Dibuja una capa encima de tu vista; al pulsar fuera se cierra.
- [Popover](https://albakore.github.io/pyzed/es/library/popover/): Contenido flotante en un punto: menús contextuales, selectores de color.
- [Contenedor](https://albakore.github.io/pyzed/es/library/container/): Tamaño, relleno, alineación, fondo, borde y sombra para un hijo.