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

Unity UI Extensions collection V1.0.0.1 released

Discussion in 'UGUI & TextMesh Pro' started by SimonDarksideJ, Feb 4, 2015.

  1. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    Just release V1.0.0.1 of the Unity UI Extensions collection, with many of the scripts from the "Useful Scripts collection" post and lots of others.

    All tidied, cleaned and unified in to one huge collection of controls / effect and components.
    Plus Editor menu's where applicable.
    https://bitbucket.org/ddreaper/unity-ui-extensions

    Additionally, there is also a .UnityPackage to download and install them all (with EditorMenu Options)
    https://bitbucket.org/ddreaper/unity-ui-extensions/downloads/UnityUIExtensions.unitypackage

    Got more scripts or updates? Then post them to the repo :D

    *Note, it's late here now, will update the front page of the repository with the latest editions and notes in the morning. Also some of the controls do need documentation (such as the Selection Box)
     
    Cromfeli, Limnage, elmar1028 and 10 others like this.
  2. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    Just release V1.0.0.2 of the UI Extensions project, new controls added:
    * ComboBox
    * AutoCompleteBox
    * DropDownList
    * FlowLayoutGroup
    * Bound Tooltip control

    Check the UI bitbucket repository and updated .UnityPackage for more details
     
    samuelk likes this.
  3. blizzy

    blizzy

    Joined:
    Apr 27, 2014
    Posts:
    775
    JohnTube likes this.
  4. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    Sure, I can try and sort that out in the next update :D
     
  5. blizzy

    blizzy

    Joined:
    Apr 27, 2014
    Posts:
    775
    Sweet, thanks! :)
     
  6. topaz7

    topaz7

    Joined:
    Dec 15, 2012
    Posts:
    76
    Hey, can you try adding tab control? I can't seem to get my hand on how can I make a tab control on edit time.
     
  7. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    Sure, just create a new issue marked as an "Enhancement" and either I or one of the community will pick it up :D
    Be sure to include as much info as you can to describe the control, with pictures if need be :D
     
  8. topaz7

    topaz7

    Joined:
    Dec 15, 2012
    Posts:
    76
    Done! If you need anymore details, let me know.
     
  9. EmeralLotus

    EmeralLotus

    Joined:
    Aug 10, 2012
    Posts:
    1,459
    I'm just starting on UGUI and wondering if anyone has information to setup monodevelop to use the Source of the UGUI? I saw unity's info on github.. https://bitbucket.org/Unity-Technologies/ui , but it seems that a dll needs to be built. Is there a way to use the source in the project directly without building a dll first?
     
  10. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    The only way to use the DLL's is to replace those in your Unity install directory at present.

    I've seen comments of people trying to add the DLL's to their asset folders, however I've not seen if this was successful or not.
     
  11. SidarVasco

    SidarVasco

    Joined:
    Feb 9, 2015
    Posts:
    163
    Hey,

    Could you elaborate on how HorizontalScrollSnap works? I've tried several settings but nothing seems to work.

    My " pages" are not aligned correctly. The content starts near the right screen. As a result my first page is always empty.

    Any pointers?
     
  12. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    It should just work, I did see you recent issue on this. Let me have a quick look in to it.
     
  13. SidarVasco

    SidarVasco

    Joined:
    Feb 9, 2015
    Posts:
    163
    Any update?

    This my setup btw

    The pages do not contain the same content width. I think I'm missing a step.
     
  14. SidarVasco

    SidarVasco

    Joined:
    Feb 9, 2015
    Posts:
    163
    Any update?
     
  15. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    Sorry @SidarVasco got pulled in to work madness :S

    @BinaryX do you have any suggestions since you created the initial control?
     
  16. SidarVasco

    SidarVasco

    Joined:
    Feb 9, 2015
    Posts:
    163
    I tried adding a horizontal layout to content and set a specific spacing, but that only works for a specific screen size.
     
  17. GregMeach

    GregMeach

    Joined:
    Dec 5, 2012
    Posts:
    249
    @SimonDarksideJ - thanks for the work done on this project - awesome!
    Edit: and of course to those that contributed :)

    I was hoping that the HSVPicker would be fixed in the 5.2 update. I had to do the following (in the PickerTest scene) to get it to work properly:
    1: Replace the EventSystem (had missing component).
    2: Replace the HexRGB script on the InputField component and populate its public fields (had missing component).
    -> this made almost everything work except for the hex text was not updating. I was able to fix that too by:
    3: Editing HexRGB.cs and switch the public
    Code (CSharp):
    1. Text textColor;
    to
    Code (CSharp):
    1. InputField hexInput;
    Then redo the references to be:
    Code (CSharp):
    1. hexInput.text;
     
  18. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    Create an issue log with the fix on the bitbucket site and I'll get it included with the next update.
    Alternatively, create a fork of the repo, apply the fix and then submit a PR.
     
    GregMeach likes this.
  19. GregMeach

    GregMeach

    Joined:
    Dec 5, 2012
    Posts:
    249
    I submitted the issue and included my patched HexRGB.cs.txt file - let me know if I can help in any other way
     
  20. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    Saw it @GregMeach, thanks. Will get that merged as soon as the time beast lets me have a few mins :D
     
  21. topaz7

    topaz7

    Joined:
    Dec 15, 2012
    Posts:
    76
    This has gone a long way since the last time I checked.
     
  22. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    And the bus isn't stopping yet. The community is an awesome place and more and more controls / scripts and effects keep coming.
    I keep updating with more info / fixes and tutorials as we go (although the pace I can update is sometimes a struggle with life getting in the way, it's certainly not a dedicated project)
     
  23. Freezy

    Freezy

    Joined:
    Jul 15, 2012
    Posts:
    234
  24. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    WhooHoo
    You can add these yourself as well you know, just submit a PR :D
    If you're not sure how to do it, I'll knock up a doc. (I did one for GIT, but Mercurial is a little different)
    Will add this as part of the next update
     
  25. malliapi

    malliapi

    Joined:
    Aug 24, 2015
    Posts:
    5
    @SimonDarksideJ last time i tried your package it doesn't allow for iOS builds out of the box. Maybe it was just me though.
     
  26. Freezy

    Freezy

    Joined:
    Jul 15, 2012
    Posts:
    234
    I know how, but I need to setup the bitbucket stuff again and that takes more time then I wanted to invest in a quick post ;-)
    I might get around to it later.

    Edit: Uploaded and PR sent, turns out it can all be done on the website, no need to download sourcetree.

    I also have an example of what it can do in the original post, please feel free to somehow include that in the community repo when screenshots / examples are added.
     
    Last edited: Oct 7, 2015
  27. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    Merge accepted. Will also port it back to the 4.x branch (and update it for 5.3) as well.

    @Freezy , do you have some usage examples for this as well?
     
  28. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    @malliapi Could you log an issue on the Bitbucket site with your observations.

    The UI system is OS independent, so it should not behave any differently on iOS to anything else
     
  29. Freezy

    Freezy

    Joined:
    Jul 15, 2012
    Posts:
    234
    I'll add the test scene used to make the screenshot. Is there a folder where I should store it?
     
  30. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    Just post it here, save cluttering the repo. It's just so I have something to use when recording the video.

    FYI, didn't port it back to 4.x in the end, just ran out of time. Considering I'm thinking of dropping the 4.x branch soon, better it's from 5.2+
    Just about to update it to 5.3 now.
     
  31. Freezy

    Freezy

    Joined:
    Jul 15, 2012
    Posts:
    234
    Here we go, it also includes the code from "Rumor Games", which is a very nice example of hiding conditional parameters, which still seems to be missing as a built in Attribute from the Untiy Editor api.
    http://rumorgames.com/hide-in-inspector/
     

    Attached Files:

  32. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    Right, I'll check that out, thanks!
     
  33. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    Released :D
    Will do videos later using your sample.
     
  34. Korindian

    Korindian

    Joined:
    Jun 25, 2013
    Posts:
    584
    Just wanted to say a big thank you to everyone who has contributed something to the extensions project, and to @SimonDarksideJ for putting it together. So many useful components and effects!
     
    SimonDarksideJ likes this.
  35. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    Thanks, everyone is awesome and the controls / components keep coming.
    Hopefully soon I'll also put it on the asset store for easier access :D
     
  36. Jiraiyah

    Jiraiyah

    Joined:
    Mar 4, 2013
    Posts:
    175
    Hi there Simon, I sent a comment to your last update video but i found the forum and thought it would be better place to put this as a request, you see, in photoshop, we have blend options for layers, it would be nice if we could have same functionality on image component of UGui, for example an image could use color blend to add color to another background image (Would be much useful for something like health spheres) or any other blend mode that you guys can manage. I am not sure how hard or easy it would be but something like that is really lacking from current GUI system :/
     
    eses likes this.
  37. thylaxene

    thylaxene

    Joined:
    Oct 10, 2005
    Posts:
    716
    You would use a custom sprite shader/material to achieve this. I already have one for multiplying so I suspect creating one for blending shouldn't be too hard.
     
  38. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    Hmm, I'd agree with @thylaxene you would be better placed to do that through the 2D sprite system rather than UI (granted UI is based on it).
    Given Charles's SoftAlphaMask, having a shader based blending effect should be very doable. I think I suggested on your comment to add a issue/proposal and see if the community can pick it up

    Oh and @thylaxene would you be willing to share your multiplying option with the project?
     
  39. thylaxene

    thylaxene

    Joined:
    Oct 10, 2005
    Posts:
    716
    Here it is. I have no idea where I found it. However if someone recognises their work please accept my apologies!
    Code (CSharp):
    1. Shader "UI/Blend Modes/Multiply"
    2. {
    3.     Properties
    4.     {
    5.         [PerRendererData] _MainTex ("Sprite Texture", 2D) = "white" {}
    6.         _Color ("Tint", Color) = (1,1,1,1)
    7.    
    8.         _StencilComp ("Stencil Comparison", Float) = 8
    9.         _Stencil ("Stencil ID", Float) = 0
    10.         _StencilOp ("Stencil Operation", Float) = 0
    11.         _StencilWriteMask ("Stencil Write Mask", Float) = 255
    12.         _StencilReadMask ("Stencil Read Mask", Float) = 255
    13.  
    14.         _ColorMask ("Color Mask", Float) = 15
    15.     }
    16.  
    17.     SubShader
    18.     {
    19.         Tags
    20.         {
    21.             "Queue"="Transparent"
    22.             "IgnoreProjector"="True"
    23.             "RenderType"="Transparent"
    24.             "PreviewType"="Plane"
    25.             "CanUseSpriteAtlas"="True"
    26.         }
    27.    
    28.         Stencil
    29.         {
    30.             Ref [_Stencil]
    31.             Comp [_StencilComp]
    32.             Pass [_StencilOp]
    33.             ReadMask [_StencilReadMask]
    34.             WriteMask [_StencilWriteMask]
    35.         }
    36.  
    37.         Cull Off
    38.         Lighting Off
    39.         ZWrite Off
    40.         ZTest [unity_GUIZTestMode]
    41.         Fog { Mode Off }
    42.         Blend Zero SrcColor
    43.         ColorMask [_ColorMask]
    44.  
    45.         Pass
    46.         {
    47.         CGPROGRAM
    48.             #pragma vertex vert
    49.             #pragma fragment frag
    50.             #include "UnityCG.cginc"
    51.        
    52.             struct appdata_t
    53.             {
    54.                 float4 vertex   : POSITION;
    55.                 float4 color    : COLOR;
    56.                 float2 texcoord : TEXCOORD0;
    57.             };
    58.  
    59.             struct v2f
    60.             {
    61.                 float4 vertex   : SV_POSITION;
    62.                 fixed4 color    : COLOR;
    63.                 half2 texcoord  : TEXCOORD0;
    64.             };
    65.        
    66.             fixed4 _Color;
    67.  
    68.             v2f vert(appdata_t IN)
    69.             {
    70.                 v2f OUT;
    71.                 OUT.vertex = mul(UNITY_MATRIX_MVP, IN.vertex);
    72.                 OUT.texcoord = IN.texcoord;
    73. #ifdef UNITY_HALF_TEXEL_OFFSET
    74.                 OUT.vertex.xy += (_ScreenParams.zw-1.0)*float2(-1,1);
    75. #endif
    76.                 OUT.color = IN.color * _Color;
    77.                 return OUT;
    78.             }
    79.  
    80.             sampler2D _MainTex;
    81.  
    82.             fixed4 frag(v2f IN) : SV_Target
    83.             {
    84.                 half4 prev = IN.color * tex2D(_MainTex, IN.texcoord);
    85.                 return lerp(half4(1,1,1,1), prev, prev.a);
    86.             }
    87.         ENDCG
    88.         }
    89.     }
    90. }
    To use. Create a shader. Then material using that shader. Then assign the material into the material slot of a UI/Image or similar. Bam. That Image will now multiply over any other UI element it is above.
     
    Last edited: Feb 27, 2016
  40. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    Great stuff @thylaxene , You ok with me adding this to the UI extensions project, slowly the UI shader section is growing now.
     
  41. thylaxene

    thylaxene

    Joined:
    Oct 10, 2005
    Posts:
    716
    As I said not sure whose shader it was originally, so leave it up to you.

    Here is the Screen version. Checked against PS and looks pretty much the same. That is the low hanging fruit picked and my Shader hacking ability reached. Will need smarter cookies to get involved to help us get the more complex PS blend modes.

    https://en.wikipedia.org/wiki/Blend_modes

    Code (CSharp):
    1. Shader "UI/Blend Modes/Screen"
    2. {
    3.     Properties
    4.     {
    5.         [PerRendererData] _MainTex ("Sprite Texture", 2D) = "white" {}
    6.         _Color ("Tint", Color) = (1,1,1,1)
    7.      
    8.         _StencilComp ("Stencil Comparison", Float) = 8
    9.         _Stencil ("Stencil ID", Float) = 0
    10.         _StencilOp ("Stencil Operation", Float) = 0
    11.         _StencilWriteMask ("Stencil Write Mask", Float) = 255
    12.         _StencilReadMask ("Stencil Read Mask", Float) = 255
    13.  
    14.         _ColorMask ("Color Mask", Float) = 15
    15.     }
    16.  
    17.     SubShader
    18.     {
    19.         Tags
    20.         {
    21.             "Queue"="Transparent"
    22.             "IgnoreProjector"="True"
    23.             "RenderType"="Transparent"
    24.             "PreviewType"="Plane"
    25.             "CanUseSpriteAtlas"="True"
    26.         }
    27.      
    28.         Stencil
    29.         {
    30.             Ref [_Stencil]
    31.             Comp [_StencilComp]
    32.             Pass [_StencilOp]
    33.             ReadMask [_StencilReadMask]
    34.             WriteMask [_StencilWriteMask]
    35.         }
    36.  
    37.         Cull Off
    38.         Lighting Off
    39.         ZWrite Off
    40.         ZTest [unity_GUIZTestMode]
    41.         Fog { Mode Off }
    42.         Blend One OneMinusSrcColor
    43.         ColorMask [_ColorMask]
    44.  
    45.         Pass
    46.         {
    47.         CGPROGRAM
    48.             #pragma vertex vert
    49.             #pragma fragment frag
    50.             #include "UnityCG.cginc"
    51.          
    52.             struct appdata_t
    53.             {
    54.                 float4 vertex   : POSITION;
    55.                 float4 color    : COLOR;
    56.                 float2 texcoord : TEXCOORD0;
    57.             };
    58.  
    59.             struct v2f
    60.             {
    61.                 float4 vertex   : SV_POSITION;
    62.                 fixed4 color    : COLOR;
    63.                 half2 texcoord  : TEXCOORD0;
    64.             };
    65.          
    66.             fixed4 _Color;
    67.  
    68.             v2f vert(appdata_t IN)
    69.             {
    70.                 v2f OUT;
    71.                 OUT.vertex = mul(UNITY_MATRIX_MVP, IN.vertex);
    72.                 OUT.texcoord = IN.texcoord;
    73. #ifdef UNITY_HALF_TEXEL_OFFSET
    74.                 OUT.vertex.xy += (_ScreenParams.zw-1.0)*float2(-1,1);
    75. #endif
    76.                 OUT.color = IN.color * _Color;
    77.                 return OUT;
    78.             }
    79.  
    80.             sampler2D _MainTex;
    81.  
    82.             fixed4 frag(v2f IN) : SV_Target
    83.             {
    84.                 half4 prev = IN.color * tex2D(_MainTex, IN.texcoord);
    85.                 return lerp(half4(1,1,1,1), prev, prev.a);
    86.             }
    87.         ENDCG
    88.         }
    89.     }
    90. }
    91.  
     
  42. thylaxene

    thylaxene

    Joined:
    Oct 10, 2005
    Posts:
    716
    Must say might be time to blow the dust of my Shader Forge licence and see if I can visually create these blend modes in that. If time permits....
     
    SimonDarksideJ likes this.
  43. Cromfeli

    Cromfeli

    Joined:
    Oct 30, 2014
    Posts:
    202
    Thanks for the effort Simon, you are the best!
     
  44. Jiraiyah

    Jiraiyah

    Joined:
    Mar 4, 2013
    Posts:
    175
    thylaxene, I originally thought about shaders when i first saw the new ui system, but when i watched the video to see the mask version was using a component, i thought maybe that should be the way, your help is much appreciated. although i am not familiar with shaders at all, i will sit and fiddle with the wiki page and the shader you posted to see if i can achieve anything myself. if i found anything useful, i will share with you guys.
    thanks again.
     
  45. Jiraiyah

    Jiraiyah

    Joined:
    Mar 4, 2013
    Posts:
    175
    Umm @thylaxene i found that the only difference between the color and multiply blends is this line :

    Color : Blend Zero SrcColor
    multiply : Blend One OneMinusSrcColor

    now referring to wiki, few of the other blends is a combination of these two blend modes with a simple checking condition, but the question is, how the hell should we blend these two if we can have only one blend option? should blend sit as Zero SrcColor and then the formula in vert section change? as much as i understand, the Overlay, Hard Light, Soft Light, Darken and Lighten should be fairly simple, most of them are really simple math except the soft light that is a bit more involved, although if you compare the graphs for it, i think the pegtop method is a better choice than photoshop and the math is again fairly simple. honestly, if i knew how to right a shader, i would had done it by now :/
     
  46. SimonDarksideJ

    SimonDarksideJ

    Joined:
    Jul 3, 2012
    Posts:
    1,688
    Need to find some time to pull together the next release, work has been grueling though.
    Will just have to pull my finger out and get what will likely be a 1.1 release as I have so much already rolled up and so many more queued up to include, it wil be a larger release and not just a couple of extra controls.
     
  47. MS80

    MS80

    Joined:
    Mar 7, 2014
    Posts:
    346
    Many thanks to @SimonDarksideJ and all contributors! This ui extension collection is great.

    I have a question regarding "Flow Layout Group" script. Is there a way to switch the succession from horizontal to vertical? The objects in flow layout are arranged from left to right, but I need a arrangement from top to down (similar to "Grid Layout Group" "Start Axis: vertical").