RichEditor

TsgcHTMLComponent_RichEditor — affichez un éditeur de texte enrichi WYSIWYG basé sur Quill avec une saisie masquée qui synchronise son HTML pour la soumission de formulaire, en Delphi, C++ Builder et .NET.

En bref

TsgcHTMLComponent_RichEditor

Un composant d'éditeur qui émet un div d'éditeur Quill, ses ressources CDN et un script d'initialisation, plus une saisie masquée qui reflète le contenu à chaque modification. Définissez le contenu et la barre d'outils, puis lisez la propriété HTML.

Classe du composant

TsgcHTMLComponent_RichEditor

Produit

Éditeur Quill + saisie de formulaire masquée

Famille

Formulaires & Saisies

Langages

Delphi, C++ Builder, .NET

QuickStart

Créez-le, définissez la barre d'outils, affichez-le

Définissez Name pour que le contenu soit renvoyé, choisissez une Toolbar et un Theme, puis lisez HTML (ou intégrez-le dans une page TsgcHTMLTemplate_Bootstrap).

uses
  sgcHTML_Component_RichEditor;

var
  oEditor: TsgcHTMLComponent_RichEditor;
begin
  oEditor := TsgcHTMLComponent_RichEditor.Create(nil);
  try
    oEditor.Name := 'body';
    oEditor.Content := '<p>Hello <b>world</b></p>';
    oEditor.Placeholder := 'Write your post...';
    oEditor.Height := '300px';
    oEditor.Toolbar := rtFull;
    oEditor.Theme := reSnow;

    WebModule.Response := oEditor.HTML;   // Quill editor + hidden input
  finally
    oEditor.Free;
  end;
end;

// includes: sgcHTML_Component_RichEditor.hpp

TsgcHTMLComponent_RichEditor *oEditor = new TsgcHTMLComponent_RichEditor(NULL);
try
{
  oEditor->Name = "body";
  oEditor->Content = "<p>Hello <b>world</b></p>";
  oEditor->Placeholder = "Write your post...";
  oEditor->Height = "300px";
  oEditor->Toolbar = rtFull;
  oEditor->Theme = reSnow;

  String html = oEditor->HTML;   // Quill editor + hidden input
}
__finally
{
  delete oEditor;
}

using esegece.sgcWebSockets;

var editor = new TsgcHTMLComponent_RichEditor();
editor.Name = "body";
editor.Content = "<p>Hello <b>world</b></p>";
editor.Placeholder = "Write your post...";
editor.Height = "300px";
editor.Toolbar = TsgcHTMLRichEditorToolbar.rtFull;
editor.Theme = TsgcHTMLRichEditorTheme.reSnow;

string html = editor.HTML;   // Quill editor + hidden input

Référence

Propriétés & méthodes clés

Les membres que vous utilisez le plus souvent.

Contenu

Content amorce l'éditeur avec du HTML initial ; Placeholder affiche un texte d'indication tant qu'il est vide ; ReadOnly rend une vue non modifiable.

Barre d'outils

Toolbar (TsgcHTMLRichEditorToolbar) sélectionne rtMinimal, rtBasic ou rtFull pour contrôler quels boutons de formatage apparaissent.

Thème

Theme (TsgcHTMLRichEditorTheme) bascule entre les thèmes Quill reSnow (barre d'outils bordée) et reBubble (en ligne).

Liaison de formulaire

Définissez Name pour émettre un <input> masqué dont la valeur est synchronisée avec le HTML de l'éditeur afin qu'il soit renvoyé avec le formulaire.

Dimensionnement

Height définit la hauteur du corps de l'éditeur (par exemple 300px) ; EditorID définit l'id de l'élément utilisé par le script d'initialisation de Quill.

Sortie

HTML renvoie les liens CDN de Quill, le div de l'éditeur, la saisie masquée et le script d'initialisation ; CSS fournit un style adapté au thème pour le modèle de page.

Ressources

Continuez l'exploration

	Tous les composants sgcHTMLParcourez la matrice complète des fonctionnalités de plus de 60 composants.	Ouvrir
	Télécharger la version d'essai gratuiteLa version d'essai de 30 jours fournit les projets de démonstration 60.HTML.	Ouvrir
	TarifsLicences Single, Team et Site avec code source complet.	Ouvrir