Search Unity

  1. Unity support for visionOS is now available. Learn more in our blog post.
    Dismiss Notice

[Questions/Thoughts] Unity 4.6, the new UI system

Discussion in 'UGUI & TextMesh Pro' started by Maisey, Aug 20, 2014.

  1. Foxxis

    Foxxis

    Joined:
    Jun 27, 2006
    Posts:
    1,108
    Using custom shaders for the UI does not seem to have an effect on draw order.. Why?
    (Ie. setting render queue to overlay, etc.).
    Would someone at Unity care to explain how rendering is set up and what the role of custom materials / shaders are?
     
  2. Fevenius

    Fevenius

    Joined:
    Feb 8, 2014
    Posts:
    12
    So, I want my interface to behave itself like the following:
    The Pivot should have an offset of ~ 25% to the left border and the same percentage to the horizontal middle, so it should
    take 50% of the screen's width. I also want the pivot to have an offset of 12.5% to the bottom, and the same percentage relative to the vertical middle, so it should be placed at the height of 12.5% (relative to the bottom) and take 25% of the screens height. How can I implement that? I mean, the new GUI works with fix values relative to the anchors....
     
  3. Tim-C

    Tim-C

    Unity Technologies

    Joined:
    Feb 6, 2010
    Posts:
    2,217
    Please watch the tutorial videos, they cover how rending works. Basically we render everything in hierarchy order.
     
  4. Foxxis

    Foxxis

    Joined:
    Jun 27, 2006
    Posts:
    1,108
    I would appreciate if someone would read my questions and provide a proper answer. I understand the UI rendering process and how it deals with order in relation to OTHER GUI objects!

    My question is regarding draw order in relation to NORMAL objects. For use with Oculus Rift and stereo rendering, I want to achieve a world space canvas rendered over all other normal geometry. We do not want to use a screen space or overlay canvas render mode. Nor do we want additional cameras to render the UI. That would leave us with at least 4 cameras which does not feel optimal.

    With NGUI this was achieved simply by modifying the shader used for the GUI to be in the overlay render queue. I have attempted the same thing with uGUI without success (the render queue for a custom material seems to be ignored).

    Either it is possible to force the new UI to always render on top, or it is not possible without additional cameras. Tim & co - with all due respect you should be able to answer this question in two sentences. I am a seasoned developer with 8 years experience with Unity - please give me the benefit of a doubt and answer these relatively simple questions. Thank you.
     
  5. Foxxis

    Foxxis

    Joined:
    Jun 27, 2006
    Posts:
    1,108
    Some more perusal of the shader solved it. The problem was the ztest mode. Render queue overlay + ztest always does work with the new GUI using a custom material/shader for an element.
    And no, Tim, stuff like this is not covered in the tutorial videos as far as I have seen.
     
  6. yoonitee

    yoonitee

    Joined:
    Jun 27, 2013
    Posts:
    2,363
    It's OK, but can't you make the GUI out-of-the-box a bit prettier? I mean the buttons are kind of flat and low resolution. And the "Reference Resolution" component should be added by default.

    Can't you make it more prettier like the Android GUI:


    or the IOS GUI:

    or even Windows GUI.

    Yes, a lot of people will probably end up skinning these elements. But why not have them pretty to start with for those people making a simple app that just want a nice looking GUI out of the box?

    No offence to your designer (if you have one) but it kind of looks like programmer art at the moment.

    Also, a drop-down-box, a drop-down menu, a menu-bar, a list-box, an message box and a dialog box would also be nice additions.

    Let's face it you've been making this GUI for two years and this is what you've come up with:
    unity-button.png
    This emoticon is higher quality: :p
     
    Last edited: Aug 24, 2014
    ina, p87 and Maisey like this.
  7. Foxxis

    Foxxis

    Joined:
    Jun 27, 2006
    Posts:
    1,108
    Of course you should design your own UI. I sincerely hope Unity does not waste resources on skins.
    If anything, those can be provided on the store by third parties.

    Next thing people will be asking for a big red button, with the label "Create Awesome Game" to appear as soon as Unity is opened.... :D
     
  8. yoonitee

    yoonitee

    Joined:
    Jun 27, 2013
    Posts:
    2,363
    Of course not. Photoshop used to use all the Windows GUI components like scrollbars, buttons and so on. If you are making a non-game app there is no reason to skin the GUI. In fact it is better if the GUI is familiar to the user from the offset not a brand new thing they have to learn. The browser you are reading this in now has standard GUI scrollbars and edit boxes and drop down menus.

    If you are making a multi-platform app, you can't use the Android GUI or the IOS GUI, so it would be nice to use a nice "Unity GUI".

    Also, there is conserving resources, and there is not finding the time in two years to make a reasonable button texture other than some terrible 16x16 image I could have made in 10 minutes. I mean presentation does count for some things. It makes me wonder if Unity even has an art department.

    Another reason is rapid prototyping that you might want to mock up quickly and show a client.
     
    Last edited: Aug 24, 2014
  9. AntFitch

    AntFitch

    Joined:
    Jan 31, 2012
    Posts:
    243
    +1 for this! Would actually LOVE this for custom editors and inspector.
     
  10. orb

    orb

    Joined:
    Nov 24, 2010
    Posts:
    3,037
    The default GUI graphics are fine for testing. But once they start on a proper theming solution, I'm sure they'll have an example theme too. For the record, the GUI skins in the asset store all work fine with the new GUI. Some might require a bit of cropping (9-slice images with spaces between each, for example), but there is plenty of prototype art available. UT will probably be focusing on getting the code working well first, then worry about art.
     
    yoonitee likes this.
  11. superpig

    superpig

    Drink more water! Unity Technologies

    Joined:
    Jan 16, 2011
    Posts:
    4,642
    I think shipping a nicer set of default GUI resources out of the box would be a fine thing to do, but I don't think it's something they should focus on right now. First make it all work, then make it pretty...
     
  12. Tim-C

    Tim-C

    Unity Technologies

    Joined:
    Feb 6, 2010
    Posts:
    2,217
    Sorry, I misunderstood exactly what you were asking (and only just now saw your other thread with more details)
     
  13. yoonitee

    yoonitee

    Joined:
    Jun 27, 2013
    Posts:
    2,363
    One last thing.

    One thing I didn't like about the old GUI was that the default buttons were transparent for no particular reason. (Other than to demonstrate that buttons can be transparent).

    Transparent buttons are not very good because it doesn't show the text clearly on the buttons.

    The new default GUI skin at the moment still has transparency for no particular reason. There is no need for transparency in any of the default GUI. It doesn't look very good either.

    You will note that two of the most liked GUI skins (the Android and IOS and also Windows and Mac) don't use transparent elements in their GUI for a good reason! Because it is a bad design choice.

    Do you employ any artists/designers at Unity? I know someone must have designed the logos. Can't they also design some nice Web 2.0 style buttons? Maybe you could ask the people who've designed your new website front end? Actually maybe not, the buttons look kind of flat there too. Here's a tutorial they could watch about how to create nice buttons:



    Here's some more examples of nice buttons:


    Don't they just make you want to press them?
     
    Last edited: Aug 25, 2014
  14. Foxxis

    Foxxis

    Joined:
    Jun 27, 2006
    Posts:
    1,108
    No worries. My apologies for the rant - got a bit frustrated. On track now and happy, great job with the new UI system! Thanks!
     
  15. Foxxis

    Foxxis

    Joined:
    Jun 27, 2006
    Posts:
    1,108
    Seriously. Unity should keep their focus: develop a top class game engine.
    It is *your* job to create content. Or hire someone who can. Or buy it from someone on the Asset Store.
    Resources devoted to content development at Unity are resources that could be spent better; on a new terrain system, better wheel colliders, more mecanim funcionality, quicker support for Metal, etc. etc. etc.
    Now, go create a game! ;)
     
  16. Maisey

    Maisey

    Joined:
    Feb 17, 2014
    Posts:
    302
    Got some issues editing the scripts (pretty much just opened Unity 4.6 for 5min at home and tried to edit a script, so I might have missed something obvious).

    The files can't be found, marked red in monodevelop. See attached print.
     

    Attached Files:

  17. Tiles

    Tiles

    Joined:
    Feb 5, 2010
    Posts:
    2,481
    Out of the Box look is important. Make it look like crap and people will bitch about it. No matter how good the code base is. The first look is what catches the people, or scare them away.

    Unity had exactly this problem with its out of the box shaders in the past. And people bitched Unity for being crappy looking. This is fixed in Version 5. Now we will have a much better out of the box look in Unity.

    And same goes for the menu stuff. You better provide some fancy standard buttons.
     
    yoonitee and Maisey like this.
  18. GiantGrey

    GiantGrey

    Joined:
    Jul 2, 2012
    Posts:
    266
    a nice default UI skin would complete the great new GUI system! But please no glossy, shiny, artsy-fartsy default Bevel/Emboss Photoshop UI buttons!
     
  19. Triggles

    Triggles

    Joined:
    Aug 23, 2014
    Posts:
    30
    Personally I like it when the default buttons look a bit rubbish. It reminds me that they're placeholder and I need to replace them.
     
  20. yoonitee

    yoonitee

    Joined:
    Jun 27, 2013
    Posts:
    2,363
    :( But I like shiny buttons.
     
  21. GiantGrey

    GiantGrey

    Joined:
    Jul 2, 2012
    Posts:
    266
    ooh i'm sorry! Here is one :)

    i'm sure it's hard for unity to satisfy everyone, that's why it took so long for the new ui system. And they made a great job. Most important thing is to continuously develop this further! Can't wait to see all the nice AssetStore products for the new ui.
     
    yoonitee likes this.
  22. p87

    p87

    Joined:
    Jun 6, 2013
    Posts:
    318
    I'm just here to second this, extremely disappointed there is no data binding and it was dismissed in a single sentence with no explanation or anything...

    LOL.. the skin is pretty horrible. I agree unity shouldnt waste a ton of time on this, but wow the 9 slice sprites in the 4.6 dev preview look like they were thrown together in MS paint.
     
  23. Tim-C

    Tim-C

    Unity Technologies

    Joined:
    Feb 6, 2010
    Posts:
    2,217
    We haven't figured out exactly what we want to do with this yet. We know it's important, and we will be investigating. Right now our main goal is to make a really solid UI foundation that can be built upon as we move forward.
     
    p87 and Maisey like this.
  24. Maisey

    Maisey

    Joined:
    Feb 17, 2014
    Posts:
    302
    Alright, then we know something is in the pipeline at least :)

    Any ideas why I can't open and edit the new UI-scripts? See attached image.
     

    Attached Files:

  25. Tim-C

    Tim-C

    Unity Technologies

    Joined:
    Feb 6, 2010
    Posts:
    2,217
    it's trying to open them in the DLL (compiled), we haven't open sourced the UI just yet so this feature is not functioning.
     
  26. Maisey

    Maisey

    Joined:
    Feb 17, 2014
    Posts:
    302
    Alright. When can we expect to get access to them?

    Another questions from the original post: Is there no callback to hook into for when the Transform/Rect Transform changes in size? Just a simple callback for when width, height, position etc. changes would be VERY useful.

    Edit.
    Guessing I can use this to setup my own callback-script?

    Edit2.
    Yes I can :) #mademyday
    Still missing callback for when transform changes (position, scale, rotation), or can I just not find it? (the non-polling way)
     
    Last edited: Aug 26, 2014
  27. Tim-C

    Tim-C

    Unity Technologies

    Joined:
    Feb 6, 2010
    Posts:
    2,217
    We don't have a callback for the second one, it would be very 'over the top' in terms of performance.
     
  28. Maisey

    Maisey

    Joined:
    Feb 17, 2014
    Posts:
    302
    Alright. Yeah I don't know the overhead of your built in messages, but I'd guess it's cached compile-time? I mean if there are no scripts implementing said callback, 'OnTransformChanged' (or whatever it might'd been called), is there still runtime overhead?
     
  29. image28

    image28

    Joined:
    Jul 17, 2013
    Posts:
    457
    A few questions how would you use the eventTrigger system with NGUI for example, and also is there a way to run scripts on gameobjects that aren't in the scene ( say a player unit that is spawned after scene load... )
     
  30. Danirey

    Danirey

    Joined:
    Apr 3, 2013
    Posts:
    548
    Hi there!

    Can somebody be so kind to post a little reference code of how to handle a UI event like OnPointerEnter() in UnityScript?
    I have tried but i can't get it work! No errors.
    I attached to a panel a Script that have :

    import UnityEngine.EventSystems;

    and then a function

    OnPointerEnter(data: PointerEventData)

    with a debug log inside…

    Am i missing something?

    Thanks a lot! :)
     
  31. superpig

    superpig

    Drink more water! Unity Technologies

    Joined:
    Jan 16, 2011
    Posts:
    4,642
    You'll need to mark your script as extending the IPointerEnter interface somehow. I'm not sure what the best way to do that in UnityScript is.
     
  32. Karkazaz

    Karkazaz

    Joined:
    Mar 11, 2014
    Posts:
    32
    What should I do if I want to fade(hide) the whole canvas ui? There is no alpha/color property on the canvas from what I can see :/
     
  33. superpig

    superpig

    Drink more water! Unity Technologies

    Joined:
    Jan 16, 2011
    Posts:
    4,642
    Add a CanvasGroup component to the Canvas.
     
    runevision likes this.
  34. Danirey

    Danirey

    Joined:
    Apr 3, 2013
    Posts:
    548
    You can do that with the unity animations! There are some tutorials doing that!

    The one in the blog explains that very good!

    EDIT: sorry, i wasn't talking about the canvas. Good question!
     
    Last edited: Aug 28, 2014
  35. orb

    orb

    Joined:
    Nov 24, 2010
    Posts:
    3,037
    Yes.

    No.

    Here's a stripped down part of some code I started on yesterday, without the full context, and it's all C#:
    Code (CSharp):
    1. using UnityEngine;
    2. using UnityEngine.Events;
    3. using UnityEngine.EventSystems;
    4.  
    5. public class HoverInfo : MonoBehaviour, IPointerEnterHandler, IPointerExitHandler
    6. {
    7.     void IPointerEnterHandler.OnPointerEnter(PointerEventData data)
    8.     {
    9.         Debug.Log("Hover started.");
    10.     }
    11.  
    12.  
    13.     void IPointerExitHandler.OnPointerExit(PointerEventData data)
    14.     {
    15.         Debug.Log("Hover ended.");
    16.     }
    17. }
    18.  
    I haven't the faintest how to translate to UnityScript, since I purged that section of my brain ;)
     
  36. Danirey

    Danirey

    Joined:
    Apr 3, 2013
    Posts:
    548
    OK :D

    Thanks anyway.
     
  37. techmage

    techmage

    Joined:
    Oct 31, 2009
    Posts:
    2,133
    So I was going to download the 4.6 beta and dig through it all. But really there is only one thing I really want to know, and I'm hoping someone can just tell me.

    The event system, can it be used for non-gui objects? Like for example, can I put a meshCollider on a gameObject, then add an eventTrigger component and have it so that the events are trigger by clicking on the meshCollider?
     
  38. superpig

    superpig

    Drink more water! Unity Technologies

    Joined:
    Jan 16, 2011
    Posts:
    4,642
    You'd need to use a custom raycaster - by default raycasting is done against Graphic objects (which are 2D UI things) but you could switch it for one that raycasts against Colliders instead, I think.
     
  39. runevision

    runevision

    Joined:
    Nov 28, 2007
    Posts:
    1,888
    You can use a Physics Raycaster, which comes included with the Event System. You need to add it to the Camera that corresponds to the angle you want the clicking to come from (usually the Main Camera).
     
  40. ABC295

    ABC295

    Joined:
    Mar 5, 2013
    Posts:
    8
    Hello All,

    Just a quick question. Is there anyway of resizing RectTransforms in real time (such as NGUI's UIDragResize script where you can click and hold a button to resize the Widget) that are on a World Space canvas? Been scratching my head over this for a couple hours now. I know that the item that most likely needs to be altered is the sizeDelta... but not sure what functions to use within the system

    Update:
    I have been able to do it now. Seems a little "hacky" though. Using output of RectTransformUtility.ScreenPointToLocalPointInRectangle to alter the sizeDelta like so...

    Code (csharp):
    1.  
    2. var rt = m_WidgetRect.GetComponent<RectTransform>();
    3. Vector2 newPos;
    4. if (RectTransformUtility.ScreenPointToLocalPointInRectangle(m_CanvasRect, eventData.position, eventData.pressEventCamera, out newPos))
    5. {
    6.     rt.sizeDelta = new Vector2(newPos.x - rt.localPosition.x, rt.localPosition.y - newPos.y);
    7. }
    8.  
     
    Last edited: Aug 29, 2014
  41. Maisey

    Maisey

    Joined:
    Feb 17, 2014
    Posts:
    302
    Looking at the documentation for RectTransform, there are properties for Left, Top, Right, Bottom (with pivot taken into consideration). However, none are exposed in code... Did you forget to make them public?..

    Edit.
    My bad, was looking at the "Manual". :)
     
  42. Danirey

    Danirey

    Joined:
    Apr 3, 2013
    Posts:
    548
    Hi guys!

    The new ui is awesome. I've been playing a bit and has a lot of possibilities. Good job.

    I know you can use the events with other objects too, as runevision explained before. But if i have a ui button over a 3d box object that can be clicked too, how can i make only the button the react to the click? Do we have to use rect contains like before?

    Cheers!
     
  43. Maisey

    Maisey

    Joined:
    Feb 17, 2014
    Posts:
    302
    Okey seriously, how do you change the size of RectTransform? The RectTransform.rect-property can be read but not assigned... And no properties to set width & hight directly either... Are you kidding me? So it's exposed in the inspector but not in code?
     
    Last edited: Sep 1, 2014
  44. bali33

    bali33

    Joined:
    Aug 14, 2011
    Posts:
    232
    So fat the new UI is fine - The one thing I'm having trouble with is dynamic content when using a scrollable panel. I know that for performances reasons the content size is not updated when child gameObject are added, but I really would like a manual method that allows developers to update/recalculate the content size - This way the responsibility would be developer side, it would be feature that we can use or not.
     
  45. runevision

    runevision

    Joined:
    Nov 28, 2007
    Posts:
    1,888
    Please read the page in the manual (bundled with beta 18) called "Creating UI elements from scripting".
     
  46. Maisey

    Maisey

    Joined:
    Feb 17, 2014
    Posts:
    302
    I'll download and check (takin some time), but are you insinuating RectTransform will not expose a setter for the rect, and (ideally) also properties for width/height directly? I mean even a center-property seems mandatory (that automatically calculate localPosition with pivot)... I've implemented the latter myself but not seeing it built in is just odd.
     
  47. runevision

    runevision

    Joined:
    Nov 28, 2007
    Posts:
    1,888
    There will be no setter for the rect property, since it would be unclear what it means to set it for a rect that's set to stretch together with its parent.

    For a rect that doesn't stretch with its parent you can set the width and height using the sizeDelta property. If it does stretch with its parent, sizeDelta means the extra size in addition to the distance between the anchors. You can also use offsetMin and offsetMax if that's more convenient. You can read more about all those properties in the scripting reference for RectTransform.
     
  48. Maisey

    Maisey

    Joined:
    Feb 17, 2014
    Posts:
    302
    Wow, this is just mind-blowing...
    Here is the deal: I don't want to use anchors, period. I'm making my own constraint-system, which (after trying your concept) I know will suit me (and maybe others) better. Already did it for NGUI once with great results, and been working with it for iOS for some extended periods.

    I want to be able to set width/height manually, with an exact value. The fact that you presume clients will rely solely on anchors is just... restricting to say the least. Ideally you should have an enable/disable-toggle for anchors (which should be practically the same as have them set to max/min 0.5/0.5).

    Whatever you might think is what we want/need, PLEASE expose the properties. AT LEAST width & height. Seriously, It's not much asked having payed some $4k. Especially when you are aiming for open source and more user-provided content...

    Edit.
    I do realise that sizeDelta can be used with the anchors forced to 0.5, but no, it should be more explicit. Sure, anchors can be encouraged, but NOT enforced in this way.
     
    Last edited: Sep 2, 2014
  49. bali33

    bali33

    Joined:
    Aug 14, 2011
    Posts:
    232
    I think it's best to expose properties and functions that could help developers to control and construct UI - There would be no obligations to use them and simply stick with the editor to set the behavior but having the choice would be great.
     
    Maisey likes this.
  50. ortin

    ortin

    Joined:
    Jan 13, 2013
    Posts:
    221
    Here is the deal: you get UI sources when they're released and add whatever properties/toggles you like.
    Your claim that your constraint-system is superior and will suit others better than current one is ridiculous to say at least.