Rich Text Editor

You can use the Rich Text Editor control to allow users to compose rich text from your app. This text can then be used in several situations, such as emails, marketing content, and more.

Note:

You use the Rich Text Editor control together with the Microsoft Outlook 365 connection part of Integration Service to send an email. To do this, use the Send the message specified in the request body using either JSON rule and add the Rich Text Editor control in the content field. Make sure to add html in the contentType field as in the image below.

Design Time

General

• Value Binding - Bind the rich text editor to either an RPA Process argument or to an app field. This property gets resolved dynamically during runtime.
• Label - Text to be displayed next to the control. If the Required property from the Validation section is set to =true, there is also an asterisk * after the text.
• Required - If set to =true, it makes this control a mandatory one. It also adds an asterisk * after the configured label text in runtime.
• Required Error Message - Text to be displayed if the Required property is set to =true and the control is left empty.
• Hidden- If selected, hides the control in the runtime.
• Read Only - If selected, you cannot add text in the control. The already added text is still displayed.

Events

• Value changed - Configure what happens when the value is changed.

Style

• Control Alignment - By default, inherits the parent alignment. A different alignment other than the parent can be set. To default to parent's alignment, toggle the selected alignment icons to switch off the specific alignment.

  Note: Alignment is dependent on the parent's layout (vertical vs. horizontal).
• Label Placement - By default, the label is set to row and is displayed on the left side of the control. You can also choose to place it above the control by choosing the row alignment.
• Font- Sets the font of the control. Font family, size, color, and style (bold, italic, and underline) can be configured in this section. By default, the control inherits the font family of its immediate parent container, which is indicated by the keyword 'inherited'.
• Margin- Sets the margin of the control. By default 4px margin is set. Top/Bottom and Left/Right margin properties are combined. These properties can be unlinked using the unlink button on the right side of the Margin section heading.
• Size - The width and height of the control can be set in the size section. By default, the size is set to Auto. Min Width/ Min Height and Max Width/ Max Height are available under more (...) in the size section. If the size of the control is smaller than the options, a scroll bar is displayed accordingly.

Note: When the control alignment is set to Stretch and the parent control is set to Allow wrapping, the Rich Text Editor control will not stretch to the full height. To avoid this, you can remove the Stretch alignment or provide an explicit height for the control.

Runtime

Overview

Use this control to compose rich text straight from the app in runtime.

Note: In runtime, when configuring the Rich Text Editor as read-only using a checkbox, the interface changes. The text cannot be changed and the controls will be missing, but the already added text is still displayed in the control.

Interface

The interface provides useful capabilities, such as:

• Font styling - Personalize the font. You can choose from the following options:

  • Bold
  • Italic
  • Underline
  • Bullet list - Create a bullet list.
  • Numbered list - Create a numbered list.
  • Table - Create a table. You can change the style of the table (size, alignment, background color, border) by selecting Table properties from the drop-down menu.
  • Font family
  • Font size
  • Text color
  • Text background color

• Alignment - Align the content from the Rich Text Editor.

  • Align left - Align the text with a left edge.
  • Align right - Align the text with a right edge.
  • Align center - Align the text between two edges.
  • Justify - Increase the space between words to fill the entire line so that it is aligned with both the left and right edges.
• Decrease and Increase indent - Increase or decrease the space between the left and right margin of a paragraph.
• Line height - Change the space between two rows.
• Superscript and Subscript - Format the text so that it is either slightly above (superscript) or below (subscript) the normal line of type.
• Clear formatting - Remove all the formatting on a block of selected text, a paragraph, or the whole text.
• Insert/edit image - Insert an image from a Storage bucket.
• Blockquote - Indicate the quotation of a large selection of text from another source.
• Horizontal line - Insert a horizontal line.
• Insert/edit link - Insert or edit a public URL. You can also configure it to open in the same window or in a new window.
• Undo and Redo - Undo any changes or redo them if needed.

Keyboard Shortcuts

Note:

Currently the CTRL+C and CTRL+V keyboard shortcuts do not work on Windows machines for embed or image pop-ups displayed in the Rich Text Editor control.

You can use CTRL+SHIFT+C and CTRL+SHIFT+V instead."

You can use the following keyboard shortcuts to reach the control's toolbar:

Task	PC (non-macOS)	macOS
Focus or jump to menu bar	ALT+F9	Option+F9
Focus or jump to toolbar	ALT+F10	Option+F10