- Home /
4.6 Beta uGUI: Putting UI elements in a ScrollRect via code
For reference:
ScrollView (Parent Object)
- Content (Child Object of ScrollView)
-- Server Button 1 (Child Object of Content Object)
-- Server Button 2 (Child Object of Content Object)
-- Server Button 3 (Child Object of Content Object)
...and so forth.
I'm trying to make a server list window, done code-wise by spawning a set number of buttons inside a ScrollRect. Here's my snippet of code, that gets triggered when the server list is updated from the master server.
// NOTE: uiSLButtonPrefab is a button that has been saved as a prefab with the correct settings.
// uiServerListGO is the actual reference to the uiServerList scroll window, which is a child of the ScrollRect.
// uiButtonSize is the size of the button (in this case, 30 pixels).
void DrawServerList()
{
// Step 1: Purge all the things.
if(!uiSLButtonPrefab) return;
GameObject[] toPurge = GameObject.FindGameObjectsWithTag("SrvListEntry");
for (int i = 0; i < toPurge.Length - 1; i++) Destroy(toPurge[i].gameObject);
// Step 2: For as many items we have, do the prefabs for them.
// Not actually the real deal, done for testing.
for (int i = 0; i < 100; i++)
{
GameObject nButton = Instantiate(uiSLButtonPrefab) as GameObject;
nButton.transform.parent = uiServerListGO.transform;
nButton.transform.position = new Vector2(0, i * (uiButtonSize / 2)); // <- likely the issue but I could be wrong!
}
// Step 3, done here.
}
The code partially works. As a result, the buttons are spawned correctly and parented under the ScrollRect. However, they do not appear. Looking at the inspector reveals that they are being instantiated at something like -764 on the left and -414 on the vertical axis. When I drag these back into view, the editor shows the button with red lines through it, like it's corrupt or something. I'm not sure if I'm meant to be playing with the actual button's transform position, since buttons actually use a RectTransform. Has anyone done code-based buttons using the new UI system, and if so, could they please assist?
Cheers.
Answer by Kiwasi · Nov 19, 2014 at 04:36 AM
Bunch of things to note
The red x simply means the rectTransform limits are not valid. This is typically when the top is lower then the bottom, or the right coordinate falls to the left of the left coordinate
The easiest way to position a UI element is to use the layout elements
You can also modify its position manually, check out anchorMax, anchorMin, offsetMax and offsetMin. Docs here. Let me know if you are interested in seeing example code.
I also have a couple of video tutorials that might help.
If you can provide sample code, that would be great. I've set the anchors in the prefab to be at the top and set the width and height of the button, but all I would need to do is just change the Y of the button itself, so it appears after each other. I'll go take a look at the video tutorials and see what insight they provide.
Your answer
Follow this Question
Related Questions
unity 4.6 new UI Android soft buttons 1 Answer
[4.6] Add scroll wheel functionality to scroll rect 2 Answers
Dynamically adding (prefab) Buttons to a ScrollView 0 Answers
[4.6][UI] Render component only over parent panel. 1 Answer
HELP! Buttons stop working when made a child of a "Canvas Group" empty in 4.6.3f1? 4 Answers