Objectives: Real-time acquisition of virtual camera lens images in Unreal Engine and display in GUI, similar to left and right rearview mirrors display images in racing games, or real-time acquisition of camera image information display in GUI interface, or real-time capture of camera images in VR.

Test version: 4.26 (universal for most versions)

Knowledge needed:

1. SceneCaptureComponent2D

2. CanvasRender target material (CanvasRenderTarget2D)

3. Image module in UI

Function implementation approach: to obtain a virtual camera image real time display and import the UI, you need a real-time capture images and convert them into dynamic material, real-time images were obtained through the scene capture the component 2d flow, converts the render target material to ordinary material, finally to create the image in the GUI, and give the image for the module material.

Here are the steps:

1. Open the project (this article uses the racing template as an example)

2. Open the actor blueprint for the car Pawn(sedan)

3. In the Racing Actor blueprint, click Add Component in the upper left corner to find SceneCaptureComponent2D, click Add, then select this component below, and select New Asset -- Canvas Render Target from the right details panel -- SceneCapture -- Texture Target. Create a new material and name it (remember where you created it, use it next).

4. Select the viewport in the racing actor blueprint and adjust the position of the camera. The image captured by the camera depends on where the 场景捕获组件2D (SceneCaptureComponent2D) actor is placed

5. Return to the main screen, find the location of the canvas rendering target material, select the material and right click to create the material


6. Create a new UI blueprint, and put an image module, select this module and select the material created in the previous step from appearance - Brushes - Image on the right, and compile (if black is displayed, double click to open the material, and connect the RGB of the material with the final color node in the blueprint).

7. To create the UI shown in the toll-gate blueprint blueprint, can refer to this article: https://www.gongyesheji.org/?p=1942

How to make the UI(UMG) live in Windows in Unreal Engine

Final result after running:

Final effect (camera in UI on the left)

Bilibili Video: Waiting to be replenished

Finally, reference learning from:


This link is a great help, but it's not a complete reference because the requirements are not exactly the same.


20220408 Alan