Is there a way to get by name a GUI element?

Questions
1

Hello, ok I’m gonna be straight forward on this, it is possible to call a GUI element by name?

for context I created this GUI element let screenUI = BABYLON_GUI.AdvancedDynamicTexture.CreateFullscreenUI("UI"); and I need to dispose of it later in another place, can I call it by the name “UI”?

I searched on the docs but it doesn’t show a function that can work on my case, or at least that’s what I thought :frowning:

1 Like
2

did you try getTextureByName?
Scene | Babylon.js Documentation (babylonjs.com)

Otherwise you can dispose the screenUI as that method returns the texture.

3 Likes
3

for some reason “getTextureByName” is not being recognized as a property of scene, but no worries I solved my issue, I made the value a global variable in the class and I could solve the problem in that way, but if I could need the value in another place I will have in mind that property!

Thanks anyway for the answer :smiley:

2 Likes
4

Looks like it is a 5.0 feature (I see it in the what’s new). textures is a public property on scene:

public getTextureByName(name: string): Nullable<BaseTexture> {
        for (var index = 0; index < this.textures.length; index++) {
            if (this.textures[index].name === name) {
                return this.textures[index];
            }
        }

        return null;
    }

edit: if you have coalescing operator, you can just do scene.textures.find(t => t.name === name) ?? null;

2 Likes
5

I was able get a GUI element by name. Here are the steps that I took to do this. They are done inside of different functions within the larger createScene.

First, I added the GUI as a var in my createScene function, that way I could call it globally.

var dashboard = BABYLON.GUI.AdvancedDynamicTexture.CreateFullscreenUI("UI");

blah blah blah, return scene.

Then I added a bunch of objects to my ‘dashboard’ object.

var rect1 = new BABYLON.GUI.Rectangle("mybox");
	rect1.width = .06;
	rect1.height = .03;
	rect1.cornerRadius = 10;
	rect1.color = "white";
	rect1.thickness = 4;
	rect1.background = "black";
	dashboard.addControl(rect1);
	rect1.linkWithMesh(planet);   
	rect1.linkOffsetY = -15;

var label = new BABYLON.GUI.TextBlock("mytext");
	// following: https://playground.babylonjs.com/#XCPP9Y#121
	label.text = "I would like to change this later.";
	label.height = "40px"
	rect1.addControl(label);

later, I was able to query the dashboard for that item.

searchedLabel = dashboard.getControlByName("mytext")
searchedLabel._text = "Huzzah!"

Note that these happen in different scopes. So in the last one I was able to access the dashboard, but not the label.
However, I was able to search the dashboard for the label by name.