Cloning meshes with GUI

I want to be able to create multiple instances of a mesh that has a GUI (not fullscreen). I want the GUIs to be independent in that I can hide a control on one instance and it doesn’t affect other instances. This PG demonstrates what I am trying to achieve. It works, but there some things that are not as I would expect and I wanted to see if anyone had any insight on these issues:

  1. There is a full screen UI that appears whenever I clone a UI for a mesh. I’m not sure why this happens, but I notice in the code that ADT.clone() does appear to create a fullscreen UI
public clone(newName?: string): AdvancedDynamicTexture {
        const scene = this.getScene();

        if (!scene) {
            return this;

        const data = this.serializeContent();
        const clone = AdvancedDynamicTexture.CreateFullscreenUI(newName || "Clone of " +, this.isForeground, scene, this.samplingMode);

        return clone;

It does create the UI for the cloned mesh, which I can’t explain given the code.
2. It appears that a border is created around the entire ADT for the cloned instance that is not present in the source instance.
3. There are actually 3 clones created for the original ADT as can be seen in the GUI section of the inspector. One of these I can’t identify (by toggling the visibility of the root container). One has the expected root container in that the entire GUI (including the border visible in the cloned instance) disappears when the root container is toggled. One appears to be just the images however, when hiding the root container for this instance, it also hides the border mentioned above.

Hello! I initially implemented the clone method for the GUI Editor, which is always fullscreen, so I hadn’t considered the mesh ADT case, my apologies. I’ll work on this now, thanks for the post!


I am also noticing what appears to be a significant performance difference when cloning the ADT versus just making a new one for each instance as shown in this PG, which is the opposite of what I would expect. On my machine (which has graphics acceleration) in the PG, if I set useClone to true, I can only manage 9 FPS with 100 instances. But if I set useClone to false, I can get close to 60 FPS. GPU frame time averages 26ms in the useClone case and 2ms in the no clone case. If I remove the UIs, then the clone case is slightly faster (1050 absolute FPS versus 850).

What do you mean when you say GUI Editor is always fullscreen? It isn’t (not as far as I know and use it).

Sry, I don’t get it. If you want to clone the ADT for mesh, why are your creating an FS UI?
This is confusing me all a little. I was about to use the cloning of adt. Actually, I was the one asking for it. But then of course, the cloning was about ADT for mesh (not FS). Since you can only have one FS UI in the scene (as far as I know)???

Fullscreen in the sense that it uses AdvancedDynamicTexture.CreateFullscreenUI :sweat_smile: sorry for not clarifying

1 Like

Sry, I don’t get it. If you want to clone the ADT for mesh, why are your creating an FS UI?

I’m not. I’m using ADT.CreateForMesh.

Yes, I saw this when I finally opened your PG (my apologies). It’s the part of script you shared that got me confused. I should really learn to read the content of these posts before replying :zipper_mouth_face: :face_with_hand_over_mouth:

Ok, the fix will come in two parts :smiley: one is for properly creating the ADT when we clone it (i.e using the constructor instead of CreateFullscreen): [GUI] Fix GUI cloning by carolhmj · Pull Request #13806 · BabylonJS/Babylon.js (

And about the texture being cloned multiple times, it’s happening because when we create a GUI texture for mesh, we set it to both emissive and opacity texture channels. So I added an option to material cloning to not clone the same texture when it’s used in multiple channels (this was something more general than just the GUI so that’s why it’s in a separate PR): [Texture] Add option to material cloning to not clone the same texture multiple times by carolhmj · Pull Request #13807 · BabylonJS/Babylon.js (