- Home /
(Editor Scripting) How to create a list view
How do I recreate a list view like the rewired editor window does? I understand that is using labels, but how do I get callbacks when they are selected? How do I make them selectable?
Example :
Answer by guavaman · Nov 03, 2017 at 02:03 AM
They're not labels, they're buttons. Each entry is a GUI.Button.
Thanks a lot for replying, but how you dod to make them look like that? I'm guessing the box is a editor scrollview, but the buttons how did you make them look like labels?
Just make the buttons transparent while the text is opaque. Set the alpha to 0.
You have to create your own GUIStyle and set all the properties manually. The listbox style in Rewired is created like this:
// create listbox style and temp textures
GUIStyle style = new GUIStyle();
style.name = "listbox";
Color textColor = EditorGUIUtility.isProSkin ? new Color(0.7f, 0.7f, 0.7f, 1.0f) : Color.black;
style.normal.textColor = textColor;
style.hover.textColor = textColor;
style.active.textColor = textColor;
style.focused.textColor = textColor;
style.onNormal.textColor = textColor;
style.onHover.textColor = textColor;
style.onActive.textColor = textColor;
style.onFocused.textColor = textColor;
style.margin = new RectOffset(0, 0, 2, 2);
style.padding = new RectOffset(4, 4, 2, 2);
Texture2D hoverTex = new Texture2D(1, 1);
hoverTex.hideFlags = HideFlags.HideAndDontSave;
tempObjects.Add(hoverTex); // store texture in a serialized list so it can be destroyed later in the event of a recompile to prevent leaked textures
hoverTex.SetPixel(0, 0, EditorGUIUtility.isProSkin ? new Color(0.35f, 0.35f, 0.35f, 1.0f) : new Color(0.95f, 0.95f, 0.95f, 1.0f));
hoverTex.Apply();
style.hover.background = hoverTex;
Texture2D highlightTex = new Texture2D(1, 1);
highlightTex.hideFlags = HideFlags.HideAndDontSave;
tempObjects.Add(highlightTex);
highlightTex.SetPixel(0, 0, EditorGUIUtility.isProSkin ? new Color(0x0a / 255f, 0x19 / 255f, 0x36 / 255f, 1.0f) : new Color(171 / 255f, 176 / 255f, 201 / 255f, 1.0f));
highlightTex.Apply();
style.onNormal.background = highlightTex;
style.onFocused.background = highlightTex;
For example, as GUIStyle if I use "label" the buttons look like labels, but don't behave like buttons anymore.
No, if you use GUI.Button (or GUILayout.Button) the behaviour is always like a button. How the visual representation looks like depends only on the used GUIStyle. By default GUI.Button uses the "button" style, GUI.Label uses the "label" style and GUI.Box uses the "box" style. For every controls you can specify a different GUIStyle which should be used to draw the control.
So if you do:
if (GUILayout.Button("Some text", "label"))
{
// some text clicked
}
It will look like a label but act like a button. You may have a look at my I$$anonymous$$GUI crash course. Unfortunately since a recent update of UnityAnswers the formatting is rather messed up (bullet points are not indented and paragraphs are not seperated anymore) which makes it look a bit messy. I still hope they bring it back to normal some day.
What i use commonly is using a GUI.Toggle with the button style as i don't like the checkbox style for toggles. However in your case you might want to use a SelectionGrid with xCount = 1. It simply shows several items in a grid layout. It simply returns the index of the item that is currently selected or "-1" if none is selected. By default it uses the Button style for each element but as i said you can use any element you like.
$$anonymous$$ake yourself familiar with what a GUIStyle actually is and what it contains, especially the different "stylestates". Some built-in styles do not have an "active" or any of the "onXXX" states that's why a label always looks the same.
Your answer
Follow this Question
Related Questions
Custom Editor GUI Elements 1 Answer
Default toggle style 1 Answer
How to tell if any textField has keyboard focus in editor? 2 Answers
Lining up GUI 1 Answer
A node in a childnode? 1 Answer