How can I emulate the standard Project window in a custom editor window?

Question

I'm writing a custom editor window that is a file browser much like the standard Project window. The functionality is getting close, but I'm having some trouble with the look and feel.

Here's a side by side comparison of the standard Project window and my custom window.

Project vs. Art Project

Note that my folder icons are a little smaller, and fuzzy, compared with the standard ones. I got the folder icon using:

AssetDatabase.GetCachedIcon(Path.GetFileName(Application.dataPath));

Also, I haven't figured out a good way to colour the background for selected items. In the image shown, I'm using custom GUIStyles cloned from EditorStyles.foldout (for the folders) and EditorStyles.label (for the files). I set the GUIStyleState.background to EditorGUIUtility.w$$anonymous$$teTexture for all the render states in each style, but I get inconsistent results on the foldouts, w$$anonymous$$ch only sometimes use the w$$anonymous$$te background. Also, I want the background to extend all across the window, as in the standard Project window.

I also tried each of the following, but none of them seemed to have any effect?

GUI.skin = EditorGUIUtility.GetBuiltinSkin(EditorSkin.Inspector);
EditorGUIUtility.LookLikeInspector();
EditorGUIUtility.LookLikeControls();

I also haven't yet implemented the selection logic. Seems like I need to use GUI control ID's to figure out what's been clicked, but the docs are pretty sketchy, so tips here would be appreciated too.

Many thanks.

Answer 1

Best Answer

Answer by yoyo · Feb 09, 2011 at 12:36 AM

So I kept plugging away at it and managed to solve most of the issues. Here's my custom window again, alongside the standard Project window:

standard Project window and custom Art Project

To get the icons to show the right size I had to cheat a little and use System.Reflection to call the internal method EditorGUIUtility.SetIconSize(new Vector2(16f, 16f));

For the coloured selection background I'm using a GUIStyle on a BeginHorizontal that spans the full window width, with style.normal.background = EditorGUIUtility.w$$anonymous$$teTexture, and tinted by GUI.backgroundColor. (I could also have created a 1x1 coloured texture and avoided the use of GUI.backgroundColor.)

To get the selection $$anonymous$$ghlight to turn grey when the window loses focus I choose a different colour in OnFocus and OnLostFocus.

To get text colour to w$$anonymous$$te, I'm using custom GUIStyles with style.normal.textColor -- t$$anonymous$$s worked for the file items, w$$anonymous$$ch I'm drawing as labels. For the folders, drawn using EditorGUILayout.Foldout, I'm also setting active/focused/hover/onNormal/onActive/onFocused/onHover.textColor. There seems to be some funky stuff going on in the Foldout rendering, but that pretty much did the trick.

For both the file and folder styles I had to set top and bottom margin and padding to 0, and also add a content offset of (0, -2) to the folders.

For selection logic, no GUI control ID's were needed -- I just test Event.current.mousePosition against the rectangle returned by EditorGUILayout.BeginHorizontal. I implemented click-select and ctrl-click multi-select, but haven't bothered with s$$anonymous$$ft-multiselect.

Phew, glad that's done!

4 Show 14 · Share

Bunny83 · Feb 09, 2011 at 02:20 AM 0

Share

:D Sounds like a nasty piece of work, but the result really looks like the original. Well done

yoyo · Feb 09, 2011 at 05:04 AM 1

Share

Thanks :) ... if anyone's interested in the result let me know, I could tidy it up and make it public.

Joe ByDesign · Mar 02, 2011 at 03:46 PM 0

Share

How did you access the internal icons?

Would love to see this on the wiki (or Asset Store): http://www.unifycommunity.com/wiki/index.php?title=Main_Page

yoyo · Mar 02, 2011 at 05:51 PM 0

Share

Icons are retrieved with http://unity3d.com/support/documentation/ScriptReference/AssetDatabase.GetCachedIcon.html. I'll try get my implementation posted sometime soon, when I have a bit of spare time to tidy it up.

kmlau · Oct 20, 2011 at 06:31 AM 0

Share

This is awesome! Will you be able to share this on the Unity wiki or put it up for purchase on the asset store? This will really help me a lot.

Show more comments

How can I emulate the standard Project window in a custom editor window?

1 Reply

Your answer

Welcome to Unity Answers

Follow this Question

Related Questions