Hi, I want to be able to put some web style interface elements (interactive table, dropdown menus, hamburger style menus etc) into my app (ideally that can be data driven) but I don’t want to program them from the ground up. Ideally I would build them in an external visual tool and have the code generated for me After all theres no point re-inventing the wheel right?.
Once I have the code for the element, in theory, how do I add these kind of html elements/templates to a Playcanvas Project? Do I just paste it as a script to an empty element? Any examples of this?
I did a quick test with the tutorial example in my project. It works, but but when my code makes the app go fullscreen the html element vanishes. If I then manually minimize and maximize using F11 the html re-appears. Is this expected behaviour? Do I need to do something else to keep the html elements on top during full screen?
I also noticed that the html element also remains even after I destroy the entity containing the css/HTML when I switch scenes. Why is this?
The fullscreen APIs will fullscreen the DOM element and it’s children that it’s being called on. You should be able to do it on the document body (eg document.body.requestFullscreen()) and that would include all DOM elements that have been added to the body.
Using document.body.requestFullscreen() my DOM seems to completly clear my Playcanvas canvas with dark grey and then put the dom element on top. If I manually use F11 to switch it works fine…See images