UMG Rich Text Block Properties

This page lists the Rich Text Block and Data Table Asset properties used in UMG Rich Text Block widgets.

Windows
MacOS
Linux

This reference page lists the properties that can be set for the Rich Text Block Widget. It also lists properties for the Rich Image Row and Rich Test Style Row data types used in a Data Table Asset.

Rich Text Block Properties

Property

Description

Slot (Canvas Panel Slot)

Anchors

This sets the anchor location for the selected widget.

  • Minimum - Holds the minimum anchors, left and top.

  • Maximum - Holds the maximum anchors, right and bottom.

Alignment

Alignment is the pivot point of the widget. Starting in the upper left at (0,0) and ending in the lower right at (1,1). Moving the alignment point enables you to move the origin of the widget.

Size To Content

When AutoSize is true, it uses the widget's desired size.

ZOrder

This indicates the order priority for rendering this widget. Higher values are rendered last, appearing on top, with lower values rendering first and appearing on the bottom.

Content

Text

This is the text to display in the widget.

Appearance

Text Style Set

This holds the Data Table Asset, which enables rich text decorators to be used for text and image styles.

Decorator Classes

Justification

This sets how the text is aligned with the margin.

Margin

This sets the amount of blank space left around the edges of the text area.

Line Height Percentage

This sets the amount each line's height is scaled by.

Wrapping

Auto Wrap Text

This is set to true if the text wraps automatically based on the computed horizontal space for this widget.

Wrap Text At

This determines whether text wraps onto a new line when its length exceeds this width. If this value is zero or negative, no wrapping occurs.

Wrapping Policy

The wrapping policy to use:

  • Default Wrapping - No fallback, just use the given line-break iterator.

  • Allow per-Character Wrapping - Fallback to per-character wrapping if a word is too long.

Behavior

Tool Tip Text

Tooltip text that shows when the user hovers the mouse cursor over the widget.

Is Enabled

This sets whether this widget can be modified interactively by the user.

Visibility

Sets the visibility of this widget.

  • Visible - The widget is visible and can interact with the cursor.

  • Collapsed - The widget is not visible and takes up no space in the layout. It can never be clicked on because it takes up no space.

  • Hidden - The widget is not visible but occupies layout space. It is not interactive because it is hidden.

  • Hit Test Invisible - The widget is visible to the user but only as art. The cursor’s hit tests will never see this widget.

  • Self Hit Test Invisible - The widget is the same as Hit Test Invisible but doesn’t apply to child widgets.

Render Opacity

The opacity of the widget.

Tool Tip Widget

Tooltip widget to show when the user hovers over the widget with the mouse.

Cursor

The cursor to show when the mouse is over the widget.

  • None - Causes no mouse cursor to be visible.

  • Default - Default arrow cursor.

  • Text Edit Beam - Indicates text that can be edited.

  • Resize Left Right - Resize horizontal arrows cursor.

  • Resize Up Down - Resize vertical arrows cursor.

  • Resize South East - Bi-directional forward resize arrow cursor.

  • Resize South West - Bi-directional back resize arrow cursor.

  • Cardinal Cross - Indicates something is being moved.

  • Crosshairs - Indicates precision selection, usually by dragging a selection box around something.

  • Hand - Uses the hand cursor with pointing finger.

  • Grab Hand - Uses the open hand cursor indicating something can be grabbed.

  • Grab Hand Closed - Uses the closed hand cursor indicating something is grabbed.

  • Slashed Circle - Cursor indicates the action cannot be completed.

  • Eye Dropper - Indicates a color can be selected.

Render Transform

Transform

The render transform of the widget allows for arbitrary 2D transforms to be applied to the widget.

  • Translation - The amount to translate the widget in X and Y in Slate Units.

  • Scale - The amount of scale to apply to the widget in X and Y in Slate Units.

  • Shear - The amount of shear to apply to the widget in X and Y in Slate Units.

  • Angle - The degree angle to rotate the widget.

Pivot

The render transform pivot controls the location about which transforms are applied. It is a normalized coordinate about which things like rotations will occur.

Performance

Is Volatile

If true, it prevents the widget or its child’s geometry or layout information from being cached. If this widget changes every frame but you want it to still be in an invalidation panel, you should mark it volatile instead of invalidating it every frame, which would prevent the invalidation panel from actually every caching anything.

Clipping

Clipping

Controls how the clipping behavior of this widget works. Normally, content that overflows the bounds of the widget continues rendering, enabling clipping prevents that overflowing content from being seen.

Elements in different clipping spaces can not be batched together, so there is performance costs when clipping is applied. Do not enable clipping unless a panel actually needs to prevent content from showing up outside its bounds.

Navigation

Left

Defines navigation when using Left:

  • Escape - Navigation is allowed to escape the bounds of this widget.

  • Stop - Navigation stops at the bounds of this widget.

  • Wrap - Navigation will wrap to the opposite bound of this object.

  • Explicit - Navigation will go to a specific widget.

  • Custom - Custom function can determine what widget is navigated to when itself or its children are navigated away from.

  • Custom Boundary - Custom Function can determine what widget is navigated to when the boundary is hit.

Right

Defines navigation when using Right:

  • Escape - Navigation is allowed to escape the bounds of this widget.

  • Stop - Navigation stops at the bounds of this widget.

  • Wrap - Navigation will wrap to the opposite bound of this object.

  • Explicit - Navigation will go to a specific widget.

  • Custom - Custom function can determine what widget is navigated to when itself or its children are navigated away from.

  • Custom Boundary - Custom Function can determine what widget is navigated to when the boundary is hit.

Up

Defines navigation when using Up:

  • Escape - Navigation is allowed to escape the bounds of this widget.

  • Stop - Navigation stops at the bounds of this widget.

  • Wrap - Navigation will wrap to the opposite bound of this object.

  • Explicit - Navigation will go to a specific widget.

  • Custom - Custom function can determine what widget is navigated to when itself or its children are navigated away from.

  • Custom Boundary - Custom Function can determine what widget is navigated to when the boundary is hit.

Down

Defines navigation when using Down:

  • Escape - Navigation is allowed to escape the bounds of this widget.

  • Stop - Navigation stops at the bounds of this widget.

  • Wrap - Navigation will wrap to the opposite bound of this object.

  • Explicit - Navigation will go to a specific widget.

  • Custom - Custom function can determine what widget is navigated to when itself or its children are navigated away from.

  • Custom Boundary - Custom Function can determine what widget is navigated to when the boundary is hit.

Next

Defines navigation when using Next:

  • Escape - Navigation is allowed to escape the bounds of this widget.

  • Stop - Navigation stops at the bounds of this widget.

  • Wrap - Navigation will wrap to the opposite bound of this object.

  • Explicit - Navigation will go to a specific widget.

  • Custom - Custom function can determine what widget is navigated to when itself or its children are navigated away from.

  • Custom Boundary - Custom Function can determine what widget is navigated to when the boundary is hit.

Previous

Defines navigation when using Previous:

  • Escape - Navigation is allowed to escape the bounds of this widget.

  • Stop - Navigation stops at the bounds of this widget.

  • Wrap - Navigation will wrap to the opposite bound of this object.

  • Explicit - Navigation will go to a specific widget.

  • Custom - Custom function can determine what widget is navigated to when itself or its children are navigated away from.

Localization

Text Shaping Method

Which text shaping method should the text within this widget use? When unset, the default is used that is set by Get Default Text Shaping Method.

  • Auto - Automatically picks the fastest possible shaping method (either Kerning Only or Full Shaping) based on the reading direction of the text. Left-to-right text uses the Kerning Only method and right-to-left uses the Full Shaping method.

  • Kerning Only - Provides fake shaping using only kerning data. This can be faster than full shaping but won’t render complex right-to-left or bi-directional glyphs (such as Arabic) correctly. It can be useful as an optimization when you know your text block will only show simple glyphs (such as numbers).

  • Full Shaping - Provides full text shaping allowing accurate rendering of complex right-to-left or bi-directional glyphs (such as Arabic). It will perform ligature replacement for all languages (such as the combined “fi” glyph in English).

Text Flow Direction

Which text flow direction should the text within this widget use? When unset, the default is used that is set by Get Default Text Flow Direction.

  • Auto - Automatically detect the flow direction for each paragraph from its text.

  • Left to Right - Force text to be flowed left-to-right.

  • Right to Left - Force text to be flowed right-to-left.

Data Table Asset Properties

Rich Image Row

Set the following properties in the Rich Image Row Data Table Asset to control the styling for images used with a Rich Text Block widget.

Property

Description

Image

The image to render for this brush. The assigned Asset can be a Texture, Material Interface, or an object implementing the Atlased Texture Interface.

Image Size

The size of the resource in Slate units.

Tint

Tinting applied to the image.

Draw As

How to draw the image.

  • Box - Draw a 3x3 box where the sides and the middle stretch based on the margin.

  • Border - Draw a 3x3 border where the sides tile and the middle is empty.

  • Image - Draw an image; the margin is ignored.

Tiling

How to tile the image while in Image mode.

  • Horizontal - Tiles the image horizontally.

  • Vertical - Tiles the image vertically.

  • Both - Tiles the image in both directions.

Preview

Set how the image should be displayed in the preview box. Horizontal Alignment:

  • Fill - The image will fill the preview box horizontally.

  • Left - The image will be aligned to the left in the preview box.

  • Center - The image will be positioned in the center of the preview box.

  • Right - The image will be aligned to the right in the preview box.

Vertical Alignment:

  • Fill - The image will fill the preview box vertically.

  • Top - The image will be aligned to the top in the preview box.

  • Center - The image will be positioned in the center of the preview box.

  • Bottom - The image will be aligned to the bottom in the preview box.

Rich Text Style Row

Set the following properties in the Rich Text Style Row Data Table Asset to control the styling for text used with Rich Text Block widget.

Property

Description

Font

Font Family

The font object (valid when used from UMG or a Slate widget style asset).

Typeface

The name of the font to use from the default typeface. If none is initially selected, the first entry (Bold) will be used.

Size

The font size is a measure in point values. The conversion of points to Slate Units is done at 96 dpi. So, if you’re using a tool like Photoshop to prototype layouts and UI mockups, be sure to change the default dpi measurements from 72 dpi to 96 dpi.

Font Material

The material to use when rendering this font.

Outline Settings

Settings for applying an outline to a font.

  • Outline Size - Size of the outline in Slate Units (at 1.0 font scale, this unit is a pixel).

  • Separate Fill Alpha - If enabled, the outline will be completely translucent where the filled area will be. It allows for a separate fill alpha value to be used. The tradeoff when enabling this is slightly worse quality for completely opaque fills where the inner outline border meets the fill area.

  • Outline Color - The color of the outline for any character in this font.

Color

The color and opacity of this the text.

Shadow Offset

How much should the shadow be offset? An offset of 0 implies no shadow.

Shadow Color and Opacity

The color and opacity of the shadow.

Shadow Background Color

The background color of selected text.

Highlight Color

The color of highlighted text.

Highlight Shape

Image

The image to render for this brush. The assigned Asset can be a Texture, Material Interface, or an object implementing the Atlased Texture Interface.

Image Size

The size of the resource in Slate units.

Tint

Tinting applied to the image.

Draw As

How to draw the image.

  • Box - Draw a 3x3 box where the sides and the middle stretch based on the margin.

  • Border - Draw a 3x3 border where the sides tile and the middle is empty.

  • Image - Draw an image; the margin is ignored.

Tiling

How to tile the image while in Image mode.

  • Horizontal - Tiles the image horizontally.

  • Vertical - Tiles the image vertically.

  • Both - Tiles the image in both directions.

Preview

Set how the image should be displayed in the preview box:
Horizontal Alignment:

  • Fill - The image will fill the preview box horizontally.

  • Left - The image will be aligned to the left in the preview box.

  • Center - The image will be positioned in the center of the preview box.

  • Right - The image will be aligned to the right in the preview box.

Vertical Alignment:

  • Fill - The image will fill the preview box vertically.

  • Top - The image will be aligned to the top in the preview box.

  • Center - The image will be positioned in the center of the preview box.

  • Bottom - The image will be aligned to the bottom in the preview box.

Underline Brush

Image

The image to render for this brush. The assigned Asset can be a Texture, Material Interface, or an object implementing the Atlased Texture Interface.

Image Size

The size of the resource in Slate units.

Tint

Tinting applied to the image.

Draw As

How to draw the image.

  • Box - Draw a 3x3 box where the sides and the middle stretch based on the margin.

  • Border - Draw a 3x3 border where the sides tile and the middle is empty.

  • Image - Draw an image; the margin is ignored.

Tiling

How to tile the image while in Image mode.

  • Horizontal - Tiles the image horizontally.

  • Vertical - Tiles the image vertically.

  • Both - Tiles the image in both directions.

Preview

Set how the image should be displayed in the preview box:
Horizontal Alignment:

  • Fill - The image will fill the preview box horizontally.

  • Left - The image will be aligned to the left in the preview box.

  • Center - The image will be positioned in the center of the preview box.

  • Right - The image will be aligned to the right in the preview box.

Vertical Alignment:

  • Fill - The image will fill the preview box vertically.

  • Top - The image will be aligned to the top in the preview box.

  • Center - The image will be positioned in the center of the preview box.

  • Bottom - The image will be aligned to the bottom in the preview box.

Select Skin
Light
Dark

Welcome to the new Unreal Engine 4 Documentation site!

We're working on lots of new features including a feedback system so you can tell us how we are doing. It's not quite ready for use in the wild yet, so head over to the Documentation Feedback forum to tell us about this page or call out any issues you are encountering in the meantime.

We'll be sure to let you know when the new system is up and running.

Post Feedback