RichEdit

Ce RichEdit composant est un éditeur de texte enrichi pour les colonnes de texte multi-lignes Dataverse. Il propose la mise en forme propre à l’éditeur de texte enrichi de Dynamics — polices et tailles, couleurs, listes, indentations, alignement, liens, images et tables — et écrit comme Dynamics le fait, de sorte qu’un document édité dans votre portail et dans une application pilotée par modèle ressemble dans les deux cas. Il est dessiné avec les propres contrôles de Fluent UI et suit votre thème.

React Blazor

Colonnes en texte enrichi

Une colonne dont le format dans Dataverse est du texte enrichi n’a besoin d’aucun élément supplémentaire : ColumnEdit elle se RichEdit rend pour elle, avec son étiquette, sa limite de longueur, son niveau requis et ses permissions prises de la colonne comme n’importe quel autre éditeur.

React Blazor

Toute colonne de texte multiligne

Utilisez RichEdit directement pour modifier toute autre colonne de texte multiligne en texte enrichi. Sa valeur est alors le HTML du document. Les grilles et exportations affichent le texte d’une telle colonne sans sa mise en forme.

React Blazor

Images

Les images peuvent être insérées depuis la barre d’outils, collées ou déposées. Elles sont stockées sous forme de stockage par Dynamics, dans msdyn_richtextfile des enregistrements, lorsque l’utilisateur peut les créer et les lire — accordez-les dans votre tableau. Sans cette permission, une image est conservée dans le document lui-même. Réglez AllowImages pour false désactiver les images.

React Blazor

Barre d’outils condensée

Réglez ToolbarMode sur Condensed pour un éditeur avec peu de place, ou pour un texte court comme une note : la barre d’outils affiche alors uniquement la mise en forme la plus utilisée — annuler et refaire, gras, italique, souligner, rayer, surligner et couleurs de texte, listes à puces et numérotées, et liens — et un bouton à la fin qui ouvre la mise en place sur deux boutons, puis la referme. Nommez les autres boutons avec CondensedToolbarButtons (Réagir : condensedToolbarButtons), une liste de RichEditToolbarButton valeurs : la barre d’outils les affiche, dans l’ordre dans lequel la barre d’outils complète les dessine. Limitez la barre d’outils elle-même, complète ou condensée, aux boutons nommés dans ToolbarButtons (Réagir : toolbarButtons) ; cela limite les boutons, pas la mise en forme, donc les raccourcis clavier et le texte collé continuent de formater. Réglez DisplayToolbar pour false n’afficher aucune barre d’outils du tout.

React Blazor
React Blazor
React Blazor

Thème

La bordure, la barre d’outils et l’indicateur de mise au point de l’éditeur utilisent les jetons de design de Fluent UI, afin qu’ils correspondent aux autres éditeurs dans les thèmes clairs et sombres et avec la couleur d’accent. La mise en forme propre d’un document — ses polices et ses couleurs — est affichée telle qu’écrite, telle que Dynamics.

Exemple

Un RichEdit lien à une colonne en texte enrichi, ouvert sur un document d’exemple.

Exemple de réaction Exemple de Blazor React TypeScript Razor

Configuration Options

Utilisez les commandes ci-dessous pour explorer les propriétés disponibles.

Exemple de réaction Exemple de Blazor React TypeScript Razor
AnnulerRefaireFormatage de la copiePoliceTaille de policeEn grasItaliqueSoulignementPassage rayéCouleur des mèchesCouleur du texteListe à pucesListe numérotéeDiminuer l’indentationAugmentation de l’indentationCitation en blocAligner à gaucheAligner le centreAlignez-vous à droiteLienSupprimer le lienIndiceExposéInsérer l’imageDe gauche à droiteDe droite à gaucheSupprimer la mise en formeTableau d’insertion
Réagir Blazor

RichEdit Classe

Paramètres

Nom
Type
Par défaut
Description
AllowImagesbool
True
Que des images puissent être insérées — depuis la barre d’outils, collées ou supprimées. Par défaut : true.
AutoFitHeightbool
False
Que la zone de montage corresponde à son contenu — d’une ligne à RichEdit.Rows, alors défilement — plutôt que d’être RichEdit.Rows toujours en hauteur de lignes. Par défaut à false.
ChildContentRenderFragment?
Contenu enfant du composant
ColumnName*string
Nom logique de colonne pour lier l’éditeur à partir de l’enregistrement de table.
CondensedToolbarButtonsIReadOnlyCollection<RichEditToolbarButton>?
Les boutons affichés par une barre d’outils condensée (RichEditToolbarMode.Condensed), dessinés dans l’ordre dans lequel la barre d’outils complète les dessine, quel que soit l’ordre dans lequel elles sont nommées ; le bouton à sa fin Toujours ouvert sur le reste de RichEdit.ToolbarButtons. Ni posé ni vide, le formatage le plus utilisé (RichEdit.DefaultCondensedToolbarButtons : annuler et refaire, gras, italique, souligné, rayé, surligné et couleurs de texte, listes à puces et numérotées, et Liens.
Descriptionstring?
Description à afficher dans l’infobulle.
Disabledbool?
Si l’éditeur est désactivé.
DisplayLabelWhenAvailablebool
True
Précise s’il faut afficher une étiquette si disponible.
DisplayToolbarbool
True
Si la barre d’outils de mise en forme est affichée. Par défaut, .true
DisplayTooltipWhenAvailablebool
True
Précise s’il faut afficher une infobulle si disponible.
DisplayValidationErrorMessagebool
True
Un message d’erreur de validation doit-il s’afficher lorsque le composant échoue à la validation ?
IsVisiblebool
True
L’éditeur est-il visible ?
Labelstring?
Le texte doit être affiché comme une étiquette pour l’éditeur.
LabelPositionEditorLabelPosition?
Là où l’étiquette se situe par rapport au contrôle. Quand null (par défaut) le l’éditeur prend la position définie sur la section la plus proche qui entoure la section ou PageLayout, et EditorLabelPosition.Auto quand il n’y en a pas un.
MaxLengthint?
Longueur maximale de la valeur stockée, formatage inclus : ce que contient la colonne. Résolu à partir des métadonnées de la colonne lorsqu’elle n’est pas définie.
MinLengthint?
Nombre minimum de caractères de texte — le texte, pas sa mise en forme.
Placeholderstring?
Affiché dans l’éditeur pendant qu’il est vide.
ReadOnlybool?
L’éditeur devrait-il être en lecture seule ?
Requiredbool?
Si la valeur est requise.
Rowsint
10
La hauteur de la zone d’édition en lignes de texte, quelle que soit la quantité de contenu du document ; plus longue Le contenu défile. Avec RichEdit.AutoFitHeight, le maximum qu’il atteint . Par défaut est 10.
ToolbarButtonsIReadOnlyCollection<RichEditToolbarButton>?
Les seuls boutons affichés par la barre d’outils, en entier ou condensé, sont dessinés dans l’ordre de la barre d’outils complète les dessine. Une barre d’outils condensée affiche celles de RichEdit.CondensedToolbarButtons qui sont ici, et s’ouvre sur le reste ; sans aucun à afficher, il n’y a pas de bouton pour l’ouvrir fini. Il limite les boutons, pas la mise en forme : raccourcis clavier et texte collé quand même format. Ni défini ni vide, chaque bouton est affiché.
ToolbarModeRichEditToolbarMode
Full
Quelle part de la barre d’outils est affichée : chaque bouton, ou la mise en forme la plus utilisée avec un bouton qui montre le reste (RichEditToolbarMode.Condensed). Par défaut à RichEditToolbarMode.Full.
Valuestring?
Obtient ou définit la valeur de l’éditeur : le HTML de la colonne.
Nom: AllowImages
Type: bool
Par défaut: True
Description: Que des images puissent être insérées — depuis la barre d’outils, collées ou supprimées. Par défaut : true.
Nom: AutoFitHeight
Type: bool
Par défaut: False
Description: Que la zone de montage corresponde à son contenu — d’une ligne à RichEdit.Rows, alors défilement — plutôt que d’être RichEdit.Rows toujours en hauteur de lignes. Par défaut à false.
Nom: ChildContent
Type: RenderFragment?
Description: Contenu enfant du composant
Nom: ColumnName*
Type: string
Description: Nom logique de colonne pour lier l’éditeur à partir de l’enregistrement de table.
Nom: CondensedToolbarButtons
Type: IReadOnlyCollection<RichEditToolbarButton>?
Description: Les boutons affichés par une barre d’outils condensée (RichEditToolbarMode.Condensed), dessinés dans l’ordre dans lequel la barre d’outils complète les dessine, quel que soit l’ordre dans lequel elles sont nommées ; le bouton à sa fin Toujours ouvert sur le reste de RichEdit.ToolbarButtons. Ni posé ni vide, le formatage le plus utilisé (RichEdit.DefaultCondensedToolbarButtons : annuler et refaire, gras, italique, souligné, rayé, surligné et couleurs de texte, listes à puces et numérotées, et Liens.
Nom: Description
Type: string?
Description: Description à afficher dans l’infobulle.
Nom: Disabled
Type: bool?
Description: Si l’éditeur est désactivé.
Nom: DisplayLabelWhenAvailable
Type: bool
Par défaut: True
Description: Précise s’il faut afficher une étiquette si disponible.
Nom: DisplayToolbar
Type: bool
Par défaut: True
Description: Si la barre d’outils de mise en forme est affichée. Par défaut, .true
Nom: DisplayTooltipWhenAvailable
Type: bool
Par défaut: True
Description: Précise s’il faut afficher une infobulle si disponible.
Nom: DisplayValidationErrorMessage
Type: bool
Par défaut: True
Description: Un message d’erreur de validation doit-il s’afficher lorsque le composant échoue à la validation ?
Nom: IsVisible
Type: bool
Par défaut: True
Description: L’éditeur est-il visible ?
Nom: Label
Type: string?
Description: Le texte doit être affiché comme une étiquette pour l’éditeur.
Nom: LabelPosition
Type: EditorLabelPosition?
Description: Là où l’étiquette se situe par rapport au contrôle. Quand null (par défaut) le l’éditeur prend la position définie sur la section la plus proche qui entoure la section ou PageLayout, et EditorLabelPosition.Auto quand il n’y en a pas un.
Nom: MaxLength
Type: int?
Description: Longueur maximale de la valeur stockée, formatage inclus : ce que contient la colonne. Résolu à partir des métadonnées de la colonne lorsqu’elle n’est pas définie.
Nom: MinLength
Type: int?
Description: Nombre minimum de caractères de texte — le texte, pas sa mise en forme.
Nom: Placeholder
Type: string?
Description: Affiché dans l’éditeur pendant qu’il est vide.
Nom: ReadOnly
Type: bool?
Description: L’éditeur devrait-il être en lecture seule ?
Nom: Required
Type: bool?
Description: Si la valeur est requise.
Nom: Rows
Type: int
Par défaut: 10
Description: La hauteur de la zone d’édition en lignes de texte, quelle que soit la quantité de contenu du document ; plus longue Le contenu défile. Avec RichEdit.AutoFitHeight, le maximum qu’il atteint . Par défaut est 10.
Nom: ToolbarButtons
Type: IReadOnlyCollection<RichEditToolbarButton>?
Description: Les seuls boutons affichés par la barre d’outils, en entier ou condensé, sont dessinés dans l’ordre de la barre d’outils complète les dessine. Une barre d’outils condensée affiche celles de RichEdit.CondensedToolbarButtons qui sont ici, et s’ouvre sur le reste ; sans aucun à afficher, il n’y a pas de bouton pour l’ouvrir fini. Il limite les boutons, pas la mise en forme : raccourcis clavier et texte collé quand même format. Ni défini ni vide, chaque bouton est affiché.
Nom: ToolbarMode
Type: RichEditToolbarMode
Par défaut: Full
Description: Quelle part de la barre d’outils est affichée : chaque bouton, ou la mise en forme la plus utilisée avec un bouton qui montre le reste (RichEditToolbarMode.Condensed). Par défaut à RichEditToolbarMode.Full.
Nom: Value
Type: string?
Description: Obtient ou définit la valeur de l’éditeur : le HTML de la colonne.

Événements

Nom
Type
Description
ValueChangedEventCallback<ColumnValueBase>
Obtient ou définit un callback qui met à jour la valeur liée.
Nom: ValueChanged
Type: EventCallback<ColumnValueBase>
Description: Obtient ou définit un callback qui met à jour la valeur liée.

Méthodes

Nom
Paramètres
Type
Description
FocusAsyncTask
Ça place le curseur dans l’éditeur.
GetValidationErrorsList<string>
Retourne des erreurs de validation pour la valeur courante : le minimum compte le texte, le maximum compte ce qui est stocké.
OnImageErrorstring fileName
string reason
void
JS → C# : une image choisie par l’utilisateur n’a pas pu être insérée. Dit sous l’éditeur.
OnStateChangedJsonElement state
void
JS → C# : ce que montre la barre d’outils a changé — la sélection a été déplacée ou sa mise en forme a changé.
OnValueChangedstring value
Task
JS → C# : le document a changé. Contient la valeur à stocker, ou nul lorsqu’il est vide.
UploadImageAsyncIJSStreamReference image
string fileName
long size
Task<string>
JS → C# : stocke une image que l’utilisateur a insérée comme un enregistrement msdyn_richtextfile , et renvoie son identifiant — ou null lorsque l’utilisateur ne peut pas en créer un ou ne pas le relire, et le l’image est conservée dans le document à la place.
Nom: FocusAsync
Type: Task
Description: Ça place le curseur dans l’éditeur.
Nom: GetValidationErrors
Type: List<string>
Description: Retourne des erreurs de validation pour la valeur courante : le minimum compte le texte, le maximum compte ce qui est stocké.
Nom: OnImageError
Paramètres: string fileName
string reason
Type: void
Description: JS → C# : une image choisie par l’utilisateur n’a pas pu être insérée. Dit sous l’éditeur.
Nom: OnStateChanged
Paramètres: JsonElement state
Type: void
Description: JS → C# : ce que montre la barre d’outils a changé — la sélection a été déplacée ou sa mise en forme a changé.
Nom: OnValueChanged
Paramètres: string value
Type: Task
Description: JS → C# : le document a changé. Contient la valeur à stocker, ou nul lorsqu’il est vide.
Nom: UploadImageAsync
Paramètres: IJSStreamReference image
string fileName
long size
Type: Task<string>
Description: JS → C# : stocke une image que l’utilisateur a insérée comme un enregistrement msdyn_richtextfile , et renvoie son identifiant — ou null lorsque l’utilisateur ne peut pas en créer un ou ne pas le relire, et le l’image est conservée dans le document à la place.