koobas.hobune.stream
GUI Resize Mobile
Hello everyone,
I'm working on this particle animation app for android. Everything is good with it, but I've designed half of the gui (static text elements) just byc reating a gui textobject.
The rest is programmed in the ongui funtion like this:
function OnGUI() {
str = GUI.TextField (Rect (200, 170, 100, 25), str, 25);
if (GUI.Button(Rect(128,350,50,30),"GO!")){
Debug.Log("Clicked the button with text");
objToEdit.particleEmitter.maxEmission = theInt;
Application.LoadLevel(1);
}
}
This includes a button and a textfield, in the update function I converted the string into an Int.
I have my gameview set to 320 x 480, on my pc everything is fine, but when I open the app on my Galaxy S3, it screws with the design.
Is this because there's more pixels than selected? And if so, how do I resize it, or is there like a control that I need to enable?
I'm kinda lost here,
Thanks,
Jordi
The easiest (Lazy) way to do is by modifying the GUI matrix to "scale" e.g. if you put this line of code at the beginning of your GUI function(you might need to swap the numbers if needed):
GUI.matrix = Matrix4x4.TRS(Vector3.zero, Quaternion.identity,new Vector3(Screen.width / 480.0f, Screen.height / 320.0f, 1));
However, this will scale according to the aspect ratio you specified so it might look stretched depending on different screen sizes.
The best way is to accommodate to different screen ratios by doing more clever position changes without affecting the aspect ratios for your gui element
Some guys at Schell Games did a great presentation on this at Unite 11:
http://video.unity3d.com/video/3708530/unite-11-scaleable-game
Jump to 32:00 for their solution, which uses a ScriptableObject to hold a GUI layout. The nice thing about using ScriptableObjects is that you can play with the layout on the fly (WYSIWYG).
The layout is a collection of scaled rects for each control. Each scaled rect specifies an anchor (e.g., centered, bottom right, etc) and a proportional size (e.g., 20% of the screen in width X 10% of the screen in height). Their implementation also has min and max sizes to keep it looking good on extra small or extra large screens. This solution allows it to automatically scale the GUI to any screen resolution.
There are lots of third party assets that can do this for you. I would recommend GUI Essentials since it will scale your GUI to any resolution but it also has the option of forcing a specific aspect ratio (and your GUI elements stay in the right place).
