Search Unity

  1. Megacity Metro Demo now available. Download now.
    Dismiss Notice
  2. Unity support for visionOS is now available. Learn more in our blog post.
    Dismiss Notice

Official skins

Discussion in 'Immediate Mode GUI (IMGUI)' started by NicholasFrancis, Nov 9, 2007.

  1. NicholasFrancis

    NicholasFrancis

    Joined:
    Apr 8, 2005
    Posts:
    1,587
    Here are the official Unity 2 built-in skin, as well as the photoshop file it came from...
     

    Attached Files:

  2. monark

    monark

    Joined:
    May 2, 2008
    Posts:
    1,598
    What version of photoshop was this made in? Opening in 7 causes corruption. Do I need CS3?
     
  3. AngryAnt

    AngryAnt

    Keyboard Operator

    Joined:
    Oct 25, 2005
    Posts:
    3,045
    Sort of an odd request, but could you possibly also make the built in editor skin available? It would really save me some time compared to me (and my world renowned artistic skills) reproducing it.
     
  4. asterix

    asterix

    Joined:
    Aug 1, 2009
    Posts:
    245
    Can we have skin for PC?

    Thanks
     
  5. HiggyB

    HiggyB

    Unity Product Evangelist

    Joined:
    Dec 8, 2006
    Posts:
    6,183
    What do you mean? The skins provided should work in Unity on both Mac and Windows.
     
  6. Tzan

    Tzan

    Joined:
    Apr 5, 2009
    Posts:
    733
    The psd file wont work in PS 6.

    Yeah its old but new versions cost money and this is the first file I've ever had problems with.

    Knowing what version its from would help.
    I might get CS2 but not the really expensive ones.
     
  7. asterix

    asterix

    Joined:
    Aug 1, 2009
    Posts:
    245
    Oh how I install it then?

    Thanks
     
  8. bloodtiger10

    bloodtiger10

    Joined:
    Nov 9, 2008
    Posts:
    619
    there already there, the built in ones. They are when you have no GUI skin set.
     
  9. HiggyB

    HiggyB

    Unity Product Evangelist

    Joined:
    Dec 8, 2006
    Posts:
    6,183
    Or to import the skin to actually take a look at its settings, simply download the Unity package file above, then open your project and double-click the package file and it will import everything into your project. As noted above the default skin is always there just sort of "hidden" from view. Manually importing the package above lets you see the settings and textures and then customize from there.
     
  10. rterranova

    rterranova

    Joined:
    Nov 6, 2009
    Posts:
    43
    You have posted the .psd but the skin uses .pngs files for all the pieces? Were all the .pngs cut by hand from the .psd?

    Sorry I know it's been a long time since you posted on this topic.
     
  11. NicholasFrancis

    NicholasFrancis

    Joined:
    Apr 8, 2005
    Posts:
    1,587
    I use Photoshop's Save For Web And Devices in the file menu (usually referred to as SFW)

    It's really nice for this kind of stuff - you can cut the image up into a gazillion slices and assign a filename to each slice. Then you use SFW to make it spit out all images at once).

    The Unity3 skins are made this way. I generate around 500 images from a few photoshop files.
     
  12. Alex-Chouls

    Alex-Chouls

    Joined:
    Mar 24, 2009
    Posts:
    2,652
    Are the built-in editor skins for 3.0 available for download?
     
  13. Alex-Chouls

    Alex-Chouls

    Joined:
    Mar 24, 2009
    Posts:
    2,652
    Figured out a workaround to copy GUIStyles and textures from the editor skin to my own skin:

    Code (csharp):
    1. using UnityEngine;
    2. using UnityEditor;
    3. using System.Collections;
    4.  
    5. public class CopyEditorSkin : EditorWindow
    6. {
    7.     public GUISkin skin;
    8.  
    9.     [MenuItem("Window/CopyEditorSkin")]
    10.     public static void Init()
    11.     {
    12.         CopyEditorSkin window = (CopyEditorSkin)EditorWindow.GetWindow(typeof(CopyEditorSkin));
    13.     }
    14.  
    15.     public void OnGUI()
    16.     {
    17.         skin = EditorGUILayout.ObjectField(skin, typeof(GUISkin)) as GUISkin;
    18.  
    19.         if (skin == null)
    20.             GUI.enabled = false;
    21.  
    22.         if (GUILayout.Button("Copy Editor Skin"))
    23.         {
    24.             GUISkin builtinSkin = EditorGUIUtility.GetBuiltinSkin(EditorSkin.Inspector);
    25.  
    26.             GUIStyle button = skin.FindStyle("Button");
    27.             GUIStyle copyButton = builtinSkin.FindStyle("Button");
    28.             button.normal.background = copyButton.normal.background;
    29.  
    30.             // and so forth...
    31.         }
    32.     }
    33. }
    However I can't figure out a way to save the textures to disk so I can modify them.

    Does anyone know a way to save these built-in textures?

    Or a quicker way to copy the built-in editor skin?

    Thanks!
    Alex
     
  14. Alex-Chouls

    Alex-Chouls

    Joined:
    Mar 24, 2009
    Posts:
    2,652
    [EDIT: Actually this doesn't seem to survive restarting the editor... it just looked like it worked :( ]

    Okay, this editor script seems to do what I want:

    Code (csharp):
    1. using UnityEngine;
    2. using UnityEditor;
    3. using System.Collections;
    4.  
    5. public class CopyEditorSkin : EditorWindow
    6. {
    7.     public GUISkin mySkin;
    8.     public EditorSkin editorSkin = EditorSkin.Inspector;
    9.    
    10.     string[] stylesToCopy = new string[]
    11.     {
    12.         "Box",
    13.         "Button",
    14.         "Toggle",
    15.         "Label",
    16.         "TextField",
    17.         "TextArea",
    18.         "Window",
    19.         "HorizontalSlider",
    20.         "HorizontalSliderThumb",
    21.         "VerticalSlider",
    22.         "VerticalSliderThumb",
    23.         "HorizontalScrollbar",
    24.         "HorizontalScrollbarThumb",
    25.         "HorizontalScrollbarLeftButton",
    26.         "HorizontalScrollbarRightButton",
    27.         "VerticalScrollbar",
    28.         "VerticalScrollbarThumb",
    29.         "VerticalScrollbarUpButton",
    30.         "VerticalScrollbarDownButton",
    31.         "ScrollView"
    32.     };
    33.  
    34.     [MenuItem("Window/CopyEditorSkin")]
    35.     public static void Init()
    36.     {
    37.         CopyEditorSkin window = (CopyEditorSkin)EditorWindow.GetWindow(typeof(CopyEditorSkin));
    38.         window.Show();
    39.     }
    40.  
    41.     public void OnGUI()
    42.     {
    43.         mySkin = EditorGUILayout.ObjectField("My Skin", mySkin, typeof(GUISkin)) as GUISkin;
    44.         editorSkin = (EditorSkin)EditorGUILayout.EnumPopup("Editor Skin", editorSkin);
    45.  
    46.         if (mySkin == null)
    47.             GUI.enabled = false;
    48.  
    49.         if (GUILayout.Button("Copy Editor Skin"))
    50.         {
    51.             foreach (string styleName in stylesToCopy)
    52.                 CopyEditorStyle(styleName);
    53.         }
    54.     }
    55.  
    56.     void CopyEditorStyle(string styleName)
    57.     {
    58.         GUISkin builtinSkin = EditorGUIUtility.GetBuiltinSkin(editorSkin);
    59.         CopyGUIStyle(builtinSkin.FindStyle(styleName), mySkin.FindStyle(styleName));
    60.     }
    61.  
    62.     void CopyGUIStyle(GUIStyle from, GUIStyle to)
    63.     {
    64.         to.name = from.name;
    65.         to.normal = from.normal;
    66.         to.hover = from.hover;
    67.         to.active = from.active;
    68.         to.focused = from.focused;
    69.         to.onNormal = from.onNormal;
    70.         to.onHover = from.onHover;
    71.         to.onActive = from.onActive;
    72.         to.onFocused = from.onFocused;
    73.         to.border = from.border;
    74.         to.padding = from.padding;
    75.         to.margin = from.margin;
    76.         to.overflow = from.overflow;
    77.         to.font = from.font;
    78.         to.imagePosition = from.imagePosition;
    79.         to.alignment = from.alignment;
    80.         to.wordWrap = from.wordWrap;
    81.         to.clipping = from.clipping;
    82.         to.contentOffset = from.contentOffset;
    83.         to.fixedWidth = from.fixedWidth;
    84.         to.fixedHeight = from.fixedHeight;
    85.         to.fontSize = from.fontSize;
    86.         to.fontStyle = from.fontStyle;
    87.         to.stretchWidth = from.stretchWidth;
    88.         to.stretchHeight = from.stretchHeight;
    89.     }
    90. }
    You end up with a skin that looks like the built-in editor skin that you can now extend with custom styles... which is what I was looking for.

    Would still like to download/save editor skin textures to use them as a starting point for custom styles... :)

    Alex
     
  15. Alex-Chouls

    Alex-Chouls

    Joined:
    Mar 24, 2009
    Posts:
    2,652
    Okay, found EditorUtility.CopySerialized which seems to do the trick:

    Code (csharp):
    1. using UnityEngine;
    2. using UnityEditor;
    3. using System.Collections;
    4.  
    5. public class CopyEditorSkin : EditorWindow
    6. {
    7.     public GUISkin mySkin;
    8.     public EditorSkin editorSkin = EditorSkin.Inspector;
    9.  
    10.     [MenuItem("Window/CopyEditorSkin")]
    11.     public static void Init()
    12.     {
    13.         CopyEditorSkin window = (CopyEditorSkin)EditorWindow.GetWindow(typeof(CopyEditorSkin));
    14.         window.Show();
    15.     }
    16.  
    17.     public void OnGUI()
    18.     {
    19.         mySkin = EditorGUILayout.ObjectField("My Skin", mySkin, typeof(GUISkin)) as GUISkin;
    20.         editorSkin = (EditorSkin)EditorGUILayout.EnumPopup("Editor Skin", editorSkin);
    21.  
    22.         if (mySkin == null)
    23.             GUI.enabled = false;
    24.  
    25.         if (GUILayout.Button("Copy Editor Skin"))
    26.         {
    27.             GUISkin builtinSkin = EditorGUIUtility.GetBuiltinSkin(editorSkin);
    28.             EditorUtility.CopySerialized(builtinSkin, mySkin);
    29.         }
    30.  
    31.         GUILayout.Label("NOTE: This will delete all Custom Styles!");
    32.     }
    33. }
    Much simpler, but it does delete all custom styles in the destination skin. I realized the previous script probably needs to do a deeper copy, but this script works fine for now...

    Cheers,
    Alex
     
  16. Alex-Chouls

    Alex-Chouls

    Joined:
    Mar 24, 2009
    Posts:
    2,652
    It's also cool to use this script to poke through the 287 custom styles in the built-in editor skin! It helps to see how the Unity GUI was built with GUISkin... and it's easier to copy bits here and there instead of making editor styles from scratch. For example, to make a ToolbarSearchField that looks the same as Unity's...

    Alex
     
  17. GoldenId

    GoldenId

    Joined:
    Sep 13, 2010
    Posts:
    11
    'xcuse me if I haven't read smth corresponding but can you explain me... I attach the result of working of the script attached in the first post. No text. Various dimensions. Is this intended?
    Further problems appears when I try to add some custom styles. With the same options of GUIStyle the styles behave unpredictable... :?:
     

    Attached Files:

  18. Alex-Chouls

    Alex-Chouls

    Joined:
    Mar 24, 2009
    Posts:
    2,652
    Try the last posted script. The first one just illustrated the general idea...

    Cheers,
    Alex
     
  19. Eversor

    Eversor

    Joined:
    May 20, 2010
    Posts:
    10
    May i know how to use this script?
     
  20. DarkMath

    DarkMath

    Joined:
    Dec 9, 2009
    Posts:
    25
    public static void Init()
    {
    CopyEditorSkin window = (CopyEditorSkin)EditorWindow.GetWindow(typeof(CopyEditorSkin));
    window.Show();
    }

    I copied this file into my project because I need to get the default skin texture but Unity chokes on the

    "(CopyEditorSkin)EditorWindow.GetWindow(typeof(CopyEditorSkin));"

    What do I have to do to get this to run in Unity 3?
     
  21. saddal

    saddal

    Joined:
    Apr 13, 2011
    Posts:
    8
    lols! No As the name suggests, they are built-In, anyways why you asking, did you did something nasty to the originals??
     
  22. Michael-Ryan

    Michael-Ryan

    Joined:
    Apr 10, 2009
    Posts:
    184
    I am interested in accessing the source images for Unity's Basic and Pro editor skin. The built-in skin textures were not set to "readable" when imported, so I believe I am unable to access the raw bytes of the textures.

    Has anything ever been released for the Editor skin? Something like the runtime skin at: http://unity3d.com/support/resources/assets/built-in-gui-skin?

    Is there a scriptable way to do this? For example, is there ANY way to save GUI.skin.window.normal.background to a PNG?

    Do the raw asset exist in the packaged contents of Unity.app, and are they accessible?
     
  23. arkatufus

    arkatufus

    Joined:
    Aug 21, 2011
    Posts:
    1
    Code (csharp):
    1.  
    2. [MenuItem("Assets/Get Inspector GUI")]
    3. public static void getGUI()
    4. {
    5.     GUISkin gui = Object.Instantiate(EditorGUIUtility.GetBuiltinSkin(EditorSkin.Inspector)) as GUISkin;
    6.     AssetDatabase.CreateAsset(gui, "Assets/InspectorGUI.guiskin");
    7. }
    8.  
    And no, you can't dump the textures because they're marked as non readable.
     
    Last edited: Aug 21, 2011
  24. gekido

    gekido

    Joined:
    May 11, 2011
    Posts:
    13
    For those that are asking how to get this to work - simply make sure that the script file that you create has the same name as the class.

    Step-by-Step:

    1) Create a folder in your project called 'Editor' (if you don't have one already)
    2) right-click on folder, Create->C# Script
    3) press F2 to rename the script - call it 'CopyEditorSkin' (CopyEditorSkin.cs)
    4) create a new GUISkin if you don't have one in your project - right click in project, Create->GUISkin - this will be where you copy the skin TO
    5) Click on Window->CopyEditorSkin - it will open a window
    6) drag the newly created GUISkin from step 4 into the GUISkin field of the window that was opened
    7) pick which skin you want to copy (Game / Inspector / Scene)
    8) click 'Copy Editor Skin'

    Voila - you now have a new editable GUISkin based on the originals.

    Definitely speeds up the process of building a new skin - thanx!
     
    flashframe likes this.
  25. mamoniem

    mamoniem

    Joined:
    Jul 23, 2012
    Posts:
    174
    +1
     
  26. dorafa

    dorafa

    Joined:
    Mar 25, 2013
    Posts:
    2
    Buen día, estoy iniciando en unity y quiero que me recomienden un tutorial paso a paso para usar el GUISkin en mi proyecto, he encontrado mucha información en internet pero no he logrado hacerlo funcionar, agradezco su ayuda, ya que toda esta información es muy avanzada para mis conocimientos y requiero una asesoria paso a paso. gracias.
     
  27. dorafa

    dorafa

    Joined:
    Mar 25, 2013
    Posts:
    2
    Buen dia, ESTOY Iniciando en la unidad y estoy buscando un tutorial paso a paso para USAR EL GUISkin en mi Proyecto, se encontrado mucha Información en Internet Pero no le Logrado Hacerlo funcionar, he seguido tus instrucciones en este post, pero solo he podido llegar al paso 4 y no encuentro la opcion que mencionas en el paso 5, ya que en mi menu principal ventana no existe la opción copyEditorSkin. Agradeceria mucho tu ayuda y respuesta, además si puedes continuar tu tutorial hasta verlo terminado, ya que no se como hacerlo funcionar. gracias.
     
  28. scone

    scone

    Joined:
    May 21, 2008
    Posts:
    244
    Here's a version that doesn't delete custom styles. It uses reflection to grab all the style properties:

    Code (csharp):
    1. using UnityEngine;
    2. using UnityEditor;
    3. using System.Collections;
    4. using System.Reflection;
    5.  
    6. public class CopyEditorSkin : EditorWindow {
    7.     public GUISkin skin;
    8.  
    9.     [MenuItem("Window/CopyEditorSkin")]
    10.     public static void Init() {
    11.         CopyEditorSkin window = (CopyEditorSkin)EditorWindow.GetWindow(typeof(CopyEditorSkin));
    12.     }
    13.  
    14.     public void OnGUI() {
    15.         skin = EditorGUILayout.ObjectField(skin, typeof(GUISkin)) as GUISkin;
    16.         if(skin == null)
    17.             GUI.enabled = false;
    18.  
    19.         if(GUILayout.Button("Copy Editor Skin")) {
    20.             GUISkin builtinSkin = EditorGUIUtility.GetBuiltinSkin(EditorSkin.Inspector);
    21.             PropertyInfo[] properties = typeof(GUISkin).GetProperties();
    22.             foreach(PropertyInfo property in properties) {
    23.                 if(property.PropertyType == typeof(GUIStyle)) {
    24.                     property.SetValue(skin, property.GetValue(builtinSkin, null), null);
    25.                 }
    26.             }
    27.         }
    28.     }
    29. }
     
  29. scone

    scone

    Joined:
    May 21, 2008
    Posts:
    244
    Hi there. The above script is working well for me, but for some reason I can't get my skin to save. Specifically the skin that I made by copying the dark (Pro) skin will seem to change in the inspector, but Save Scene, Save Project, and closing Unity don't actually change the underlying file. Any ideas?

    Edit: Oh, if I just modify it by hand, it'll save. Any way I can trigger this "dirtying" of the skin in scripts?
    One more edit: Huh... now that I re-load the saved dark scene, all of the images (toggle, button, etc) are missing. Is the pro skin protected somehow?
     
    Last edited: Jun 10, 2013
  30. scone

    scone

    Joined:
    May 21, 2008
    Posts:
    244
    This also seems to be the case when changing Unity versions. This is a bit more understandable, but still annoying, as I'm trying to update an AssetStore editor extension to support both Unity 3 and 4. I've included the Copy from editor script as well as a configuration screen to set it up automagically, but I'd like for it to "just work" when people import it.
     
  31. ubiquity

    ubiquity

    Joined:
    Jul 13, 2013
    Posts:
    1
    Hi scone,
    What did you change in the script to be able to save the skins?
     
  32. scone

    scone

    Joined:
    May 21, 2008
    Posts:
    244
    Sry for late reply. Most of the other scripts just copied the editor skin object wholesale. What mine does is to copy the values, property-by-property. You can also filter the copy process to only copy certain properties, or ignore (not overwrite) other properties. Very useful, indeed!