Hi all. I can’t attach a link to the playgroup, but I’ll try to describe it in words. I sometimes catch wierd glitches on my gui. I was able to get rid of this with the following code, but since I have to update the whole texture, fps drops significantly
this.onBeforeDrawObservable.add(() => this.markAllAsDirty());
This is a screenshot of how it should look:
It would be wonderful to get some form of a reproduction, otherwise it is very hard to tell what the issue is. Could be an issue with caching, but I am not sure, TBH.
I also notice that there is a button added on the bottom and that the card is displayed twice. is this a part of the problem, or is this the way it is implemented?
I have no way of reproducing this, it is worth noting that the problem is only on some devices
You’ll sadly have to be more specific than that… what devices, what are they doing, what is this extra button, what is this extra card under the original card?
How are you adding your cards and removing the others? From your screenshot, it looks like you are stacking up containers. Something is likely wrong with your approach for the 2D GUI. I can’t imagine marking GUI elements as dirty as a recommendable option.
As @RaananW said, it will be hard to understand what the issue is without a PG. Even a very simple one with just a repro of the method you use and the type of containers and imbrication.
Hi. I found the cause of these glitches. I scale my window according to the height of the screen, and when I scale it, it breaks
const scale = Math.min(1, this.host.getSize().height / this.host.idealHeight);
this._container.scaleX = scale;
this._container.scaleY = scale;
this.ui = AdvancedDynamicTexture.CreateFullscreenUI('UI', true, this);
this.ui.idealHeight = 1080;
this.ui.idealWidth = 1920;
Did you try using scaleTo() for the ADT? It has recently received a fix and normally should render at new size without an update (altough I haven’t tried it). Anyways, what happens is that the ADT layer/texture does not rescale just on itself. You should try add this and see how it goes:
This does not work for me because I only need to scale a particular window without scaling the HUD, for example. Both the HUD and windows are drawn on the same texture
Can you explain “a particular window”. Might be a language problem here (english is also not my language). It seems you are using a full-screen GUI. Where for me, the ‘window’ is the ‘window of the browser’ which contains the canvas and the FS GUI fills the canvas. Since there can only be one FS GUI on the canvas, I assume your “window” must be either a container or a viewport?
Yes, I named the popup (container) as the window
So, it is a container, part of a single FS GUI. What sort of container? a rectangle, a stackpanel, a scrollviewer? an imbrication of these. Did you try just update the GUI on scale? I think we would really need to have this small repro in the PG (or the code for the entire build and logic) else this conversation might just not go to the point. Obviously, if the fix of marking all as dirty kind of solves the issue means the GUI is simply not updated. Just not sure to understand why here. On the other hand there might be some other solution for resizing the container (not using scale but resizing it) according to the window size/ratio.
Popup extends from the Abstract window, which extends the Container
export class PortWindow extends AbstractWindow (container) {
private _container: Container;
protected initiate() {
this.renderToIntermediateTexture = true;
this.isHitTestVisible = false;
// TODO: find better solution
// this.onBeforeDrawObservable.add(() => this.markAllAsDirty());
}
protected render() {
this._container = new WindowContainer();
this._container.heightInPixels = this.host.idealHeight;
this._container.isHitTestVisible = false;
this.addControl(this._container);
const main = new PortMain();
this._container.addControl(main);
main.applyProxyState(this.stateHandler);
main.init();
}
public resize() {
const scale = Math.min(1, this.host.getSize().height / this.host.idealHeight);
this._container.scaleX = scale;
this._container.scaleY = scale;
}
}
Thank you. That makes it clearer. Since I’m not a specialist for this, I’ll call back @RaananW or @carolhmj on this. Hope they will be able to spot the issue from here.
Meanwhile, have a great day 
Are you able to reproduce this scenario on a Playground? It would be super helpful to us to look into it better.
I would if I could consistently reproduce this bug. But on one of my computers it exists, on the other it does not.I would if I could consistently reproduce this bug. But on one of my computers it exists, on the other it does not
I only need to hide a control to get it to show up incorrectly
A control. Any control? A control higher in the hierarchy? All, I can see is that if you hide a control, it updates the ADT. Are you really sure this ADT is getting updated on rescale?
How does it show up on your machine?
Can you relate this glitching area to a container or a control. I.E. Could it be roughly the area covered by a textBlock?
I removed all the text blocks. There is no difference
