Tasharen Entertainment Forum
Support => NGUI 3 Support => Topic started by: Quarkism on January 29, 2014, 07:06:37 PM
-
I`m converting my app to use the new anchoring system. The new anchoring system seems less buggy and powerful than the previous one. That said, I can get the UI to look good on mobile or on desktop... but not both simultaneously.
Looking good on mobile is easy, given the limited screen size I can stretch my views to 100% of the visible region. However on desktop it looks ugly to stretch out the views to 100% of my screen size.
Hypothetically I think what is needed is a 'maximum size' for the widget control. Simply put the widget will stretch up to a given point (say 800 x 600). Ill look into making the control tonight or tomorrow. Any guidance on how I can achieve this with minimum effort would be appreciated.
-
UIRoot set to "fixed size on mobiles" is generally the optimal choice here. When I was releasing Starlink, I made it use that setting and chose a min/max resolution (720p, 1080p). Everything in between of those resolutions is pixel perfect. Everything below or above is shrunk accordingly, as if it was fixed size.
-
Thanks for your reply.
I am using a "fixed size on mobiles" root.
The problem is not fitting it for mobile screens - I optimized my views for small screens first. The problem is fitting these views on larger screens.
Imagine a "Windows Window". On mobile due to limited space you would want the thing stretched out to 100% of the screen. On desktop you would not want this. there would be too much empty space... too much space between the buttons. It is aesthetically unpleasant compared to a compact centered window.
Another example would be (reactive) webpages that shrink to smaller devices but only stretch to a point (960px).... filling the rest of the space with background (or in our place gameplay).
That said, I have come up with a fix. Its not perfect, but gets the job done without any extra code. I set the view's container widget to use a uniform anchor. I then set the anchors target's to the center. I then manually set the padding edges equal the screen size. On mobile I now have a view that fills the entire screen and on desktop I have a view in the center of the screen.