Divisor

En pocas palabras

Una línea fina que separa grupos de cosas.

Una línea de un píxel en el color de borde del tema, horizontal por defecto (vertical=True para una vertical). pz.rule es la versión base con tu propio color y thickness.

ui.divider · Categoría: Visualización · Referencia completa →

Vista previa

Código

pz.column([
    ui.label("Account"),
    ui.divider(),
    pz.row([ui.label("Edit"), ui.divider(vertical=True), ui.label("View"),
            ui.divider(vertical=True), ui.label("Help")], spacing=12, height=20),
    ui.divider(),
    ui.muted("Sign out"),
], spacing=10, width=300)

Cuándo usarlo

• Para separar grupos en una columna o elementos en una barra.
• Prueba primero con espacio; añade un divisor cuando los grupos necesiten un corte visual.

Uso

import pyzed as pz
from pyzed import ui

pz.column([
    ui.label("Account"),
    ui.divider(),
    pz.row([ui.label("Edit"), ui.divider(vertical=True), ui.label("View"),
            ui.divider(vertical=True), ui.label("Help")], spacing=12, height=20),
    ui.divider(),
    ui.muted("Sign out"),
], spacing=10, width=300)

Variantes

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.

Dirección

Horizontal

Código

pz.column([ui.label("Account"), ui.divider(), ui.label("Sign out")], spacing=8, width=220)

vertical=True

Código

pz.row([ui.label("Edit"), ui.divider(vertical=True), ui.label("View")], spacing=10, height=18)

Color

color="accent"

Código

pz.container(ui.divider(color="accent"), width=220)

pz.rule(thickness=3)

Código

pz.container(pz.rule(color="#e5c07b", thickness=3), width=220)

Estados y eventos

label="or"

Código

pz.container(ui.divider(label="or"), width=300)

spacing=12

Código

pz.column([ui.label("Above"), ui.divider(spacing=12), ui.label("Below")], width=300)

Eventos

Divisor 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 y Eventos de cada componente.

Propiedades y API

ui.divider

divider(*, vertical=False, color=None, label=None, spacing=0, theme=None)

Una línea divisoria con el color del tema.

Propiedad	Por defecto	Descripción
vertical	False	Vertical en lugar de horizontal.
color	None	Color del texto o del icono.
label	None	Texto atenuado en el centro de una línea horizontal ("o", una fecha…).
spacing	0	Espacio a ambos lados de la línea.
theme	None	Tema a usar en lugar del actual (pyzed.theme.current()).

Referencia completa →

pz.rule

rule(*, vertical=False, thickness=1.0, color=None)

Una línea divisoria horizontal (o vertical).

Propiedad	Por defecto	Descripción
vertical	False	Línea vertical en lugar de horizontal.
thickness	1.0	Grosor en píxeles.
color	None	Color del texto o del icono.

Referencia completa →

Relacionados

TarjetaUna superficie con borde, título y acciones opcionales.

Barra de herramientasLa barra bajo las pestañas: migas de pan y acciones.