(copied from question here )
Hello all, Ive been using the Babylon online GUI editor and it is great, but was wondering if there is anyway to get a javascript document of what you create there, rather then a JSON that need to be parsed? I’m thinking something similar to how the Node Material Editor works - just so I can create things more dynamically and swap out certain values.
In addition to the nested json object that you currently get exported, that looks something like this:
{
"root": {
"tags": null,
"renderToIntermediateTexture": false,
"maxLayoutCycle": 3,
"adaptHeightToChildren": false,
"adaptWidthToChildren": false,
"background": "",
"metadata": {
"_previousCenter": {
"x": 1,
"y": 1
}
},
"isHitTestVisible": true,
... etc etc
I would like something that is closer to the code you would use to create the GUI elements in Javascript, ie:
const textGUI = new TextBlock(name, text);
textGUI.color = 'white';
textGUI.fontSize = 24;
textGUI.textVerticalAlignment = 1;
textGUI.textHorizontalAlignment = 1;
textGUI.textWrapping = true;
textGUI.paddingRight = 20;
textGUI.paddingBottom = 20;
textGUI.isPointerBlocker = false;
textGUI.isHitTestVisible = false;
So, this is similar to how the node material editor can export both a json file (when clicking ‘Save’) and a javascript file where every node block is imported from the library as an object and then connected, and wrapped as a function that returns the material (when clicking ‘Get Code’).
It would be great to have a similar approach in the GUI editor where I have a series of GUI elements declared and parented, as they have been organised in the online editor, and then returning a container that has this GUI element hierarchy attached, but could be extracted into functions with parameters that would make it more reusable.