koobas.hobune.stream
How to position GUI Skin relative to screen size?
Hey I am trying to position the OrderBar to be on the bottom right corner. Every time i resize the screen the OrderBar doesn't resize with it.
private const int OrdersBarWidth = 140 , OrdersBarHeight = 150, ResourcesBarHeight = 40;
public GUISkin resourcesSkin, ordersSkin;
private Player player;
void Start () {
player = transform.root.GetComponent<Player>();
}
void Update () {
}
private void OnGUI()
{
if(player && player.isHuman)
{
DrawOrdersBar();
DrawResourcesBar();
}
}
private void DrawOrdersBar()
{
GUI.skin = ordersSkin;
GUI.BeginGroup(new Rect(Screen.width - 150, Screen.height - 200, OrdersBarWidth, OrdersBarHeight));
GUI.Box(new Rect(0, 0, OrdersBarWidth, OrdersBarHeight), "");
GUI.EndGroup();
}
private void DrawResourcesBar()
{
GUI.skin = resourcesSkin;
GUI.BeginGroup(new Rect(0, 0, Screen.width, ResourcesBarHeight));
GUI.Box(new Rect(0, 0, Screen.width, ResourcesBarHeight), "");
GUI.EndGroup();
}
}
Thanks in advance for your help
It looks to me like you're trying to hard-code something already built into Unity. I'm assuming you're trying to setup an information bar in the bottom corner that displays things and scales nicely to screen real estate? There's a way to accomplish this using the default Canvas Scaler script and setting it up in the editor without having to write a single line of code! I love when that happens. I'm not sure what you know or have set up in the editor for this so I'll start at the beginning: Create a GameObject of type Panel called your ResourcesBar. This will make two other Game Objects by default, a parented Canvas object, and a separate EventManager object. Keep the ResourcesBar panel object a child to the main canvas, and in its Rect Transform component hit the dropdown 'Anchors' and set them as a proportion to the canvas size (0-1). i.e. 0.5 = 50% of the screen. For a status bar like this I would do Min X 0.00 Y 0.00 Max X 1.00 Y 0.10
Then create your information as Text objects child to the Panel object, and make sure to set them up as areas with anchor transforms or else this won't work as expected (If you just place a set point at say (.5,.5) like default for text and buttons, it won't scale the box size with screen size, it'll just make sure it's centered). In the text area set the text size to 'Best Fit' and alter the range of font sizes, every project is different just play with it until it feels right.
Most importantly ~ Go to your Canvas object and under the 'Canvas Scaler' script component set 'UI scale mode' to 'Scale with screen size', and set your reference resolution (Ideally you should be fixing the Game window to a target resolution whenever setting up a UI, I usually hit 1920x1080 so just match that in the reference resolution). This will make everything scale nicely regardless of screen resolution, if the user is on a square screen it'll fill in the top and bottom with black space instead of screwing with all of your UI elements to stretch the whole space. I hope this answers what you're trying to do here.... I've been working in Unity for 5 years and haven't come across a reason to code anything about the GUI outside of a Shader.
