PBToolboxAI v1 ← Site

button — u_pbt_button #

← Referencia de componentes · Índice de la guía

Botón con tema: texto e icono, estilos, distintivo de contador, atajo de teclado, botones predeterminado y de cancelación.

▶ Verlo en vivo — Aplicación de demostración, mosaico Button: la vista previa, el código que lo genera y esta página, uno al lado del otro.

De un vistazo #

Userobjectu_pbt_button
Clase de items— (componente sin items)
Sirve paraSustituir un commandbutton por un botón moderno, con tema, con icono y distintivo
Opciones opt-inib_track_mouse

Inicio rápido #

// event open de la ventana
uo_bouton.is_text  = "&Guardar"               // & = letra subrayada (mnemotecnico)
uo_bouton.is_style = uo_bouton.STYLE_PRIMARY // boton de accion principal
uo_bouton.is_image = "mono:img\save.svg"     // icono recoloreado por el tema
uo_bouton.is_shortcut = "Ctrl+S"             // atajo mostrado y activo
uo_bouton.is_tooltip = "Guarda el expediente en curso"
// event ue_clicked de uo_bouton
of_enregistrer()

Constantes #

ConstanteValorPara
STYLE_STANDARD · STYLE_PRIMARY · STYLE_FLAT"standard" "primary" "flat"is_style

Propiedades #

PropiedadTipoPredeterminadoFunción
is_textstring""Etiqueta. Acepta el texto enriquecido con etiquetas y el mnemotécnico & (&Guardar subraya la G); && muestra un ampersand literal
is_imagestring""Icono mostrado antes de la etiqueta (formas aceptadas: ruta, mono:, tint:, recurso de DLL)
ii_image_sizeinteger0Tamaño del icono en píxeles (0 = tamaño natural del componente)
is_stylestring"standard"Apariencia: STYLE_STANDARD, STYLE_PRIMARY (fondo de acento, acción principal), STYLE_FLAT (sin borde)
ib_enabledbooleantrueBotón activo o atenuado
ib_defaultbooleanfalseBotón predeterminado: la tecla Intro lo activa; un filete de acento lo señala
ib_cancelbooleanfalseBotón de cancelación: la tecla Esc lo activa
is_shortcutstring""Atajo de teclado ("Ctrl+S", "F5", "Ctrl+Shift+N"), mostrado en el tooltip y activo cuando el botón tiene el foco
ii_badgeinteger0Distintivo de contador en la esquina superior derecha (0 = ninguno)
il_badge_colorlong0Fondo del distintivo, en RGB de PowerBuilder (0 = el color que viene del tema). El color del texto se elige automáticamente para que el contador siga siendo legible
ii_badge_sizeinteger0Altura del distintivo en píxeles (0 = el tamaño que viene del tema). El tamaño de la fuente se ajusta solo: el contador sigue centrado sea cual sea la dimensión
ib_track_mousebooleanfalseOpt-in: activa ue_mouse_enter / ue_mouse_leave
is_theme_stylestringfluentEstilo visual del componente (constantes THEME_STYLE_*)
is_theme_modestringlightVariante clara u oscura (constantes THEME_MODE_*)
il_theme_accentlong-1Color de acento de este componente (-1 = acento del tema)
is_tooltipstring""Tooltip simple mostrado al pasar el ratón por el componente
is_super_tooltip_titlestring""Título del tooltip enriquecido (prevalece sobre is_tooltip)
is_super_tooltip_textstring""Texto del tooltip enriquecido (se acepta el marcado enriquecido)
is_super_tooltip_imagestring""Imagen del tooltip enriquecido

Métodos #

MétodoFunción
of_reset ( )Devuelve todas las propiedades a sus valores predeterminados
of_set_redraw (boolean)Agrupa una ráfaga de modificaciones en una sola representación
of_save_as_png (string) · of_save_as_jpg (string)Exporta la representación como imagen

Eventos #

EventoSe activa cuando
ue_clicked ( )Se hace clic en el botón, o se activa mediante Intro / Esc / su atajo
ue_rclicked ( )Clic derecho en el botón
ue_mouse_enter ( )El ratón entra — requiere ib_track_mouse = true
ue_mouse_leave ( )El ratón sale — requiere ib_track_mouse = true
ue_ready ( )El componente ha terminado de cargarse; todo lo enviado antes se ha reproducido
ue_runtime_missing ( )El runtime WebView2 está ausente: el componente permanece vacío
ue_bg_color (long al_color)El componente ha calculado el color de fondo de su tema; el userobject ya lo ha adoptado (backcolor)

Ejemplos #

Los tres estilos #

uo_ok.is_text     = "Aceptar"
uo_ok.is_style    = uo_ok.STYLE_PRIMARY
uo_ok.ib_default  = true          // tecla Intro

uo_annuler.is_text   = "Cancelar"
uo_annuler.is_style  = uo_annuler.STYLE_STANDARD
uo_annuler.ib_cancel = true       // tecla Esc

uo_aide.is_text  = "Ayuda"
uo_aide.is_style = uo_aide.STYLE_FLAT   // discreto, sin borde

Icono y distintivo de notificación #

uo_messages.is_text  = "Mensajes"
uo_messages.is_image = "mono:img\mail.svg"
uo_messages.ii_image_size = 20
uo_messages.ii_badge = 12             // distintivo "12"
// Actualizar el contador: el distintivo desaparece en 0
uo_messages.ii_badge = ll_non_lus
// Un distintivo rojo para una alerta, en lugar del color del tema.
// El color del texto se elige solo para seguir siendo legible.
uo_messages.il_badge_color = RGB(200, 30, 30)

// Volver al color que viene del tema
uo_messages.il_badge_color = 0

Etiqueta enriquecida #

uo_bouton.is_text = "[b]Exportar[/b] [size-=20]· CSV[/size-=20]"
uo_bouton.is_text = "Estado [picture=mono:img\ok.svg,14,14]"

Botón de acción principal con atajo y ayuda #

uo_valider.of_set_redraw(false)

uo_valider.is_text     = "&Confirmar el pedido"
uo_valider.is_style    = uo_valider.STYLE_PRIMARY
uo_valider.is_shortcut = "Ctrl+Enter"
uo_valider.ib_default  = true
uo_valider.is_super_tooltip_title = "Confirmar"
uo_valider.is_super_tooltip_text  = "Envía el pedido al proveedor." &
                                    + "[br][br][size-=15]Acción irreversible.[/size-=15]"

uo_valider.of_set_redraw(true)

Reaccionar al paso del cursor #

uo_bouton.ib_track_mouse = true
// event ue_mouse_enter de uo_bouton
uo_statut.of_item("main").is_text = "Guarda el expediente en curso"

Buenas prácticas #

← Referencia de componentes · Índice de la guía