tab — u_pbt_tab #

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

Pestañas modernas que alojan controles reales de PowerBuilder: banda reposicionable, iconos por pestaña, pestañas que se pueden cerrar, reordenación con el ratón.

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

De un vistazo #

El argumento clave: una página no es una maqueta HTML, es un dragobject de PowerBuilder: un userobject, una DataWindow, un grupo de controles o incluso otro componente PBToolboxAI. El componente se encarga de la colocación, del redimensionamiento y de mostrar u ocultar al cambiar de pestaña. Consulte Alojar controles reales de PowerBuilder.

Inicio rápido #

// event open de la ventana : cada pagina es un control PB ya puesto en la ventana
uo_onglets.of_add_page("clients",  "Clientes",  uo_page_clients)
uo_onglets.of_add_page("factures", "Facturas", uo_page_factures, /*cerrable*/ true)

// Un icono por pestana, puesto sobre el handle de la pagina
uo_onglets.of_item("clients").is_icon  = "mono:img\clients.svg"
uo_onglets.of_item("factures").is_icon = "mono:img\invoice.svg"

uo_onglets.of_select_page("clients")

// event ue_selection_changed de uo_onglets : (string as_from_id, string as_id)
of_charger_page(as_id)

Propiedades #

Propiedades de una página — n_pbt_tab_page #

Obtenidas mediante of_item(id), se modifican en caliente, sin reconstruir la banda.

Métodos #

of_add_page devuelve un código negativo si el identificador está vacío, ya se utiliza, o si el control pasado no es válido.

Cuando hay demasiadas pestañas — se reducen para caber en la banda, pero nunca por debajo de un ancho legible: el icono y la cruz de cierre ocupan su sitio además del título, nunca en su lugar. Las que ya no caben salen de la banda, y en su extremo aparece un botón ···: abre la lista de todas las pestañas visibles, con la activa marcada, y la elección cambia a ella. La pestaña activa siempre permanece visible. La banda no se desplaza — ese botón es el camino hacia las pestañas fuera del marco. Nada que programar, el comportamiento es automático.

Eventos #

Ejemplos #

Un archivador de páginas de negocio #

// event open : los userobjects de pagina ya estan puestos en la ventana
uo_onglets.of_set_redraw(false)

uo_onglets.of_add_page(/*id*/ "identite", /*titulo*/ "Identidad",  /*pagina*/ uo_identite)
uo_onglets.of_add_page(/*id*/ "adresses", /*titulo*/ "Direcciones",  /*pagina*/ uo_adresses)
uo_onglets.of_add_page(/*id*/ "compta",   /*titulo*/ "Contabilidad", /*pagina*/ uo_compta)

uo_onglets.of_item("identite").is_icon = "mono:img\user.svg"
uo_onglets.of_item("adresses").is_icon = "mono:img\map.svg"
uo_onglets.of_item("compta").is_icon   = "mono:img\euro.svg"

uo_onglets.of_set_redraw(true)
uo_onglets.of_select_page("identite")

Documentos que se pueden cerrar, abiertos bajo demanda #

// Abrir un documento en una nueva pestana que se pueda cerrar
uo_onglets.of_add_page(/*id*/ ls_cle, /*titulo*/ ls_libelle, /*pagina*/ uo_editeur, &
                       /*cerrable*/ true, /*icono*/ "mono:img\doc.svg")
uo_onglets.of_select_page(ls_cle)

// event ue_tab_closed de uo_onglets : (string as_id)
// La pestana ya se ha retirado ; solo queda liberar sus datos de negocio.
of_liberer_document(as_id)

Reordenación con el ratón #

uo_onglets.ib_reorderable = true

// event ue_tab_reordered de uo_onglets : (string as_id, integer ai_index)
// ai_index = nueva posicion, a partir de 1 : se memoriza el orden elegido.
of_enregistrer_ordre(as_id, ai_index)

Banda vertical #

// Banda de pestanas en el lado izquierdo, util cuando las etiquetas son largas
uo_onglets.is_position = uo_onglets.POSITION_START

Atenuar u ocultar una pestaña según los permisos #

// El camino pasa siempre por el handle de la pagina
uo_onglets.of_item("compta").ib_enabled = of_a_le_droit("compta")
uo_onglets.of_item("audit").ib_visible  = gb_mode_expert

Reaccionar a la selección #

// event ue_selection_changed de uo_onglets : (string as_from_id, string as_id)
choose case as_id
    case "identite" ; uo_identite.of_rafraichir()
    case "adresses" ; uo_adresses.of_rafraichir()
    case "compta"   ; uo_compta.of_rafraichir()
end choose

Rechazar un cambio de pestaña o un cierre #

// Las dos preguntas se plantean de forma PREDETERMINADA: nada que activar. Estas
// lineas hacen lo contrario, las suprimen cuando arbitrar no sirve.
uo_onglets.ib_veto_selection = false
uo_onglets.ib_veto_close     = false

// event ue_selection_changing de uo_onglets : (string as_from_id, string as_id)
// Devolver FALSE mantiene al usuario en la pagina que abandona.
if of_page_modifiee(as_from_id) then
    if MessageBox("Modificaciones", "¿Salir sin guardar?", Question!, YesNo!) = 2 then
        return false
    end if
end if
return true

// event ue_tab_closing de uo_onglets : (string as_id)
// Devolver FALSE mantiene abiertos la pestana y su pagina alojada.
return not of_page_modifiee(as_id)

Volver a empezar con una banda vacía #

// of_reset devuelve CADA pagina alojada a su ventana de origen antes de vaciar
uo_onglets.of_reset()
uo_onglets.of_add_page("accueil", "Inicio", uo_accueil)

Buenas prácticas #

• Los controles alojados deben existir antes de la llamada: colóquelos en la ventana en fase de diseño, el componente se encarga de ocultarlos y recolocarlos.
• Cargue las páginas una sola vez en el open y después controle únicamente la selección: es más rápido que añadir y retirar páginas continuamente.
• Llame a of_preload_icons al arrancar si sus pestañas llevan iconos: de lo contrario, la primera apertura de una pestaña oculta muestra un breve retardo antes del icono.
• Las dos preguntas se plantean de forma predeterminada: un evento dejado vacío autoriza siempre la acción, no tiene nada que hacer. Desactívelas con ib_veto_selection / ib_veto_close a false si arbitrar no le sirve, porque cada pregunta cuesta una ida y vuelta hasta PowerBuilder.
• Un control alojado es una ventana nativa: se dibuja por encima de la capa web. Ningún efecto visual del componente puede pasar por delante de él.
• No olvide of_reset() antes de reconstruir una banda: sin él, reutilizar un identificador de página falla y los controles anteriores permanecen visibles.
• Para zonas redimensionables y desacoplables en lugar de páginas exclusivas, prefiera dockcontainer.

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