Flat UI on mobile not showing up?

Help & Support
1

Hello,

I’ve been experimenting with different ways of doing UI and supporting interactions for both desktop / mobile / and cardboard-vr.

I’ve found that mobile/vr has a hard time with flat 2D UI, I’ve tried a 3D screen with an image element and that barely shows up on mobile, but mostly invisible. I’ve also tried used the model component as a plane, then flattening the object and using a shader to display sprites, and same thing happened where it disappeared when viewed on mobile. Any ideas here?

There was also some weirdness where I had 3 planes with sprites, and they would only show up if I had another model that was a box (which didn’t show up), but would make all the other ones show up.

So overall I’m just seeing some unexpected behavior and just want to find a reliable way to display UI for both desktop/web and also support raycast/vr gazing.

Here is an example with 3D screen and an image element that doesn’t show up on mobile.

2

2D screen wouldn’t / shouldn’t work in VR but should be fine on desktop and mobile. Would you able to show a project and screenshots of where it doesn’t do what you expect.

If you need it in VR, 3D screens are the way to go. Here is an example of one: https://developer.playcanvas.com/en/tutorials/webxr-ray-input/

1 Like
3

Just tried this on desktop and mobile and the white rectangle shows up for me. The VR feature on the project looks broken unfortunately.

1 Like
4

Interesting, and the VR does work but you have to press the vr button twice as I had to add a permissions prompt so that iOS users can use VR cardboard (device motion and orientation) otherwise doesn’t work.

It also uses WebVR since iOS also doesn’t support XR :frowning: I based it on the “VR Starter Kit (Fixed)” project. I am using a 3D screen in the project posted but I’ll take another look and also look at the example project you provided, thanks for the continued support my dude!

5

Our older WebVR examples do not support the UI elements as input AFAIK. They only recently been given support for WebXR.

7

When you say mobile, do you mean mobile or cardboard VR?

8

Both as I was seeing the issue of the flat UI disappearing initially on mobile as I went to test for cardboard, then of course that means it wouldn’t show up in cardboard as well.

9

Starting on mobile, I see this:

image
image852×1484 186 KB

Which is what I expect to see. Are you expecting something different?

10

Wait, now that I move the camera, I see what you mean now.

11

Guess I’m a little unsure now that all the Planes are showing up now without issue… I even changed the one box model back to a plane. I’m still unable to see that white 2D element off to the right.

But I suppose if the planes are now working I can go that route. I’ll have to do some more testing to make sure.

12

Interesting, it only breaks when you go into VR :thinking:

13

Looks like a bug from version 1.32.0 -> 1.32.1 that I will report and see if we get a chance to fix.

1 Like
14

Thanks! The help is super appreciated, hopefully the planes continue working and I can just go that route.