- Home /
UI Position of Images changing at different resolutions
I've recently been playing around with different resolutions in my game, and noticed that most of the UI elements had the wrong positions and sizes at different resolutions. I fixed most of these issues by either setting the anchor points on the elements, or by setting the worldPositionStays to false when Parenting the element.
However, there is one part of my UI which is still playing up. I have a set of 'Cinematic Bars' which are designed to lower, be set to a position, or rise when the methods are called.
How I set them up is (depending on whether they need to lower into the scene or simply be in a lowered position on start), I Instantiate two objects from the Prefab, set their Anchored Positions to where needed, and then Parent them to an empty RectTransform 'Container' object, with worldStaysPosition set to false as with everything else. I'm setting the initial positions based on relative Screen sizes (which has been a hack in of itself because the positioning here seems to be all over the shop at Runtime). It works at my target resolution of 1920px, but at anything else, like 1024px, the lower bar appears halfway up the screen rather than the bottom. Does anyone have any insight over how I should be doing this?
public void SetBarsToLowered()
{
cinematicComplete = false;
InstantiateCinematicBars(0f, Screen.height * 0.8f * -1);
}
public void LowerBars()
{
cinematicComplete = false;
InstantiateCinematicBars(Screen.height * 0.2f, Screen.height * 1.2f * -1);
StartCoroutine(DoLowerCinematicBars());
}
private void InstantiateBars(float topYPos, float bottomYPos)
{
cinematicTopBar = Instantiate(cinematicsBarPrefab, cinematicContainer.transform);
cinematicTopBar.GetComponent<RectTransform>().anchoredPosition = new Vector2(0f, topYPos);
cinematicTopBar.transform.SetParent(cinematicContainer.transform, false);
cinematicBottomBar = Instantiate(cinematicsBarPrefab, cinematicContainer.transform);
cinematicBottomBar.GetComponent<RectTransform>().anchoredPosition = new Vector2(0f, bottomYPos);
cinematicBottomBar.transform.SetParent(cinematicContainer.transform, false);
}
Answer by HappyPixel27 · Jul 02, 2020 at 02:15 AM
Im not that skilled with this but i think that you need to anchor your empty object as well.
I did think of that, but I added a RectTransform with the anchors set, and it hasn't made a difference.
Your answer
Follow this Question
Related Questions
Is there a way to keep camera and UI always the same? 1 Answer
Weird graphic glitch on certain Android devices (2019.2.8f1) 0 Answers
Changing Aspect Ration on Different Resolutions 1 Answer
How to scale according to different mobile resolutions? 0 Answers
Multi resolution GUI From 1920x1080 source to all lower resolutions (canvas scaler dead end) 0 Answers