Related Learning resources:
https://forums.unrealengine.com/showthread.php?12097- Plugin-radiantui-sdk-uis-huds-interactive-webviews-html5-javascript-css
Https://www.youtube.com/channel/UCnhY_Rd8iyFrvzOgQVptWqg
http://www.bootcss.com/
Https://github.com/LeGone/RadiantUI
Prerequisite: The installation of UE4, the basic operation of UE4 have a certain understanding.
The first step:
Download the project on the Https://github.com/LeGone/RadiantUI website.
Step Two:
Open this file after decompression:
If prompted rebuild, then rebuild,rebuild If not successful, then there will be no way to continue, difficult to solve. Let's say you're okay.
Step Three:
After entering the project, click to run, first experience it.
Ability to use Web pages and all HTML technology in the game!
Fourth Step:
Close this project, new a new project:
Fifth Step:
Close this new project (which we call Learnrui Engineering ) and then copy and paste the following directory into the Learnrui
Sixth step:
to re-open the Learnrui project, click:
Verify that it is enable (restart if prompted to restart).
Seventh Step:
Create blueprints (radiantstaticmeshwebviewactor)
After clicking on the simulate , the simulation results are as follows:
Drag into the game scene, position it, and then run:
Eighth Step:
Let's be free to explore something in this blueprint :
First look at this component and see the details:
where refresh rate is the update frequency (if the value is 1, the video in the screen, the page effect will be one second frame).
URL: Web page.
Size: The dimensions of the Web page (resolution, etc.).
Mouse Effects:
Set the size to 1024x768 * 640, then stretch the actor 's dimensions to y=1.6 times to see the widescreen effect:
When the Enable is set to false , the object on this page is discarded.
Other property values:
Replicates interaction is a network synchronization.
Interactive mode:
Nineth Step: Learn how to interact
Add a box collisionand add the following nodes: (If this is not the case, go ahead and learn the basics of UE4, or talk in the comments section)
Tenth step:
Add a component to the character blueprint (Radiant Web View Interaction):
Make sure it is enabled .
11th Step:
Run, interact with it:
Note: If the collision body (box collision) is not large enough, the interactive experience will be poor.
Easy to know: when interacting, the move is not valid.
Goodbye to the next article!
--Xiao Jiang cun son of Wen jie, 7 months 5 days 15:17:31
Unreal Engine 4 Radiant UI Getting Started tutorial (0) placing pages in a scene