codeeditor — u_pbt_codeeditor #

← Référence des composants · Sommaire du guide

Éditeur de code à coloration syntaxique : dix langages, numéros de ligne, repli de régions, recherche et remplacement, marqueurs de diagnostic dans la gouttière et dépôt de fichiers.

▶ Le voir en vrai — Application de démonstration, tuile Code editor : l'aperçu, le code qui le produit et cette page, côte à côte.

En bref #

Démarrage rapide #

// event open de la fenetre
uo_editor.is_syntax = uo_editor.SYNTAX_SQL
uo_editor.is_text   = "SELECT c.name, SUM(o.amount) AS total~r~n" &
                       + "FROM customer c~r~n" &
                       + "  INNER JOIN orders o ON o.cust_id = c.id~r~n" &
                       + "WHERE o.status = 'paid'~r~n" &
                       + "GROUP BY c.name"

// Local variables
string ls_sql

// Relire ce que l'utilisateur a reellement saisi
ls_sql = uo_editor.of_get_text()

is_text donne la même chose : la frappe de l'utilisateur y est reportée dès que la saisie se pose (event ue_changed).

Langages reconnus #

is_syntax accepte l'une de ces constantes, ou SYNTAX_NONE (chaîne vide) pour du texte brut sans coloration.

Les langages d'une même famille partagent la coloration (SYNTAX_JAVA colore comme SYNTAX_C, SYNTAX_XML comme SYNTAX_HTML) : la constante que vous choisissez documente votre intention, le résultat à l'écran est le même. La valeur est insensible à la casse et un nom inconnu revient au texte brut, sans erreur. is_syntax se relit exactement tel qu'écrit, casse comprise : "SQL" reste "SQL".

Propriétés #

Contenu et langage #

Affichage #

Navigation et interactions #

Méthodes #

Événements #

Clavier #

La colonne que rapportent ue_caret_changed et il_caret_column est le rang du caractère dans sa ligne : une tabulation compte pour un, quelle que soit sa largeur à l'écran.

Exemples #

Un éditeur de requête SQL #

// Geler l'affichage pendant la mise en place
uo_query.of_set_redraw(/*on*/ false)

// Coloration SQL, puis la requete a afficher
uo_query.is_syntax = uo_query.SYNTAX_SQL
uo_query.is_text   = "-- Meilleurs clients par chiffre d'affaires encaisse~r~n" &
                       + "SELECT c.name, SUM(o.amount) AS total~r~n" &
                       + "FROM customer c~r~n" &
                       + "  INNER JOIN orders o ON o.cust_id = c.id~r~n" &
                       + "WHERE o.status = 'paid'~r~n" &
                       + "GROUP BY c.name~r~n" &
                       + "ORDER BY total DESC"

// Un seul dessin, tout d'un coup
uo_query.of_set_redraw(/*on*/ true)

// event clicked de cb_execute
// Local variables
string ls_sql

// Executer la requete telle que saisie
ls_sql = uo_query.of_get_text()     // la saisie reelle de l'utilisateur
of_execute(ls_sql)

Une visionneuse en lecture seule #

Idéale pour présenter du code généré, un journal ou un extrait que l'utilisateur doit lire sans le modifier.

// Coloration PowerScript
uo_preview.is_syntax = uo_preview.SYNTAX_POWERSCRIPT

// Une visionneuse en lecture seule : ni curseur, ni gouttiere, ni surlignage
uo_preview.ib_readonly     = true      // consultation seule, pas de curseur de saisie
uo_preview.ib_line_numbers = false     // masque la gouttiere de numeros
uo_preview.ib_current_line = false     // pas de surlignage de la ligne courante
uo_preview.ib_wrap         = true      // renvoie a la ligne plutot que defiler
uo_preview.ii_tab_size     = 2         // tabulations affichees sur 2 colonnes

// Le code a afficher
uo_preview.is_text = of_generate_code()

Suivre la position du curseur dans une barre d'état #

// Signaler chaque deplacement du curseur (ue_caret_changed)
uo_editor.ib_track_caret = true       // abonnement explicite : sinon aucun evenement

// event ue_caret_changed de uo_editor : (long al_line, long al_col)
uo_status.of_panel(/*key*/ "pos").is_text = "Ligne " + String(al_line) + ", col. " + String(al_col)

Sans ib_track_caret, le curseur ne remonte rien : ce déclencheur est de fréquence élevée et reste coupé tant que vous ne le demandez pas.

Rechercher et aller à une ligne #

// Ouvre la barre de recherche et met en evidence toutes les occurrences
uo_editor.of_find(/*text*/ "ll_total")

// event ue_find_result de uo_editor : (long al_count, long al_index)
if al_count = 0 then
    uo_status.of_panel(/*key*/ "main").is_text = "Aucune occurrence"
else
    uo_status.of_panel(/*key*/ "main").is_text = String(al_index) + " / " + String(al_count)
end if

// Local variables
long ll_error_line
string ls_error_text
n_pbt_utils lnv_utils

// Ce que le compilateur a dit, et ou (votre etape de compilation le fournit)
ll_error_line = 39

// Le message passe par of_escape_markup : ses crochets s'affichent tels quels
ls_error_text = lnv_utils.of_escape_markup(/*text*/ "C0031 : Syntax error near ls_names[1]")

// Aller a la ligne qu'un compilateur a signalee et la marquer dans la gouttiere
uo_editor.of_add_marker(/*line*/ ll_error_line, /*kind*/ uo_editor.MARKER_ERROR, /*tooltip*/ ls_error_text)
uo_editor.il_caret_line = ll_error_line     // le curseur y va, la ligne vient a l'ecran
uo_editor.of_focus_webview()                // l'utilisateur corrige aussitot

Ouvrir un fichier déposé depuis l'Explorateur #

// Accept files dropped from the Explorer
uo_editor.ib_allow_drop = true

// event ue_drop_files de uo_editor : (string as_files[])
// Local variables
blob lblb_content
integer li_file

// as_files[1] porte le chemin COMPLET du premier fichier depose
li_file = FileOpen(as_files[1], StreamMode!, Read!)
if li_file > 0 then
    FileReadEx(li_file, lblb_content)
    FileClose(li_file)

    // Colorer selon l'extension du fichier, puis afficher son contenu
    uo_editor.is_syntax = of_syntax_for_extension(as_files[1])

    // Les octets du fichier, lus comme du texte UTF-8 (l'encodage des sources d'aujourd'hui)
    uo_editor.is_text   = String(lblb_content, EncodingUTF8!)
end if

Réagir aux modifications #

// event ue_modified_changed de uo_editor : (boolean ab_modified)
cb_save.enabled = ab_modified     // annuler jusqu'au texte enregistre le remet a false

// event clicked de cb_save
if of_save_script(uo_editor.is_text) = 1 then
    uo_editor.ib_modified = false     // le texte enregistre devient la reference
    cb_save.enabled = false
end if

ue_modified_changed est levé tout de suite, à la première frappe comme à l'annulation qui revient au texte enregistré. Écrire ib_modified ou un nouvel is_text ne lève rien : votre code le sait déjà. ue_changed, lui, attend que la frappe soit posée.

Des boutons Annuler et Rétablir #

// event ue_undo_state_changed de uo_editor : (boolean ab_can_undo, boolean ab_can_redo)
// Les boutons suivent ce que l'historique peut faire
cb_undo.enabled = ab_can_undo
cb_redo.enabled = ab_can_redo

// event clicked de cb_undo
// Le meme pas que Ctrl+Z ; le focus revient au code
uo_editor.of_undo()
uo_editor.of_focus_webview()

Un éditeur qui n'est qu'un champ d'un formulaire #

// Un filtre SQL saisi dans un formulaire
uo_filter.is_syntax = uo_filter.SYNTAX_SQL

// Tab passe au champ suivant, comme partout ailleurs
uo_filter.ib_tab_moves_focus = true

Sans cette propriété, Échap puis Tab ou Ctrl+M laissent toujours sortir l'utilisateur au clavier : l'éditeur ne piège jamais le clavier.

Renommer une variable dans tout le script #

// Local variables
long ll_count

// Mots entiers seulement : ll_total2 est une autre variable
uo_editor.ib_find_whole_word = true
ll_count = uo_editor.of_replace_all(/*find*/ "ll_total", /*replace*/ "ll_amount")   // un seul Ctrl+Z annule tout

Bonnes pratiques #

• Posez toujours is_syntax avant is_text : le code est coloré dès le premier affichage, sans recoloration visible.
• Pour un affichage en consultation, la combinaison ib_readonly + ib_line_numbers = false + ib_wrap donne une visionneuse sobre qui ne ressemble plus à un éditeur.
• Pour récupérer une saisie, lisez is_text (ou of_get_text()) une fois la frappe posée — c'est-à-dire dans votre ue_changed, qui vous dit quand.
• ib_folding n'a d'intérêt que sur des fichiers longs et structurés ; laissez-le coupé pour de courts extraits. Coupez-le avant de laisser modifier : un plan replié se lit, il ne s'édite pas, et of_get_text() rend toujours la source entière, régions fermées comprises.
• Encadrez le chargement d'un gros fichier par of_set_redraw(false) / of_set_redraw(true).
• Appelez of_reset() avant de charger un document d'une autre nature : sans cela, le langage, la taille de tabulation ou le mode lecture seule précédents restent en place.
• Après un enregistrement, remettez ib_modified à false : il redevient true à la première frappe, et false si l'utilisateur annule jusqu'au texte enregistré.
• Pour montrer les erreurs d'une compilation, of_clear_markers() puis un of_add_marker par diagnostic, et il_caret_line sur le premier.
• Dans un formulaire où l'éditeur n'est qu'un champ parmi d'autres, posez ib_tab_moves_focus = true : Tab passe alors au champ suivant, comme partout ailleurs.
• Pour des boutons Annuler / Rétablir, suivez ue_undo_state_changed et appelez of_undo / of_redo : l'historique est celui de Ctrl+Z, il compte aussi ce que fait votre code.

Hérité du socle commun #

Ces membres existent sur tous les composants visuels — ils ne sont pas propres à celui-ci. Ils sont détaillés une seule fois, dans les chapitres transverses ; cette table dit seulement où les lire.

Deux aides ne sont pas héritées : of_icon et of_escape_markup vivent sur n_pbt_utils. Déclarez-en une — n_pbt_utils lnv_utils, rien à créer — et appelez-les dessus.

← Référence des composants · Sommaire du guide