# button — `u_pbt_button` #

← Riferimento dei componenti · Sommario della guida

> Pulsante a tema: testo e icona, stili, badge contatore, scorciatoia da tastiera, pulsanti predefinito e di annullamento.

> ▶ Vederlo dal vivo — Applicazione dimostrativa, riquadro Button: l'anteprima, il codice che lo produce e questa pagina, affiancati.

## In breve #

Userobject | `u_pbt_button`
Classe degli item | — (componente senza item)
Serve per | Sostituire un `commandbutton` con un pulsante moderno, a tema, con icona e badge
Opzioni opt-in | `ib_track_mouse`

## Avvio rapido #

    // event open della finestra
    uo_bouton.is_text  = "&Salva"                // & = lettera sottolineata (mnemonico)
    uo_bouton.is_style = uo_bouton.STYLE_PRIMARY // pulsante dell'azione principale
    uo_bouton.is_image = "mono:img\save.svg"     // icona ricolorata dal tema
    uo_bouton.is_shortcut = "Ctrl+S"             // scorciatoia mostrata e attiva
    uo_bouton.is_tooltip = "Salva la pratica corrente"

    // event ue_clicked di uo_bouton
    of_enregistrer()

## Costanti #

Costante | Valore | Per
--- | --- | ---
`STYLE_STANDARD` · `STYLE_PRIMARY` · `STYLE_FLAT` | `"standard"` `"primary"` `"flat"` | `is_style`

## Proprietà #

Proprietà | Tipo | Predefinito | Ruolo
--- | --- | --- | ---
`is_text` | string | `""` | Etichetta. Accetta il testo formattato con tag e il mnemonico `&` (`&Salva` sottolinea la S); `&&` mostra una e commerciale letterale
`is_image` | string | `""` | Icona mostrata prima dell'etichetta (forme accettate: percorso, `mono:`, `tint:`, risorsa di DLL)
`ii_image_size` | integer | `0` | Dimensione dell'icona in pixel (`0` = dimensione naturale del componente)
`is_style` | string | `"standard"` | Aspetto: `STYLE_STANDARD`, `STYLE_PRIMARY` (sfondo d'accento, azione principale), `STYLE_FLAT` (senza bordo)
`ib_enabled` | boolean | `true` | Pulsante attivo o disattivato
`ib_default` | boolean | `false` | Pulsante predefinito: il tasto Invio lo attiva; un bordo d'accento lo segnala
`ib_cancel` | boolean | `false` | Pulsante di annullamento: il tasto Esc lo attiva
`is_shortcut` | string | `""` | Scorciatoia da tastiera (`"Ctrl+S"`, `"F5"`, `"Ctrl+Shift+N"`), mostrata nel tooltip e attiva quando il pulsante ha il focus
`ii_badge` | integer | `0` | Badge contatore nell'angolo superiore destro (`0` = nessuno)
`il_badge_color` | long | `0` | Sfondo del badge, in RGB PowerBuilder (`0` = il colore che proviene dal tema). Il colore del testo viene scelto automaticamente affinché il contatore resti leggibile
`ii_badge_size` | integer | `0` | Altezza del badge in pixel (`0` = la dimensione che proviene dal tema). La dimensione del carattere segue da sola: il contatore resta centrato qualunque sia la dimensione
`ib_track_mouse` | boolean | `false` | Opt-in: attiva `ue_mouse_enter` / `ue_mouse_leave`
`is_theme_style` | string | `fluent` | Stile visivo del componente (costanti `THEME_STYLE_*`)
`is_theme_mode` | string | `light` | Variante chiara o scura (costanti `THEME_MODE_*`)
`il_theme_accent` | long | `-1` | Colore d'accento di questo componente (`-1` = accento del tema)
`is_tooltip` | string | `""` | Tooltip semplice mostrato al passaggio del mouse sul componente
`is_super_tooltip_title` | string | `""` | Titolo del tooltip avanzato (prevale su `is_tooltip`)
`is_super_tooltip_text` | string | `""` | Testo del tooltip avanzato (markup avanzato accettato)
`is_super_tooltip_image` | string | `""` | Immagine del tooltip avanzato

## Metodi #

Metodo | Ruolo
--- | ---
`of_reset ( )` | Riporta tutte le proprietà ai valori predefiniti
`of_set_redraw (boolean)` | Raggruppa una raffica di modifiche in un solo rendering
`of_save_as_png (string)` · `of_save_as_jpg (string)` | Esporta il rendering come immagine

## Event #

Event | Attivato quando
--- | ---
`ue_clicked ( )` | Si fa clic sul pulsante, oppure viene attivato da Invio / Esc / dalla sua scorciatoia
`ue_rclicked ( )` | Clic destro sul pulsante
`ue_mouse_enter ( )` | Il mouse entra — richiede `ib_track_mouse = true`
`ue_mouse_leave ( )` | Il mouse esce — richiede `ib_track_mouse = true`
`ue_ready ( )` | Il componente ha terminato il caricamento; tutto ciò che è stato inviato prima è stato riprodotto
`ue_runtime_missing ( )` | Il runtime WebView2 è assente: il componente resta vuoto
`ue_bg_color (long al_color)` | Il componente ha calcolato il colore di sfondo del proprio tema; l'userobject lo ha già adottato (`backcolor`)

## Esempi #

### I tre stili #

    uo_ok.is_text     = "Conferma"
    uo_ok.is_style    = uo_ok.STYLE_PRIMARY
    uo_ok.ib_default  = true          // tasto Invio

    uo_annuler.is_text   = "Annulla"
    uo_annuler.is_style  = uo_annuler.STYLE_STANDARD
    uo_annuler.ib_cancel = true       // tasto Esc

    uo_aide.is_text  = "Guida"
    uo_aide.is_style = uo_aide.STYLE_FLAT   // discreto, senza bordo

### Icona e badge di notifica #

    uo_messages.is_text  = "Messaggi"
    uo_messages.is_image = "mono:img\mail.svg"
    uo_messages.ii_image_size = 20
    uo_messages.ii_badge = 12             // badge "12"

    // Aggiornare il contatore: il badge scompare a 0
    uo_messages.ii_badge = ll_non_lus

    // Un badge rosso per un avviso, invece del colore del tema.
    // Il colore del testo viene scelto da solo per restare leggibile.
    uo_messages.il_badge_color = RGB(200, 30, 30)

    // Tornare al colore che proviene dal tema
    uo_messages.il_badge_color = 0

### Etichetta arricchita #

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

### Pulsante dell'azione principale con scorciatoia e aiuto #

    uo_valider.of_set_redraw(false)

    uo_valider.is_text     = "&Conferma l'ordine"
    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 = "Conferma"
    uo_valider.is_super_tooltip_text  = "Invia l'ordine al fornitore." &
                                        + "[br][br][size-=15]Azione irreversibile.[/size-=15]"

    uo_valider.of_set_redraw(true)

### Reagire al passaggio del mouse #

    uo_bouton.ib_track_mouse = true

    // event ue_mouse_enter di uo_bouton
    uo_statut.of_item("main").is_text = "Salva la pratica corrente"

## Buone pratiche #

- Un solo pulsante `primary` per schermata: è l'azione attesa.
- `ib_default` e `ib_cancel` sostituiscono la gestione manuale di Invio / Esc nella sua finestra.
- Utilizzi `mono:` per le icone monocromatiche: seguiranno sia il tema chiaro sia quello scuro.
- Chiami `of_reset()` prima di riutilizzare un pulsante per un'altra azione.

← Riferimento dei componenti · Sommario della guida