by shima Comment Closed

CRI Sofdec(Unreal Engine) v1
Introduction 06 How to play movies with subtitles

In this chapter, you will learn how to play Sofdec movies with subtitles.

Playing movies with subtitles


As shown below, it is possible to attach a movie to an object in the level and play it.
The specific steps are as follows:

1. Import Sofdec movie and prepare Mana assets

Follow the instructions in "Introduction 01 Simple Playback of Sofdec Movies" to import the movie you want to add subtitles to into UE5.

2. Attach a movie to a plane in the level and play it.

Create a StaticMesh to hold the ManaTexture. In this example, we use a plane.
Set it in a visible position with a 16:9 ratio.

  • Position: (100.0, 0.0, 110.0)
  • Rotation: (90.0, 0.0, 90.0)
  • Scale: (1.777, 1.0, 1.0)



Right-click in the Content Browser and select "Sofdec" -> "Mana Player".


Check “Video output ManaTexture asset” and click “OK”.
This will also create a "Mana Texture" at the same time.


Open the details screen of the Mana Player you created and set the following three items.

  • Check "Play on Open".
  • For "Mana Texture", select the Mana Texture you created when creating the Mana Player.
  • Select a movie for which you want subtitles in "Mana Movie".

Right-click on the Mana Texture in the Content Browser and select Create Material to create a material.



From the details of the Plane placed in the level, set the material to the material you just created.


The movie will now play on the plane.

3. Add subtitles to movie playback

From the Add Component drop-down list, select TextRender.


Place a TextRender in a position that is visible on the plane in the viewport.


Select Mana in the Components list.


To play movies with subtitles, edit the "Subtitle" section of the Mana details panel.

  • Turn on "Subtitles Enable" to enable subtitles.
  • Set “Subtitles Channel”.
  • Select the string encoding you used for the subtitle channel under "Subtitles Encoding" (default is utf-8).


Register for the "OnSubtitlesChanged" event.

When the event is triggered, get the new subtitle and change the text to display in TextRender.


You can copy the blueprint code here: https://blueprintue.com/blueprint/wp821pfq/



Display movie subtitles on the game screen

1. Add a new UserWidget Blueprint to the scene

In the Content Browser, create a new Blueprint Class.


Expand "All Classes" and select "Visual/Widget/UserWidget".


Rename the new asset "SubtitleWidget".


2. Add a Text Block widget in the Widget Designer

In the designer, add a “Canvas Panel” under “Panels”.


Add "Text" to "General".
Add a text block to the canvas and adjust its size.
To get proper subtitles with black outline, adjust some parameters in the text block details like anchor, font size and "Outline Settings" (size, color, etc.).
To display subtitles on multiple lines, enable "Auto Wrap Text".
We also set the Text Widget to a variable, "Is Variable", to make it accessible to other Blueprints.



3. Update the blueprint

Add one variable.

Widget (SubtitleWidget object reference): Owns the widget that will display the text on the screen.


In the Blueprint you created in the previous session, modify the Blueprint to send the subtitle text to the widget's text block.

You can copy the blueprint code here: https://blueprintue.com/blueprint/tsyxnafa/

By combining this with "Introduction 05 Full Screen Playback and Movie Playback in UI", you can play full screen movies with subtitles in the UI.

Unreal Engine Manual Reference


For more information about Actor Components and UMG, see the Unreal Engine documentation.

Actor Component http://api.unrealengine.com/JPN/Programming/UnrealArchitecture/Actors/Components/
UMG http://api.unrealengine.com/JPN/Engine/UMG/
TextRender (API) https://api.unrealengine.com/INT/BlueprintAPI/Rendering/Components/TextRender/index.html