FREE: Web UI (HTML/CSS/JS Interface)

After already dealing with the past two users, I don’t really care to respond to or even read any of what they have to say. I’m just here to let everyone know that the UE5 plugin has been updated:

  • accelerated paint is now enabled by default
    • this will cause issues with multi-gpu platforms
    • soon we’ll add support to detect multi-gpu platforms to temporarily disable it
  • a packaging issue has been fixed

Ok so I ended up catching a little bit of what the last guy posted after my reply popped in cause it was hard not to, and I therefore want to mention one very important thing since it seems there’s some confusion surrounding this plugin…

If you are using this plugin for GAMEPLAY elements then you are an idiot. This plugin is strictly designed for user-interface development, such as buttons and menus and all the things that float on the sides of the screen. It allows you to create rich interfaces that look a lot more professional, and you don’t have to deal with the basic slate form elements since you can style these things in CSS instead.

If you need for instance, names/text to hover on other players, you should be making that in slate using blueprints or C++. If you are trying to do this with a web interface, you are an idiot. If you need for instance crosshairs to be in the center of your screen, you should be making that in slate using blueprints or C++. If you are trying to do this with a web interface, you are an idiot.

So please don’t misuse a tool beyond its obvious intended expectations. That’s like trying to put a screw in a wall using a hammer. It just shows you have no idea what you’re doing.

It’s actually very funny when you’re talking about idiots not understanding absurd and totally counterintuitive limitations of your plugin. Why absurd? Because Chromium is capable of running much faster than your CEF implementation and has no problems with multi-gpu systems. Everybody who ever used Chrome browser knows that.

It took me less than 40 hours to modify the Epic’s code and implement CEF into UE5 running at ~94% of the speed of Chrome. Yes, there’ still a barely noticeable input lag, but crosshairs work just fine. This one will be particularly interesting for you: I was totally chill all the time and insulted exactly zero people in the process. Your plugin gives me black screen with accelerated paint enabled on my Dell G5 and on four other laptops with both dedicated and integrated GPUs. My implementation runs just fine on them all.

Once I’m done, you can buy my solution for $50 and study its guts. However, it certainly takes an experienced developer to understand how it works…

Hey guys! Let’s make sure we’re being civil and respectful to all members of the Unreal Engine community. You can check out the code of conduct here to see what we expect from all our members.

Best,
Panda

1 Like

I forgot to mention something earlier due to all the distractions. There’s a new feature in the works that will be pretty useful. When we first started using the CEF for user interfaces any Steam profile images were just accessed via HTTPS online.

But this isn’t ideal especially in an offline scenario where profile images would still be cached in Steam. Therefore a method was developed using a custom scheme handler such as this:

jpg://steam/76561197960287930

That triggers a function in C++ or blueprints that allows you to return binary image data, and a corresponding scheme handler is available for PNG too. There you could call the SteamUtils()->GetImageSize() and SteamUtils()->GetImageRGBA() functions.

The custom pak:// scheme handler can also be used as well for engine materials. Normally this would load an image directly from disk or a PAK file in shipping builds.

However what if the JPG or PNG doesn’t exist but a file of the same name with a .uasset extension exists instead? Then we could convert the engine material to either a JPG or PNG at runtime:

pak://folder/filename.jpg or pak://folder/filename.png/Content/folder/filename.uasset

The plugin has been updated with texture/material redirects for browser images. More details can be found on the releases page:

https://github.com/tracerinteractive/UnrealEngine/releases

pak://StarterContent/Materials/M_Wood_Walnut.png or pak://StarterContent/Materials/M_Wood_Walnut.jpg → /Content/StarterContent/Materials/M_Wood_Walnut.uasset

pak://StarterContent/Textures/T_Metal_Steel_D.png or pak://StarterContent/Textures/T_Metal_Steel_D.jpg → /Content/StarterContent/Textures/T_Metal_Steel_D.uasset

Here is the update:

https://github.com/tracerinteractive/UnrealEngine/commit/5d7089daa39592fb2089dec28aa1437d8653fb4c

The plugin has been updated again! The major issue with background-color: transparent has been fixed:

https://github.com/tracerinteractive/UnrealEngine/releases

This update also includes support for render targets as an asset type when using redirect engine images:

pak://MyFolder/RT_SomeRenderTarget.png → /Content/MyFolder/RT_SomeRenderTarget.uasset

Now you can generate images at runtime using various render targets, such as capturing an image from a camera component.

The update also includes support for query string parameters on redirected engine textures, materials, and render targets:

pak://StarterContent/Textures/T_Metal_Steel_D.png?w=1024 (maintains aspect ratio)
pak://StarterContent/Textures/T_Metal_Steel_D.png?h=2048 (maintains aspect ratio)
pak://StarterContent/Textures/T_Metal_Steel_D.png?w=1000&h=500 (stretches)
pak://StarterContent/Materials/M_Wood_Walnut.png?w=512&h=512 (required for materials)

1 Like

Man I want thank you, or the person who has made this plugin, this is just GODLIKE, THANKYOU VERY MUCH!!!

My contriburion for this plugin in portuguese :slight_smile:


Hello, when I put the UMG on the screen, and put the Actor into the scene, he can’t display the UMG correctly, but it’s black, but when I move the mouse over the black UMG, he can prompt me with the contents of the URL link ~ I don’t know what the problem is

I was getting this, too. I had to disable “accelerated paint” for it to work on my machine for some reason – I suspect it has to do with the split video cards MSI likes to run with, but I haven’t dug much around with it to figure it out. Eventually, I’ll sit down and troubleshoot it since I’m doing a bunch of CSS animations, but for now it’s working without accelerated paint, and I can live with that.