---
title: "UI方案"
author: "Perrin Yong"
author_profile: https://www.pystone.net/profile/
published_by: "Perrin Yong"
canonical: https://www.pystone.net/notes/unreal-ui-solution/
type: note
content_role: unspecified
visibility: public
id_stability: rename-stable
source_path: "10-计算机、信息技术与工程/05-游戏图形与运行时/Unreal/UI方案.md"
content_hash: dd157423bca890123804d35951ee3c487ea2afbc963eb5ac79b2ca30f19af0b7
knowledge_version: 224c990773de.5fa8af6e39fa
site_commit: 224c990773de166d23a886306577dd90379529ce
notes_commit: 5fa8af6e39fa3891d1b9b4832bfa6c4e0ecaaf0a
---
# UI方案

# UI方案

> 创建时间：2022/3/2 12:14

* 技术方案说明
    * Why Should we Use C++?
    * mix Blueprints and C++
    * UMG vs. Slate
      * 同行经验
  * UMG
    * Widgets
    * UserWidgets
      * Creating a UserWidget in C++
      * Creating new UWidgets in C++
  * Slate
  * Refs

## 技术方案说明

### Why Should we Use C++?

![assets/0007 - UI方案__resource-001-08dd4240f357.png](/media/5ddcc4357a0c1ccb2795.png)

https://benui.ca/unreal/ui-cpp-basics/

### mix Blueprints and C++

put all **the data-related logic in C++** , and **the visual logic in Blueprints**.

### UMG vs. Slate

Slate is the old Unreal UI system, and is what the UMG and the editor are built on. It uses some funky-looking C++ to simplify setting up widgets. It's important to understand that just because it's the "old" system doesn't mean it's obsolete. You will gradually need to learn Slate in order to add more complicated functionality to your UIs.

UMG is the newer UI system that was added as part of Unreal 4. It is designed to be more Blueprint-friendly and let designers visually lay out their UIs in the editor. Each UMG widget generally has an almost-identically named Slate class inside it. The **xxSlate** class handles most of the logic, and its corresponding UMG class is a wrapper around it. e.g. UImage is the UMG class, and it contains a SImage instance inside it.

UMG is simply a editor- and Blueprint-friendly **wrapper for Slate**.

#### 同行经验

UE引擎内如果开发Editor插件的话，界面UI是用UMG还是Slate比较合适?
Slate.
UMG是针对runtime的，因此一些editor的控件不会提供，比如propertyEditor
当然slate也会更底层一些，性能更高
一般是尽量做个slate底层，然后导出各种蓝图接口，然后就可以用脚本植入主体逻辑

## UMG

Unreal Motion Graphics UI Designer (UMG)

最好的UI Dev上手方法： **try out each widget and see what you can do with it**

Slots - When a widget is put inside another, we can customise how it behaves inside its parent through its Slot property.

### Widgets

![assets/0007 - UI方案__resource-002-bd90b8483b95.png](/media/c19fefbd7a46a732b188.png)

### UserWidgets

UserWidgets are used to create reusable objects with custom logic for user interfaces.

#### Creating a UserWidget in C++

```xml
public class AGenericClass<T> where T : IComparable<T> { }

```
```xml
public class AGenericClass<T> where T : IComparable<T> { }

```

#### Creating new UWidgets in C++

```xml
public class AGenericClass<T> where T : IComparable<T> { }

```
```xml
public class AGenericClass<T> where T : IComparable<T> { }

```

## Slate

## Refs

https://benui.ca/unreal/ui-cpp-basics/
https://benui.ca/unreal/ui-introduction/