Issue with masking content in scroll view (play mode only)

Hello there,

I’m experiencing an issue with masking text in a scroll view. It appears fine in the editor, but the mask seems to fail to apply in play / run mode.

Issue replication: PlayCanvas | HTML5 Game Engine

Any help would be really appreciated :slight_smile:

Play Mode:

Edit Mode:


Hi @Isaac! I’m on mobile at the moment, but I can say it works correct in my own project. Unfortunately, I can’t find a difference with your project. Below an example project to compare your setup.

1 Like

Off hand, it looks like a rendering order issue? Would you be able to share the project or another project that has the same issue please?

Hi @yaustar, thanks for the investigation. You can find the public project link in the initial question. Let me know if that works for you. :slight_smile:

Hi @Albertos, thanks for the link to the other example… I’ll also check this out in my (GMT+10) morning.


1 Like

Whooops! I take a look now

The issue is that WindowElems entity doesn’t have an element component on it. There are some UI features that rely on all parents to have an element component to work correctly.

Adding an element that is group element that is ‘full screen’, makes the masking work correctly


Ah, Thanks @yaustar, very useful to know!

Maybe we could have some sort of warning indicator in the UI here? Or even a prompt for automatically adding required elements to all parents could be helpful…

Anyway, thanks again for the help, you’re a star. :slight_smile:

We do have a ticket for this in the feature request section with some discussion there:

The question here is whether it’s a bug in the engine or a ‘feature’

@jpaulo , any thoughts on this from the UI side?

I don’t believe this is a bug, but rather a requirement for the UI system to work properly with high performance. Posted my thoughts in the ticket, but basically yes, I think it makes sense to add a warning there.

1 Like