Text Operations in the Rich Text Editor
- 6 minutes to read
This section contains examples that demonstrate how to insert, get, format, and delete text in the Rich Text Editor.
Insert Text
Call a sub-document’s AddTextAsync method overload to insert text into an open document.
Insert Text into the Active Sub-Document
Use the @bind-Selection attribute to bind the Selection property to a data field and access the editor’s selection. The selection’s ActiveSubDocument and CaretPosition properties allow you to access the active sub-document and get the caret position.
<DxRichEdit Id="RichEdit" @bind-Selection="@selection" @ref="@richEdit" />
@code {
DxRichEdit richEdit;
Selection selection;
@* ... *@
/* Surround the code that contains an asynchronous operation with a try-catch block to handle
the OperationCanceledException. This exception is thrown when an asynchronous operation is cancelled. */
try {
@* ... *@
// Inserts text at the caret position
await selection.ActiveSubDocument.AddTextAsync(selection.CaretPosition, "Inserted Text");
// Inserts text at the beginning of the active sub-document
await selection.ActiveSubDocument.AddTextAsync(0, "Inserted Text");
// Appends text to the active sub-document
await selection.ActiveSubDocument.AddTextAsync("Inserted Text");
@* ... *@
}
catch (OperationCanceledException e) {
Console.WriteLine($"{nameof(OperationCanceledException)} thrown with message: {e.Message}");
}
}
Insert Text into the Main Sub-Document
Use the DocumentAPI property to access the main sub-document. Call its AddTextAsync method overload to insert text.
<DxRichEdit @ref="richEdit" Id="richEdit" />
@code {
DxRichEdit richEdit;
Document documentAPI;
@* ... *@
/* Surround the code that contains an asynchronous operation with a try-catch block to handle
the OperationCanceledException. This exception is thrown when an asynchronous operation is cancelled. */
try {
documentAPI = richEdit.DocumentAPI;
@* ... *@
// Inserts text at the beginning of the main sub-document
await documentAPI.AddTextAsync(0, "New Text");
// Appends text to the main sub-document
await documentAPI.AddTextAsync("New Text");
@* ... *@
}
catch (OperationCanceledException e) {
Console.WriteLine($"{nameof(OperationCanceledException)} thrown with message: {e.Message}");
}
}
Insert Text into a Header or Footer
Use the Sections property to access sections. Call the GetHeaderAsync or GetFooterAsync method to access a section’s header or footer. Call its AddTextAsync method overload to insert text.
<DxRichEdit @ref="richEdit" Id="richEdit" />
@code {
DxRichEdit richEdit;
Document documentAPI;
@* ... *@
/* Surround the code that contains an asynchronous operation with a try-catch block to handle
the OperationCanceledException. This exception is thrown when an asynchronous operation is cancelled. */
try {
documentAPI = richEdit.DocumentAPI;
@* ... *@
// Accesses the first section
Section firstSection = await documentAPI.Sections.GetAsync(0);
// Creates the section's header if it does not exist and accesses the header
var header = await firstSection.GetHeaderAsync(HeaderFooterType.Primary, true);
// Inserts text at the beginning of the header
await header.AddTextAsync(0, "The beginning of the header.");
// Appends text to the header
await header.AddTextAsync("The end of the header.");
// Creates the section's footer if it does not exist and accesses the footer
var footer = await section.GetFooterAsync(HeaderFooterType.Primary, true);
// Inserts text at the beginning of the footer
await footer.AddTextAsync(0, "The beginning of the footer.");
// Appends text to the footer
await footer.AddTextAsync("The end of the footer.");
@* ... *@
}
catch (OperationCanceledException e) {
Console.WriteLine($"{nameof(OperationCanceledException)} thrown with message: {e.Message}");
}
}
Insert Text into a Paragraph
Use a sub-document’s Paragraphs property to access a particular paragraph. A paragraph’s Interval property allows you to obtain the interval that contains this paragraph. Use the interval Start and Length properties to calculate the insert position.
<DxRichEdit @ref="richEdit" Id="richEdit" />
@code {
DxRichEdit richEdit;
Document documentAPI;
@* ... *@
/* Surround the code that contains an asynchronous operation with a try-catch block to handle
the OperationCanceledException. This exception is thrown when an asynchronous operation is cancelled. */
try {
documentAPI = richEdit.DocumentAPI;
@* ... *@
// Accesses the first paragraph
Paragraph firstParagraph = await documentAPI.Paragraphs.GetAsync(0);
// Appends text to the paragraph
int position = firstParagraph.Interval.Start + firstParagraph.Interval.Length - 1;
await documentAPI.AddTextAsync(position, "The end of the paragraph");
// Inserts text at the beginning of the paragraph
await documentAPI.AddTextAsync(firstParagraph.Start, "The beginning of the paragraph");
@* ... *@
}
catch (OperationCanceledException e) {
Console.WriteLine($"{nameof(OperationCanceledException)} thrown with message: {e.Message}");
}
}
Get Text
Call a sub-document’s GetTextSpanAsync method overload to get the sub-document’s text span. Use the span’s Text property to convert and get the span content as plain text.
Get the Entire Text of the Main Sub-Document
The DocumentAPI property allows you to access the main sub-document. The code sample below calls the GetTextSpanAsync(Int32, Int32) method to get the sub-document’s text span.
<DxRichEdit @ref="richEdit" Id="richEdit" />
@code {
DxRichEdit richEdit;
Document documentAPI;
@* ... *@
/* Surround the code that contains an asynchronous operation with a try-catch block to handle
the OperationCanceledException. This exception is thrown when an asynchronous operation is cancelled. */
try {
documentAPI = richEdit.DocumentAPI;
@* ... *@
// Gets the main sub-document's length that corresponds to the position of last character in the last paragraph.
IReadOnlyList <Paragraph> paragraphs = await documentAPI.Paragraphs.GetAllAsync();
Paragraph lastParagraph = paragraphs.Last();
int mainSubDocumentLength = lastParagraph.Interval.Start + lastParagraph.Interval.Length;
// Gets the main sub-document's text
TextSpan textSpan = await documentAPI.GetTextSpanAsync(0, mainSubDocumentLength);
string mainSubDocumentText = textSpan.Text;
@* ... *@
}
catch (OperationCanceledException e) {
Console.WriteLine($"{nameof(OperationCanceledException)} thrown with message: {e.Message}");
}
}
Get the Selected Text
Use the @bind-Selection attribute to bind the Selection property to a data field and access the editor’s selection. Its ActiveSubDocument and Intervals properties allow you to access the active sub-document and the intervals that contain the selection.
<DxRichEdit Id="RichEdit" @bind-Selection="@selection" @ref="@richEdit" />
@code {
DxRichEdit richEdit;
Selection selection;
@* ... *@
/* Surround the code that contains an asynchronous operation with a try-catch block to handle
the OperationCanceledException. This exception is thrown when an asynchronous operation is cancelled. */
try {
@* ... *@
// Gets a textual representation of the first selected interval
SubDocument activeSubDocument = selection.ActiveSubDocument;
TextSpan firstSelectedTextSpan = await activeSubDocument.GetTextSpanAsync(selection.Intervals.First());
string selectedText = firstSelectedTextSpan.Text;
@* ... *@
}
catch (OperationCanceledException e) {
Console.WriteLine($"{nameof(OperationCanceledException)} thrown with message: {e.Message}");
}
}
Format Text
Use a sub-document’s AddTextAsync or GetTextSpanAsync method overload to get a text span and call its ChangePropertiesAsync method to customize character properties.
The example below demonstrates how to configure character properties of inserted text.
<DxRichEdit @ref="richEdit" Id="richEdit" />
@code {
DxRichEdit richEdit;
Document documentAPI;
@* ... *@
/* Surround the code that contains an asynchronous operation with a try-catch block to handle
the OperationCanceledException. This exception is thrown when an asynchronous operation is cancelled. */
try {
documentAPI = richEdit.DocumentAPI;
@* ... *@
TextSpan characters = await documentAPI.AddTextAsync("New Text");
await characters.ChangePropertiesAsync(properties => {
properties.FontName = "Arial";
properties.FontSize = 16;
properties.Underline = true;
});
@* ... *@
}
catch (OperationCanceledException e) {
Console.WriteLine($"{nameof(OperationCanceledException)} thrown with message: {e.Message}");
}
}
Delete Text
Pass an interval to a sub-document’s RemoveAsync method overload to delete the interval’s content.
<DxRichEdit @ref="richEdit" Id="richEdit" />
@code {
DxRichEdit richEdit;
Document documentAPI;
@* ... *@
/* Surround the code that contains an asynchronous operation with a try-catch block to handle
the OperationCanceledException. This exception is thrown when an asynchronous operation is cancelled. */
try {
documentAPI = richEdit.DocumentAPI;
@* ... *@
// Removes the first paragraph
Paragraph firstParagraph = await documentAPI.Paragraphs.GetAsync(0);
await documentAPI.RemoveAsync(firstParagraph.Interval);
// Removes content located on the 5-15 positions of the main sub-document
await documentAPI.RemoveAsync(5, 10);
@* ... *@
}
catch (OperationCanceledException e) {
Console.WriteLine($"{nameof(OperationCanceledException)} thrown with message: {e.Message}");
}
}