Topic locked

Unity 5 UI scaling goes wild and more

June 30, 2015 - 3:26am #1

Vuforia SDK Version: 4.2.3 -
Description with steps to reproduce:

Before adding Vuforia I made an UI using unity's modern UI (with canvas and all objects on it). Works great unless you replace camera with Vuforia's camera.

It looked OK in the editor, but on the Android device in landscape it was scaledup, so only ~7/8 part of UI fits inside the screen. But in portrait mode it is vise versa, the canvas is scaled down to cover only ~7/8 part of the screen.

Now after fiddling I did realize, that UI behaves wierd in the editor. In the scene I see that UI canvas covers exactly 100% of camera frustrum. In the game it is scaled up, so I can see only ~7/8 part of it in camera.

This is very confusing.

How does the AR_camera works exactly? Or am I allowed to use Unitys modern UI? If no... Thats really bad.

-
Development OS (Mac OS X, Windows, Linux): Windows -
Mobile OS and Version: Android Jelly beans 4.1 -
Mobile Device Manufacturer and Model name: GoClever R 70 -
Do the Vuforia Sample Applications show the same behavior?: No They used different, a very complicated UI system. I would not like to use such.

Unity 5 UI scaling goes wild and more

November 22, 2015 - 11:54pm #11

@shekhar331 :

I will follow up on the bug report you created here:

https://developer.vuforia.com/forum/issues-and-bugs/canvas-rescales-ar-camera

 

 

 

Unity 5 UI scaling goes wild and more

November 20, 2015 - 4:46am #10

Hello AlessandroB,

I have the same problem in my project too. I used vuforia 4.2.3 and Unity 5.1 I faced the problem then I upgraded to 5.2.2 and vuforia 5.0.5 Still the same problem..

I have posted the same in a new thread but no reply.....

Also as u have said

"- The Camera field of view at runtime will not be the same as the one you see in the Unity Editor;  this is because ARCamera overrides the field of view to match the one of the device (Android or iOS) camera (as otherwise you would not have a correct Augmented Reality visualization)"

I tried on different devices but the FOV remains the same i.e 51 and all the devices 

Unity 5 UI scaling goes wild and more

July 2, 2015 - 6:03am #9

Just realized that camera on my device is misconfigured. The image is stretched vertically (my face in landscape is round, but in portrait - thin, in game and in actual camera app). So Vuforia changes Cameras frustrum. But UI does not realize that. Should I go to Unity forums back to solve this?

And also. Just realized, that on the same device, I can not get cameras texture. ZXing needs Color32[] from camera. So I get a cameras Texture2D and take Color32[] out of it. And just to check if things are behaving OK, I apply that on a RawImage. In Editor works fine. On device... Nope. It's transparent. I'll try to look at its contents as text, just to make sure if it's 0,0,0,0.

But seems that I have the ugliest testing device of all. I think I should throw it away. It gave me too much stress for last week.

 

Just created new project, and built to a device. And guess what! It's OK now. Though old ones are not. I'll try to rewrite my QR script. Shouldn't be a problem.

This is 4th project already. Sorry for bothering.

Unity 5 UI scaling goes wild and more

July 1, 2015 - 4:40am #8

I've made a simple test with a basic Scene with:

- an ARCamera

- a Canvas with a Panel, a Vertical Layout group, and 4 buttons; I've also set a padding of 50 pixels in the Panel

- I tried with Overlay and Camera modes 

In both cases, I got correct results in both Portrait and Landscape modes (tested on a range of Android devices).

I am attaching screenshots taken on a Samsung S3 mini:

 

AttachmentSize
Image icon ui-portrait.png461.99 KB
Image icon ui-landscape.png533.68 KB

Unity 5 UI scaling goes wild and more

June 30, 2015 - 9:10am #7

This is with your settings. I dont see any difference. (WIN_20150630_185534.JPG; WIN_20150630_185603.JPG)

I also tried Constant Pixel Size, but the result was exactly the same. (WIN_20150630_184225.JPG; WIN_20150630_184257.JPG)

Unity 5 UI scaling goes wild and more

June 30, 2015 - 8:47am #6

OK,

here is what I would suggest, as this appears to work correctly on a quick test I made:

  • Canvas: render mode = Screen Space - Camera
  • Add a Canvas Scaler to the Canvas
  • Canvas Scaler:
    • Ui Scale Mode = Scale with Screen Size
    • Reference Resolution: 800 x 480
    • Screen Match Mode = Match Width or Height
    • Match = 0.5
    • Reference Pixels Per Unity = 100

 

Unity 5 UI scaling goes wild and more

June 30, 2015 - 8:26am #5

Unity 5.1.0f3 (also 5.1.1f but it gave the same results)

Canvas:

Render modes

  • Screen Space - Overlay (UI disappears completely)
  • Screen Space - Camera (Scaling appears)
  • World Space (Scaling appears)

By Scaling I mean that in landscape mode UI is bigger than Screen, though x and z scale are the same (aspect ratio is correct). I made shots of my device in both views.

Canvas Scaler was in Scale with screen size, Match width.

 

I'll make all possible settings screenshots (If I will have more patience). Though as I experienced earlier, it did not help much (just a bit different size of some objects that are not stretched fillscreen).

I've been struggling with this and being unable to get ZXing QR decoding to work, since it does not get camera texture2D (its being returned completely transparent). But it's a different story. I'll fiddle with it after solving this problem.

AttachmentSize
Binary Data bytes
Image icon WIN_20150630_180740.JPG327.48 KB
Image icon WIN_20150630_180847.JPG310.68 KB

Unity 5 UI scaling goes wild and more

June 30, 2015 - 7:30am #4

1. what Unity version are you using (5.0.1, 5.0.2, 5.0.3, 5.1.0, 5.1.1...)

2. how is your UI canvas configured (World Space UI, Camera or Overlay) and what Canvas Scaling mode you are using...

Unity 5 UI scaling goes wild and more

June 30, 2015 - 7:21am #3

My problem is not in inability to use UI. I test it for different resolutions in Editor. I know this tutorial. This is why I started to use this UI, its simple and elastic ways to use it for any resolution.

If I will make UI for usual scene vith basic Camera it looks OK. Whenever I use Vuforias camera, UI starts Scaleup in landscape and vise versa in portrait modes (arount 7/8 of screen size).

 

I'm working towards making an app that will scan QRcode and download an image from net, then it replace existing sprite on ImageTarget. Everything separetly from Vuforia works great. Whenever I use Vuforia prefabs, UI breaks, and I stop being able to snag a camera Texture2D for QRdecoder (though I have ane more idea how to do that).

Additionally to my first post. On portrait mode it's not just downscaling it also flips UI vertically.

If you'll help me out I promise to make a tutorial or a lesson on this for everybody to get a reference. Since UI in demos is very complicated to use.

_______________________________________________________
OK. To the case. If fov is changed after UI init phase. If I'll move AR scripts before default execution time. Should it help? If so, which script fiddles with FoV?

Unity 5 UI scaling goes wild and more

June 30, 2015 - 5:37am #2

The Canvas can scale according to different models (World /Camera/Overlay), but in any case there are some elements to keep in mind:

- The Camera field of view at runtime will not be the same as the one you see in the Unity Editor;  this is because ARCamera overrides the field of view to match the one of the device (Android or iOS) camera (as otherwise you would not have a correct Augmented Reality visualization)

- Also, (and this is NOT related to ARCamera, but it is a general consideration for Android / IOS and mobile programming), different devices have different screen resolutions and different aspect ratios; this can have a big impact on how the UI will look on your mobile device:

   on this topic, Unity provides an interesting (and very well done) tutorial: http://docs.unity3d.com/Manual/HOWTO-UIMultiResolution.html

 

Topic locked