[QUOTE=;428249]
Have you tried piping the texture into a material instance? I’m not really one to ask when it comes to shaders etc.
More of a programmer, hahah.
I’ll give things a try and see how it goes!
I did notice on Git someone has some code that might help with this if he can submit a pull request for it. Our team would be more than happy to test out things. I want the ingame UI to be as pretty as the HUD. haha
-Aric
Hi,
I’ve been using Blui (Which is brilliant) to render some simple text using HTML. I’ve been doing it in a bit of a clunky way though - i’ve had a HTML file as a string in UE and done a search and replace for the key alterations I need - for example the text contents, then saved the string as a text file, then loaded it directly into a Blui buffer. This of course is madness. Can someone point me in the right direction?
I’m using a JQUERY script to center and scale my text to a fixed width called widetext. A line of my HTML looks like this:
<span class=“scale-el” data-width=“800”><div align=“center”>This is my text</div></span>
Here is ‘Widetext’ used in a website - you can see it at the top.
In my blueprint I switch the ‘This is my text’ for something else and save it. The great thing for me here is I can have many lines which exactly span to the same width
The scale-el/widetext class is javascript though - should I be able to generate my text using JS commands with blui? If so, how?
Is there an easy way to inject a string into the HTML through one of these JS calls?
Alternatively, is there a way to pass a whole HTML file into BLUI from a string rather than saving/loading? I already have my HTML stored in UE this way.
Please help!!! I’m rubbish at Java/HTML
Dan
[QUOTE=Dannington;432629]
Hi,
I’ve been using Blui (Which is brilliant) to render some simple text using HTML. I’ve been doing it in a bit of a clunky way though - i’ve had a HTML file as a string in UE and done a search and replace for the key alterations I need - for example the text contents, then saved the string as a text file, then loaded it directly into a Blui buffer. This of course is madness. Can someone point me in the right direction?
I’m using a JQUERY script to center and scale my text to a fixed width called widetext. A line of my HTML looks like this:
<span class=“scale-el” data-width=“800”><div align=“center”>This is my text</div></span>
Here is ‘Widetext’ used in a website - you can see it at the top.
In my blueprint I switch the ‘This is my text’ for something else and save it. The great thing for me here is I can have many lines which exactly span to the same width
The scale-el/widetext class is javascript though - should I be able to generate my text using JS commands with blui? If so, how?
Is there an easy way to inject a string into the HTML through one of these JS calls?
Alternatively, is there a way to pass a whole HTML file into BLUI from a string rather than saving/loading? I already have my HTML stored in UE this way.
Please help!!! I’m rubbish at Java/HTML
Dan
You can do this via both java & jquery. Hit me up on Skype and we can exchange… I for the life of me cant even get BLUI to function in editor - and is non responsive to his UE4 grant funded project…
Anyhow I have loads of html/jquery experience and can pull this off really easy - jquery is powerful and a great tool to use for stylized animations to pull off for BLUI (I used coherent on a past project - but its price is outstanding… )
Skype: walldiv
Hi Walldiv,
After a few hours applied activity last night i’ve worked out how to get java to create a line of text in HTML - groundbreaking stuff! I think my ongoing concerns are more suited to a HTML forum than an Unreal one - this being I can’t get the Jquery function to fire on the new lines of text i’m adding.
I’d like to help you if I can though, this is my blui init pipeline:
Have you made a material with a parameter texture node which will accept the blui texture?
Dan
Ok, i’m making progress with this but i need to be able to refresh the DOM - i think.
In my chrome browser my text (lines which span a fixed width) refresh once I do a trick like hide then show. Unfortunately this doesn’t work in Blui - My dynamic text function won’t fire as I add new text with JS. Is there a JS script I can run to refresh the page without losing my dynamic lines?
Waldiv - the other thing to check is that you’ve put the blui plugin folder into the project’s plugin folder rather than the engine’s one.
I apologize for my absence.
Finals weeks are upon me . I’ll try to reply when I can.
Ok, so I’ve came across a problem with UMG. I’ve got about 150 different views to display in UE4 and with UMG inheritace not working at all (not inheriting designer data and elements) HTML seems like a good choice. I’ve got ~15 years of experience with webdev, so it’ll be probably fine.
So I’ve got questions:
Thanks
[QUOTE=Ragir;439207]
Ok, so I’ve came across a problem with UMG. I’ve got about 150 different views to display in UE4 and with UMG inheritace not working at all (not inheriting designer data and elements) HTML seems like a good choice. I’ve got ~15 years of experience with webdev, so it’ll be probably fine.
So I’ve got questions:
Thanks
I’ll help out!
The success data needs to be returned inside an array. If the array as more items than just one, it only reads the first item so all the data needs to be at index 0. I just build up objects to pass back.
I’ve had to set it up as two parts and still working on this myself. At the moment I have a class on my containers so when the webview clicks, if it isn’t clicking on an actual element, it calls a blu_event and I set the mouse mode to game and not UI. It works for now but it isn’t the full solution. Mouse events are the part bogging me down the most, mainly with UI in the scene, for the passthroughs.
Hover stuff works fine. The only thing I’ve had issue with at the moment is the drag/drop or click/drag. I’m utilzing a js library called Swiper at the click/drag isn’t the greatest since I’ve not gotten the mouse stuff all figured out and set up correctly.
Thanks for the info! I will check out your suggestions, but since I’ve got someone who’s tackling similiar issues, I’ve found a wierd thing with javascript events.
I’ve got a <button> with simple :hover and :active styles, just for testing. Clicking on it in UE fires the CSS :active styling (it blinks white for me) every time. BUT! I’ve also got a onClick() on this button that runs a JS function and that one fires only sometimes. it has jquery append in it and it appends only every ~10 clicks or so. Looks like the CSS changes, but the onClick event doesn’t fire every time. Is this a known issue or am I doing something very wrong?
[QUOTE=Ragir;439979]
Thanks for the info! I will check out your suggestions, but since I’ve got someone who’s tackling similiar issues, I’ve found a wierd thing with javascript events.
I’ve got a <button> with simple :hover and :active styles, just for testing. Clicking on it in UE fires the CSS :active styling (it blinks white for me) every time. BUT! I’ve also got a onClick() on this button that runs a JS function and that one fires only sometimes. it has jquery append in it and it appends only every ~10 clicks or so. Looks like the CSS changes, but the onClick event doesn’t fire every time. Is this a known issue or am I doing something very wrong?
Ok, disregard, it was a stupid mistake of using triggermousedown in UE4, not triggerclick.
Hello! Thanks for making such an plugin available to the community!
I seem to have a bit of an issue with input in the latest release. A lot of times it seems like my mouse clicks aren’t registering. On the Unreal Engine home page for example, I find that I have to double click a dropdown menu for the menu to pop up. I’m currently using the example hud provided in an earlier release (with a few changes that make it send Mouse Down and Mouse Up separately to the chromium process), and it appears that all the mouse events are handled correctly by the HUD blueprint.
One thing I did notice is that the cef process is barely using an cpu at all.
I appreciate any insight you have into this. Again, you are doing work here.
[QUOTE=tginick;441396]
Hello! Thanks for making such an plugin available to the community!
I seem to have a bit of an issue with input in the latest release. A lot of times it seems like my mouse clicks aren’t registering. On the Unreal Engine home page for example, I find that I have to double click a dropdown menu for the menu to pop up. I’m currently using the example hud provided in an earlier release (with a few changes that make it send Mouse Down and Mouse Up separately to the chromium process), and it appears that all the mouse events are handled correctly by the HUD blueprint.
One thing I did notice is that the cef process is barely using an cpu at all.
I appreciate any insight you have into this. Again, you are doing work here.
Make sure you’re not doing the same thing I did, which means using triggerOnmouseDown - use triggerClick, onmousedown will only fire CSS :active, not javascript onClick();
Hello,
First of all, this is an plugin! I’ve been tinkering with it some, and the results are amazing. Among the things I’ve been trying, one It’s the exact opposite of what the ‘Javacript Wiki’ states: Making the HUD display changes according to things that happen in the game. I’m probably (and surely) doing something wrong here, which is why I’d like to request some help, if possible.
To be specific, I posted a question about this with code and details here:
https://answers.unrealengine.com/questions/351868/calling-from-c-blui-webpage.html
Thanks in advance for any information anyone could provide on this.
Happy Holidays!
ArceDeer
:::::::::::::::::::::::::::::::::::::::::::::::::::
EDIT:
I don’t know if it’s been mentioned before, and if it did, sorry I’m this much of an scatterbrain.
Searching through the source I found the Blueprint callable function ‘Execute JS’. Through it, I could send basic things such as 'alert(‘x’);" and stuff, but I haven’t found how to call a JQuery function. So far, ‘$(this).someFunction();’ or just ‘someFunction();’ doesn’t do anything.
Anyways, having done that, al that would be left is making a collision trigger the blueprint event… And Interfaces are way way hard…
ArceDeer
[QUOTE=ArceDeer;443606]
Searching through the source I found the Blueprint callable function ‘Execute JS’. Through it, I could send basic things such as 'alert(‘x’);" and stuff, but I haven’t found how to call a JQuery function. So far, ‘$(this).someFunction();’ or just ‘someFunction();’ doesn’t do anything.
I don’t know how well versed are you in the HTML/CSS/JS world, but you need to include js files in a particular order for them to work properly. And make sure you call your functions when the document is ready.
Oh, thank you very much for your response. I arranged it as you would in any regular front-end webpage, and, if it helps anyone, it worked for me leaving the functions in a script tag, inside the body tag, without using the $(document).ready() function:
function showInteract() {
$("#prompt").css(“opacity”,“1”);
}
And then just calling it on the ExecuteJS function via blueprint like “showInteract();”
Even though there’s no ready function it worked… It’s strange.
Now, the only problem left is calling from C++ the blueprint function, which is proving to be really hard, haha.
How can I make replication?
[QUOTE=thedark174;445755]
How can I make replication?
Replication should be taken care of in your own methods. The UI should not be replicating anything, just displaying data from your game.
[QUOTE=ArceDeer;444961]
Oh, thank you very much for your response. I arranged it as you would in any regular front-end webpage, and, if it helps anyone, it worked for me leaving the functions in a script tag, inside the body tag, without using the $(document).ready() function:
function showInteract() {
$(“#prompt”).css(“opacity”,“1”);
}
And then just calling it on the ExecuteJS function via blueprint like “showInteract();”
Even though there’s no ready function it worked… It’s strange.
Now, the only problem left is calling from C++ the blueprint function, which is proving to be really hard, haha.
Not that strange, that’s how it’s supposed to work, functions do not have to be enclosed inside the .ready, only calling them should be.
I’m getting a laggy performance inside the engine, while the browser runs at a stable 60fps. It looks like css animations are choppy, but fading in and out elements appears smooth.
Browser reports 60fps, while the engine’s fps counter is at 120 and it’s still a bit laggy when I’m moving elements with jQuery .animate or by changing element’s class.