- Home /
How can I get the top right position of a dynamically sized Panel?
I have a Panel that's positioned in the center of my scene (horizontal and vertical). I insert Buttons at runtime into the Panel. To resize the Panel depending of its content I added a Vertical Layout Group and a Content Size Fitter onto it.
This works fine, but now I want to add a close Button and try to position it at the top right corner of the panel. Any idea how I can get the position of the top right corner to position my close button accordingly?
You can see the close button (X) at the bottom of the screenshot. I tried to position it like that:
RectTransform menuRect = menu.GetComponent<RectTransform> ();
RectTransform closeRect = close.GetComponent<RectTransform> ();
closeRect.position = new Vector3 (closeRect.position.x, menuRect.sizeDelta.y, closeRect.position.z);
Answer by Vencarii · Feb 26, 2018 at 09:33 PM
This thread was a life saver, it works now! Here is the solution how (for my Panel setup see the screenshot in my comment below. The close button is aligned to the center as well with the anchors to 0,0!):
public void ShowMovieList()
{
GameObject canvas = (GameObject)Instantiate (movieMenuPrefab);
GameObject menu = canvas.transform.Find("Panel").gameObject;
GameObject close = canvas.transform.Find("Close").gameObject;
List<Movie> movies = _gameManager.GetAllMovies ();
for (int i=0; i<movies.Count; i++) {
// init menu item (button in my case)
GameObject item = (GameObject) Instantiate (movieItemPrefab);
// add text to button
item.transform.Find ("MovieTitle").GetComponent<Text> ().text = movies [i].movieName + " [" + movies [i].rating + "]";
item.transform.Find ("MoviePrice").GetComponent<Text> ().text = movies [i].price + " €";
// onClick Event
Movie tmpMovie = movies[i];
item.GetComponent<Button> ().onClick.AddListener (() => OnClickMovieItem(tmpMovie));
// add button to panel
item.transform.SetParent (menu.transform, false);
}
RectTransform closeRect = close.GetComponent<RectTransform> ();
RectTransform menuRect = menu.GetComponent<RectTransform> ();
// with this coroutine it works!
StartCoroutine(SetCloseButtonPosition(menuRect, closeRect));
canvas.SetActive (true);
}
IEnumerator SetCloseButtonPosition(RectTransform menuRect, RectTransform closeRect)
{
yield return new WaitForEndOfFrame();
closeRect.anchoredPosition = new Vector2 (menuRect.rect.width / 2, menuRect.rect.height / 2);
}
Answer by Lilius · Feb 26, 2018 at 07:28 PM
I have just created a dynamically created UI that does something similiar. I don't know about your hierarchy, but I would create it like this: Panel as parent, a container (just an empty gameobject) for buttons as child. Container streched to panel size (then add layout group etc like you have done, to your container). Next your close button as child of the panel. Set the close buttons anchors to TopRight of panel. Then, if your closebuttons size is 10x10, set your close buttons posX and posY to -10 (negate the value of your size). This should position your close button to top right corner of your panel with a slight margin, you can adjust the position to your preference. If you need to adjust any of the values in code, these should do it:
closeRect.anchorMin = new Vector2(1,1);
closeRect.anchorMax = new Vector2(1,1);
closeRect.anchoredPosition = new Vector2(-10,-10);
closeRect.sizeDelta = new Vector2(10,10);
closeRect.pivot = new Vector2(0.5f,0.5f);
Thanks for your answer, but I don't get it to work. :-/
Here is another screenshot with my current setup. I can see the height of the Panel (164 in this case) in the RectTransform component, but it's grey. $$anonymous$$y idea is to position the Close Button at menuRect.rect.height / 2...
The message in the console is from Debug.Log (menuRect.rect); It says the Panel height is 0.00 ... any idea why? Do I have to refresh the RectTransform when I added elements by script somehow?