PBToolboxAI v4 ← Site

jsontree — u_pbt_jsontree #

← Komponentenreferenz · Inhalt des Handbuchs

jsontree zeigt einen JSON-Wert als einklappbaren Baum, nach Typ gefärbt: ein Konfigurationsbildschirm, eine API-Antwort, ein Integrations-Debug. Sie setzen den JSON-Text in is_json, die Komponente zeigt ihn; ein Klick auf einen Knoten meldet seinen Pfad (ue_node_clicked), ungültiges JSON löst ue_error aus. Sie ändert nichts: sie ist ein BETRACHTER.

▶ Live sehen — Demoanwendung, Kachel JSON tree, mit dem Code und dieser Seite nebeneinander.


Auf einen Blick #

Userobjectu_pbt_jsontree
EingabeDer JSON-Text, in is_json (eine Zeichenkette)
Ein-/AusklappenJeder Container über seine Markierung + / − am Zeilennummernrand, über seinen Pfad (of_expand_path, of_collapse_path), oder alle auf einmal (of_expand_all, of_collapse_all)
RückmeldungEin Klick auf einen Knoten liefert seinen Pfad (ue_node_clicked), den Pfad von n_pbt_json: lines/1/sku; ungültiges JSON löst ue_error aus
OriginaltreueJede Zahl und jeder Schlüssel wird so gezeigt, wie er empfangen wurde: eine 64-Bit-ID bleibt exakt, 1.10 bleibt 1.10, ein doppelter Schlüssel behält beide Einträge

Schnellstart #

// Show an API response as a tree
uo_json.is_json = inv_rest.of_response_text()

// Fold everything, then let the user open what interests them
uo_json.of_collapse_all()

// ue_node_clicked : the path of the node clicked ("lines/1/sku"), the path of
// n_pbt_json -> of_get_string(as_path) on the same text reads its value

Eigenschaften #

EigenschaftTypStandardBeschreibung
is_jsonstring""Der anzuzeigende JSON-Text. Ein Objekt, ein Array, ein Wert; gelesen und als Baum gezeigt, jede Zahl und jeder Schlüssel so, wie empfangen. Leer leert den Baum, ohne Fehler; ungültiges JSON löst ue_error aus und zeigt nichts. Wird genau so zurückgelesen, wie er gesetzt wurde
ib_wrapbooleantrueLange Zeilen brechen um (true, Standard) oder bleiben mit horizontaler Bildlaufleiste auf einer Zeile (false) — ein Code-Editor-Gefühl
ib_search_enabledbooleantrueStrg+F im Baum öffnet ein Suchfeld — dieselbe Suche wie of_search: Tippen hebt hervor, Enter oder F3 nächster, Umschalt+Enter oder Umschalt+F3 vorheriger, Esc schließt. false überlässt das Kürzel einer Anwendung, die aus ihrem eigenen Feld sucht. Das Feld trägt vor dem Zähler zwei Schalter, Aa (ib_find_match_case) und ab (ib_find_whole_word); eine geänderte Option startet die laufende Suche ab ihrem ersten Vorkommen neu
ib_find_match_casebooleanfalseSuchoption: findet nur Text mit derselben Groß-/Kleinschreibung. Der Schalter Aa des Suchfelds (Strg+F) ist derselbe Schalter; gilt für of_search und für das, was der Benutzer tippt. Live gelesen; of_reset setzt sie auf false zurück
ib_find_whole_wordbooleanfalseSuchoption: findet den Text nur als ganzes Wort (ein Buchstabe, eine Ziffer oder ein _ daneben gehört zum Wort: id wird weder in user_id noch in ids gefunden). Der Schalter ab des Suchfelds ist derselbe Schalter. Live gelesen; of_reset setzt sie auf false zurück
is_theme_stylestring""Visueller Stil der Komponente (Konstanten THEME_STYLE_*); leer = der der Anwendung, bei jeder Änderung übernommen
is_theme_modestring""Helle oder dunkle Variante (Konstanten THEME_MODE_*); leer = die der Anwendung, bei jeder Änderung übernommen
il_theme_accentlong-1Akzentfarbe dieser Komponente (-1 = Akzent der Anwendung, sonst der des Designs)
is_tooltipstring""Einfacher Tooltip beim Überfahren der Komponente
is_super_tooltip_titlestring""Titel des erweiterten Tooltips (hat Vorrang vor is_tooltip)
is_super_tooltip_textstring""Text des erweiterten Tooltips (Rich-Markup zulässig)
is_super_tooltip_imagestring""Bild des erweiterten Tooltips

Methoden #

MethodeBeschreibung
of_expand_all ( ) → longKlappt alle Container aus. Kein ue_node_toggled: Keine Geste öffnet den ganzen Baum auf einmal. Liefert 0, -2, wenn die Komponente nicht erzeugt ist
of_collapse_all ( ) → longKlappt alle verschachtelten Container ein (die oberste Ebene bleibt sichtbar). Eine durch das Einklappen verborgene Auswahl geht auf den eingeklappten Block über, und ue_selection_changed meldet es. Kein ue_node_toggled: Keine Geste klappt den ganzen Baum auf einmal ein. Liefert 0, -2, wenn die Komponente nicht erzeugt ist
of_expand_path ( string as_path ) → longÖffnet EINEN Block (Objekt oder Array) über seinen Pfad, und die Blöcke darüber, damit er sichtbar ist. Wie seine Markierung + löst es ue_node_toggled für den Block und für jeden eingeklappten Block darüber aus, der unterwegs aufgeht (nichts für einen schon offenen Block). Liefert 0, -5, wenn kein Block diesen Pfad hat (unbekannt oder ein Blatt), -2, wenn die Komponente nicht erzeugt ist
of_collapse_path ( string as_path ) → longKlappt EINEN Block über seinen Pfad ein. Wie seine Markierung − löst es ue_node_toggled aus, wenn der Block offen war, und ue_selection_changed, wenn die Auswahl auf ihn übergehen muss. Liefert 0, -5, wenn kein Block diesen Pfad hat (unbekannt oder ein Blatt), -2, wenn die Komponente nicht erzeugt ist
of_is_expanded ( string as_path ) → booleantrue, wenn der Block unter diesem Pfad geöffnet ist, LIVE gelesen; false, wenn er eingeklappt ist, und für ein Blatt oder einen unbekannten Pfad. Genug, um zu speichern, was der Benutzer geöffnet hat, und es wiederherzustellen
of_copy ( ) → longLegt die Auswahl in die Zwischenablage, wie Strg+C im Baum: ein Blatt liefert seinen Wert DEKODIERT (eine Zeichenkette ohne Anführungszeichen und Escapes), ein Block seinen eingerückten JSON-Text. Liefert 0, -4, wenn nichts ausgewählt ist, -2, wenn die Komponente nicht erzeugt ist
of_clear ( ) → longLeert den Baum (wie is_json = ""); ib_wrap, ib_search_enabled, ib_find_match_case und ib_find_whole_word behalten ihren Wert (of_reset setzt alles zurück). Liefert 0, -2, wenn die Komponente nicht erzeugt ist
of_expand_to_level ( long al_level ) → longZeigt den Baum bis al_level: Blöcke ab dieser Tiefe klappen ein (1 = die direkten Kinder des Wurzelblocks, 0 klappt die Wurzel ein). Kein ue_node_toggled; eine Auswahl, die es auf einen eingeklappten Block verschiebt, löst ue_selection_changed aus. Liefert 0, -2, wenn die Komponente nicht erzeugt ist
of_search ( string as_query ) → longHebt jedes Vorkommen hervor (standardmäßig ohne Groß-/Kleinschreibung — siehe ib_find_match_case —, nur ganze Wörter mit ib_find_whole_word; zwei in einer Zeile zählen zwei) und springt zum ersten; nur die Blöcke, die das AKTUELLE Vorkommen verbergen, klappen auf, und of_clear_search klappt sie wieder ein. ue_search_result sagt, wie viele. Gesucht wird im ANGEZEIGTEN Text: ein maskiertes Zeichen wird maskiert gesucht (C:\\Temp). Eine leere Suche ist of_clear_search. Das Suchfeld öffnet sich mit der Suche darin und dem Fokus darauf (dasselbe wie Strg+F): Eingabe geht zum nächsten; mit ib_search_enabled auf false hebt der Baum nur hervor. Liefert 0 oder einen negativen Code
of_search_next ( ) → longGeht zum NÄCHSTEN Vorkommen (nach dem letzten zurück zum ersten); ue_search_result gibt die neue Position. Liefert 0 oder einen negativen Code
of_search_prev ( ) → longGeht zum VORHERIGEN Vorkommen (vor dem ersten zurück zum letzten); ue_search_result gibt die neue Position. Liefert 0 oder einen negativen Code
of_clear_search ( ) → longLöscht die Suche: keine Hervorhebung und kein aktuelles Vorkommen mehr (of_match_count liefert 0), das Suchfeld leert und schließt sich, und die von der Suche geöffneten Blöcke klappen wieder ein wie vor ihr. Liefert 0 oder einen negativen Code
of_select_path ( string as_path ) → longWählt den Knoten bei as_path aus und scrollt zu ihm,; wie die Tastatur löst es ue_selection_changed aus (nichts, wenn der Knoten schon ausgewählt ist); die eingeklappten Blöcke, die ihn verbergen, klappen auf. as_path ist ein Pfad von n_pbt_json (lines/1/sku, "" = die Wurzel). Liefert 0, -5, wenn kein Knoten diesen Pfad hat (die Auswahl bleibt), -2, wenn die Komponente nicht erzeugt ist
of_selected_path ( ) → stringDer Pfad des ausgewählten Knotens, LIVE gelesen: der Pfad von n_pbt_json, Ebenen durch / verbunden und ein Array-Index ab 1 gezählt (lines/1/sku), unverändert an of_get_string auf demselben Text zu übergeben. Ein leerer Schlüssel oder einer mit / ist nicht adressierbar. "" ist die Wurzel oder keine Auswahl: of_has_selection unterscheidet sie
of_selected_value ( ) → stringDer JSON-Wert der gewählten Zeile, wenn sie ein BLATT ist (ein String behält seine Anführungszeichen, bereit zum Einfügen), LIVE gelesen. Leer bei einem Container oder ohne Auswahl
of_selected_text ( ) → stringDer WERT des ausgewählten Blatts, dekodiert, LIVE gelesen: eine Zeichenkette ohne Anführungszeichen und Maskierungen, eine Zahl oder true/false/null wie geschrieben. Leer für einen Container oder ohne Auswahl
of_has_selection ( ) → booleantrue, wenn ein Knoten ausgewählt ist, LIVE gelesen — die Wurzel eingeschlossen, deren Pfad "" ist
of_match_count ( ) → longLiefert die Anzahl der VORKOMMEN der aktuellen Suche (zwei in einer Zeile zählen zwei), LIVE gelesen — die 12 einer Statuszeile 3 / 12. 0 ohne Suche
of_match_index ( ) → longLiefert die 1-basierte Position des aktuellen Treffers, LIVE gelesen — die 3 einer Statuszeile 3 / 12. 0 ohne Treffer

Ereignisse #

EreignisWann
ue_node_clicked (string as_path)Der Benutzer hat einen Knoten angeklickt oder Eingabe auf einem ausgewählten Blatt gedrückt: sein Pfad, der Pfad von n_pbt_json (lines/1/sku, "" für die Wurzel) — of_get_string(as_path) auf demselben Text liest seinen Wert. Eingabe auf einem Block klappt ihn ein und erreicht nie die Standardschaltfläche des Fensters
ue_node_toggled (string as_path, boolean ab_expanded)Ein Block wurde eingeklappt (ab_expanded = false) oder geöffnet (true): vom Benutzer (seine Markierung + / −, die Pfeile, Eingabe oder Leertaste) oder von of_expand_path / of_collapse_path. of_expand_all, of_collapse_all und of_expand_to_level lösen es nicht aus: Keine Geste klappt den ganzen Baum ein
ue_selection_changed (string as_path)Die Auswahl hat sich ohne Klick bewegt, durch den Benutzer oder Ihren Code: Pfeile, Pos1/Ende, Bild auf/ab, of_select_path, oder ein Einklappen, das die ausgewählte Zeile verbirgt (die Auswahl geht dann auf den eingeklappten Block über) — ein Mausklick meldet ue_node_clicked
ue_search_result (long al_count, long al_index)Eine Suche hat begonnen oder ist weitergegangen: al_count Vorkommen insgesamt, das aktuelle ist al_index (ab 1, 0 wenn keins) — genug, um „3 / 12“ anzuzeigen
ue_error (string as_message)Der Text in is_json ist kein gültiges JSON: die Meldung sagt warum, mit Zeile und Spalte, in der Anzeigesprache; der Baum bleibt leer. Auch ausgelöst für ein Dokument, das zu groß zum Anzeigen ist (mehr als 1.500.000 Zeilen)

Beispiel #

Eine API-Antwort erkunden #

// Fetch the order : the tree shows the response, or empties on a failure
if inv_rest.of_get(/*url*/ "https://api.example.com/orders/4152") = 200 then
	uo_json.is_json = inv_rest.of_response_text()
	uo_json.of_collapse_all()          // the reader opens what interests them
else
	uo_json.of_clear()
end if

Den Wert eines angeklickten Knotens lesen #

// ue_node_clicked of uo_json : the path is the one n_pbt_json reads
n_pbt_json lnv_json

// Read the value at the clicked path with n_pbt_json
lnv_json.of_load(/*json*/ uo_json.is_json)
st_value.text = lnv_json.of_get_string(/*path*/ as_path)

// or, without a second parser : the value of the selected leaf, decoded
st_value.text = uo_json.of_selected_text()

Ganze Wörter suchen, Groß-/Kleinschreibung beachtet #

// Whole words only, with the same case : "id" is not found inside "user_id"
uo_json.ib_find_match_case = true
uo_json.ib_find_whole_word = true
uo_json.of_search(/*query*/ "id")

Bewährte Praxis #


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.

MitgliederRolleBeschrieben in
of_resetDie Komponente zurücksetzen3.6 Eine Komponente zurücksetzen: of_reset()
of_register_shortcut · of_clear_shortcutsTastenkürzel der Komponente3.5 Tastenkombinationen
of_is_created · of_is_ready · of_get_last_errorOb sie entstanden ist, ob sie bereit ist, was fehlschlug3.7 Diagnose
of_save_as_png · of_save_as_jpgDie Darstellung als Bild exportieren3.8 Die Darstellung als Bild exportieren
of_set_redrawÄnderungen zu einem einzigen Neuzeichnen bündeln3.10 Best Practices
of_preload_iconsSymbole ohne VerzögerungSofortige Anzeige: of_icon
of_set_translationEine Beschriftung der Komponente übersetzen5.2 Eine Beschriftung anpassen: of_set_translation
of_focus_webviewDer Komponente den Fokus geben6.4 Tastatur und Fokus
of_print · of_print_to_pdfDrucken oder ein PDF schreiben6.9 Drucken
of_set_property · of_get_property · of_component_nameEine Eigenschaft über ihren Namen steuern3.1 Die Eigenschaften-Engine

← Komponentenreferenz · Inhalt des Handbuchs