button — `u_pbt_button` #

← Komponentenreferenz · Inhalt des Handbuchs

Gestalteter Button: Text und Symbol, Stile, Zähler-Badge, Tastenkürzel, Standard- und Abbrechen-Button.

⚠️ Mehrere Schaltflächen? Bevorzugen Sie buttonbar: eine Reihe in einer Komponente, wo N einzelne button das N-Fache an Speicher kosten (jede Komponente ist eine Engine-Ansicht). button bleibt für Bestandscode unterstützt.

▶ Live ansehen — Demoanwendung, Kachel Button: die Vorschau, der zugehörige Code und diese Seite, nebeneinander.

Auf einen Blick #

Userobject	`u_pbt_button`
Item-Klasse	— (Komponente ohne Items)
Wofür	Einen `commandbutton` durch einen modernen, gestalteten Button mit Symbol und Badge ersetzen
Opt-in-Optionen	`ib_track_mouse`

Schnellstart #

// Event open des Fensters
uo_button.is_text  = "&Speichern"            // & = unterstrichener Buchstabe : Alt+S loest ihn aus
uo_button.is_style = uo_button.STYLE_PRIMARY // Button der Hauptaktion
uo_button.is_image = "mono:img\save.svg"     // vom Design umgefaerbtes Symbol
uo_button.is_shortcut = "Ctrl+S"             // angezeigtes und aktives Tastenkuerzel
uo_button.is_tooltip = "Speichert die aktuelle Akte"

// Event ue_clicked von uo_button
of_save()

Konstanten #

Konstante	Wert	Für
`STYLE_STANDARD` · `STYLE_PRIMARY` · `STYLE_FLAT`	`"standard"` `"primary"` `"flat"`	`is_style`

Eigenschaften #

Eigenschaft	Typ	Standard	Zweck
`is_text`	string	`""`	Beschriftung. Akzeptiert die Rich-Text-Auszeichnung und die Mnemonik `&` (`&Speichern` unterstreicht das S, und Alt+S löst sie aus, wo auch immer der Fokus im Fenster liegt, nach den expliziten Kürzeln und nie im ausgegrauten Zustand; eine PB-Menüleiste mit demselben Buchstaben verliert ihn); `&&` zeigt ein wörtliches kaufmännisches Und an. Eine Beschriftung aus nur einem Bild (`[picture=…]`) ist erlaubt
`is_image`	string	`""`	Symbol, das vor der Beschriftung angezeigt wird (akzeptierte Formen: Pfad, `mono:`, `tint:`, DLL-Ressource)
`ii_image_size`	integer	`0`	Größe des Symbols in Pixeln (`0` = die Größe des Designs, 18 Pixel)
`is_style`	string	`"standard"`	Erscheinungsbild: `STYLE_STANDARD`, `STYLE_PRIMARY` (Akzenthintergrund, Hauptaktion), `STYLE_FLAT` (ohne Rahmen)
`ib_enabled`	boolean	`true`	Button aktiv oder ausgegraut. Ausgegraut ignoriert er Maus und Tastatur, verlässt die Tab-Reihenfolge und überlässt Eingabe, Esc, sein Tastenkürzel und seine Mnemonik dem Fenster
`ib_default`	boolean	`false`	Standard-Button: Die Eingabetaste löst ihn aus, wo auch immer der Fokus im Fenster liegt, solange er aktiv ist; eine Akzentumrandung kennzeichnet ihn. Bei zwei Standard-Buttons gewinnt der dem Fokus nächste, bei Gleichstand keiner
`ib_cancel`	boolean	`false`	Abbrechen-Button: Die Esc-Taste löst ihn aus, wo auch immer der Fokus im Fenster liegt, solange er aktiv ist
`is_shortcut`	string	`""`	Tastenkürzel (`"Ctrl+S"`, `"F5"`, `"Ctrl+Shift+N"`), aktiv, wo auch immer der Fokus im Fenster liegt, und dem Tooltip hinzugefügt ("Speichern (Ctrl+S)"). Tastennamen werden auf Englisch geschrieben (`Enter`, `Esc`, `Del`, `PageUp`…); ein Kürzel, das das Fenster nicht auslösen kann (unbekannter Modifikator oder unbekannte Taste), wird abgelehnt und liest sich `""`
`ii_badge`	integer	`0`	Zähler-Plakette in der oberen End-Ecke (rechts, links bei Rechts-nach-links); über 99 zeigt sie `99+` (`0` = keine)
`il_badge_color`	long	`-1`	Hintergrund der Plakette, als PowerBuilder-RGB (`-1` = nicht gesetzt: die Farbe aus dem Design; `0` ist Schwarz, wie bei jeder anderen Farbe). Die Textfarbe wird automatisch gewählt, damit der Zähler lesbar bleibt
`ii_badge_size`	integer	`0`	Höhe der Plakette in Pixeln (`0` = die Größe aus dem Design). Die Schriftgröße folgt von selbst: der Zähler bleibt bei jeder Größe zentriert
`ib_track_mouse`	boolean	`false`	Opt-in: aktiviert `ue_mouse_enter` / `ue_mouse_leave`
`is_theme_style`	string	`""`	Visueller Stil der Komponente (Konstanten `THEME_STYLE_*`); leer = der der Anwendung, bei jeder Änderung übernommen
`is_theme_mode`	string	`""`	Helle oder dunkle Variante (Konstanten `THEME_MODE_*`); leer = die der Anwendung, bei jeder Änderung übernommen
`il_theme_accent`	long	`-1`	Akzentfarbe dieser Komponente (`-1` = Akzent der Anwendung, sonst der des Designs)
`is_tooltip`	string	`""`	Einfacher Tooltip beim Überfahren der Komponente
`is_super_tooltip_title`	string	`""`	Titel des erweiterten Tooltips (hat Vorrang vor `is_tooltip`)
`is_super_tooltip_text`	string	`""`	Text des erweiterten Tooltips (Rich-Markup zulässig)
`is_super_tooltip_image`	string	`""`	Bild des erweiterten Tooltips

Methoden #

Methode	Zweck
`of_reset ( )`	Setzt alle Eigenschaften auf ihren Standard zurück. Liefert `0` nach der Anwendung, `-2` wenn die Komponente nicht erzeugt ist
`of_set_redraw (boolean)`	Fasst eine Folge von Änderungen zu einer einzigen Darstellung zusammen. Liefert `0` nach der Anwendung, `-2` wenn die Komponente nicht erzeugt ist
`of_save_as_png (string)` · `of_save_as_jpg (string)`	Exportiert die Darstellung als Bild. Liefert `0` nach dem Schreiben des Bildes, `-4` wenn das Schreiben fehlschlägt, `-2` wenn die Komponente nicht erzeugt ist

Events #

Event	Ausgelöst wenn
`ue_clicked ( )`	Der Button wird angeklickt oder durch Eingabetaste / Esc / sein Tastenkürzel ausgelöst
`ue_rclicked ( )`	Rechtsklick auf den Button
`ue_mouse_enter ( )`	Die Maus tritt ein — erfordert `ib_track_mouse = true`
`ue_mouse_leave ( )`	Die Maus verlässt den Bereich — erfordert `ib_track_mouse = true`
`ue_ready ( )`	Die Komponente ist fertig geladen; alles zuvor Gesendete wurde nachgespielt
`ue_runtime_missing ( )`	Die WebView2-Runtime fehlt: die Komponente bleibt leer
`ue_bg_color (long al_color)`	Die Komponente hat ihre Design-Hintergrundfarbe berechnet; das Userobject hat sie bereits übernommen (`backcolor`)

Beispiele #

Die drei Stile #

// Die Hauptschaltflaeche : sie reagiert auf die Eingabetaste
uo_ok.is_text     = "OK"
uo_ok.is_style    = uo_ok.STYLE_PRIMARY
uo_ok.ib_default  = true          // Eingabetaste

// Die Abbrechen-Schaltflaeche : sie reagiert auf Esc
uo_cancel.is_text   = "Abbrechen"
uo_cancel.is_style  = uo_cancel.STYLE_STANDARD
uo_cancel.ib_cancel = true       // Esc-Taste

// Eine dezente Hilfe-Schaltflaeche
uo_help.is_text  = "Hilfe"
uo_help.is_style = uo_help.STYLE_FLAT   // dezent, ohne Rahmen

Symbol und Benachrichtigungs-Badge #

// Ein groesseres Symbol und ein Zaehler-Badge
uo_messages.is_text  = "Nachrichten"
uo_messages.is_image = "mono:img\mail.svg"
uo_messages.ii_image_size = 20
uo_messages.ii_badge = 12             // Plakette "12"

// Den Zaehler aktualisieren: die Plakette verschwindet bei 0
uo_messages.ii_badge = ll_unread

// Eine rote Plakette fuer eine Warnung statt der Farbe des Designs.
// Die Textfarbe wird von selbst gewaehlt, damit sie lesbar bleibt.
uo_messages.il_badge_color = RGB(/*red*/ 200, /*green*/ 30, /*blue*/ 30)

// Zurueck zu der Farbe, die aus dem Design kommt
uo_messages.il_badge_color = -1

Angereicherte Beschriftung #

// Formatierter Text : fett und kleiner, oder ein Bild im Text
uo_button.is_text = "[b]Exportieren[/b] [size-=20]· CSV[/size-=20]"
uo_button.is_text = "Status [picture=mono:img\ok.svg,14,14]"

Button der Hauptaktion mit Tastenkürzel und Hilfe #

// Das Zeichnen waehrend der Einstellungen anhalten
uo_submit.of_set_redraw(/*on*/ false)

// Text, Stil, Tastenkuerzel, Standardschaltflaeche und erweiterte QuickInfo
uo_submit.is_text     = "&Bestellung bestätigen"
uo_submit.is_style    = uo_submit.STYLE_PRIMARY
uo_submit.is_shortcut = "Ctrl+Enter"
uo_submit.ib_default  = true
uo_submit.is_super_tooltip_title = "Bestätigen"
uo_submit.is_super_tooltip_text  = "Sendet die Bestellung an den Lieferanten." &
                                    + "[br][br][size-=15]Nicht rückgängig zu machende Aktion.[/size-=15]"

// Ein einziges Neuzeichnen, mit allem
uo_submit.of_set_redraw(/*on*/ true)

Auf das Überfahren mit der Maus reagieren #

// Raise ue_mouse_enter and ue_mouse_leave when the pointer comes and goes
uo_button.ib_track_mouse = true

// Event ue_mouse_enter von uo_button
uo_status.of_panel(/*key*/ "main").is_text = "Speichert die aktuelle Akte"

Best Practices #

Nur ein primary-Button je Bildschirm: Er ist die erwartete Aktion.
ib_default und ib_cancel ersetzen die manuelle Behandlung von Eingabetaste / Esc in Ihrem Fenster.
Verwenden Sie mono: für monochrome Symbole: Sie folgen dem hellen wie dem dunklen Design.
Rufen Sie of_reset() auf, bevor Sie einen Button für eine andere Aktion wiederverwenden.

Vom gemeinsamen Sockel geerbt #

Diese Mitglieder gibt es bei jeder visuellen Komponente — sie sind nicht dieser eigen. Sie werden einmal in den übergreifenden Kapiteln beschrieben; diese Tabelle sagt nur, wo man sie liest.

Mitglieder	Rolle	Beschrieben in
`of_reset`	Die Komponente zurücksetzen	3.6 Eine Komponente zurücksetzen: `of_reset()`
`of_register_shortcut` · `of_clear_shortcuts`	Tastenkürzel der Komponente	3.5 Tastenkombinationen
`of_is_created` · `of_is_ready` · `of_get_last_error`	Ob sie entstanden ist, ob sie bereit ist, was fehlschlug	3.7 Diagnose
`of_save_as_png` · `of_save_as_jpg`	Die Darstellung als Bild exportieren	3.8 Die Darstellung als Bild exportieren
`of_set_redraw`	Änderungen zu einem einzigen Neuzeichnen bündeln	3.10 Best Practices
`of_preload_icons`	Symbole ohne Verzögerung	Sofortige Anzeige: `of_icon`
`of_set_translation`	Eine Beschriftung der Komponente übersetzen	5.2 Eine Beschriftung anpassen: `of_set_translation`
`of_focus_webview`	Der Komponente den Fokus geben	6.4 Tastatur und Fokus
`of_print` · `of_print_to_pdf`	Drucken oder ein PDF schreiben	6.9 Drucken
`of_set_property` · `of_get_property` · `of_component_name`	Eine Eigenschaft über ihren Namen steuern	3.1 Die Eigenschaften-Engine

Zwei Helfer werden nicht geerbt: of_icon und of_escape_markup liegen auf n_pbt_utils. Deklarieren Sie eines — n_pbt_utils lnv_utils, nichts zu erzeugen — und rufen Sie sie darauf auf.