Common UI Introduction

Note: Common UI is an Experimental plugin released in Unreal Engine 4.27. It is possible that widgets described below may be removed or their interfaces significantly changed between 4.27 and their final release.

Overview

The Common UI plugin or UI Common Plugin is a set of widgets created by Epic and used in their in-house projects. The widgets solve more complex and specific problems that are not supported by the core set of Unreal Engine widgets, things like image carousels, lazy-loading images, centralizing button styles.

All of the problems are things that you may encounter on larger projects, so I think it's useful to look at the Common UI plugin to see how Epic has solved some of these problems, even if you do not intend to use the widgets as-is.

Enabling the Plugin

Under Edit > Plugins, search for Common UI and enable the plugin named "UI Common Plugin". You will need to restart your editor for it to take effect.

Note that the plugin does not seem to be included in Unreal Engine 5.0 Early Access as of December 20 2021, but is available through through 4.27.2

Project Settings

Once you have enabled the plugin, there are now some new section in your Project Settings.

The Common UI Editor section allows you to set default styles for new Common Text, Common Button and Common Border widgets.

Widgets

Common UI adds 20+ widgets, I will try to cover the most useful ones first in groups:

• Text widgets
  • Common Text
  • Common Text Style asset
  • Scroll Style asset
  • Common Numeric Text Block
  • Common Date Time Text Block
  • Common Rich Text Block
• Button widgets
• Lazy loading widgets (Coming soon)
• Switcher widgets (Coming soon)
• Input system (Coming soon)