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

NGUI (Next-Gen UI) -- demo final feedback request

Discussion in 'Assets and Asset Store' started by ArenMook, Dec 8, 2011.

Thread Status:
Not open for further replies.
  1. SoulWind

    SoulWind

    Joined:
    Aug 25, 2011
    Posts:
    23
    hi ArenMook
    I am working on a scroll view, it's there something with mouse scroll wheel like UIDraw in NGUI?
    If not I'll going to write it...

    Edit: OK done, it's really easy:)
     
    Last edited: Dec 16, 2011
  2. andresp

    andresp

    Joined:
    Aug 12, 2011
    Posts:
    38
    I'm currently looking for a GUI editor plugin for Unity. Is there any trial version available so I can test this before buying it (like ex2D does)?
     
  3. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    :)

    I didn't add OnScroll to UICamera mainly because I figured people might need different behaviour from it -- some will want to scroll what the mouse hovers over, others might want to scroll what's currently selected, and doing something like setting a flag to 'true' in OnSelected then handling scrolling in update is simple.
    Sorry, there is no trial version. NGUI comes as a complete package -- tutorials, examples and all. Earlier on I was considering having two versions -- this one and a $35 'lite' one that would be just the UI kit without the examples/tutorials folder, but I think it might simply make it more difficult for people to get into.
     
  4. Jaimi

    Jaimi

    Joined:
    Jan 10, 2009
    Posts:
    6,204
    Is there a "list" style control coming sometime in the future for NGUI?
     
  5. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    If you give me an example of what you will be using it for and how you imagine it will function, I can probably create an example that implements it.
     
  6. SteveJ

    SteveJ

    Joined:
    Mar 26, 2010
    Posts:
    3,085
    Another question. Does NGUI suffer from the issue of UI touches passing through into the game world? Or is there a easy solution to get around it? E.g. I've been using UIToolkit recently. If you have a UIButton on screen and a GO behind that in "3D space" then your touch on the button also passes to the GO behind it triggering an event in the game (if the object has behavior of this sort attached to it). Hope that makes sense.
     
  7. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    If you use the same event system NGUI uses then nope, it does not suffer from this issue. Furthermore, if you use multiple cameras they are all handled correctly as well -- the event starts at the last camera to render, checks all the widgets drawn by it, then moves to the next camera if the event has not been handled.

    So if you have a UI camera and a game camera, and a big UI button with a game object behind it, when you tap on the button it will get the OnClick but the game object behind it won't.
     
  8. SteveJ

    SteveJ

    Joined:
    Mar 26, 2010
    Posts:
    3,085
    Love it. Will grab NGUI this afternoon. Thanks for all the answers!
     
  9. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    Anytime :)
     
  10. Jaimi

    Jaimi

    Joined:
    Jan 10, 2009
    Posts:
    6,204
    For example, a journal or quest list in an rpg game - One side contains the list of the quests, and the other side the detail of the currently selected quest. Click on one of the list items results in the display of the details, and using the arrow keys will change the selection.
     
  11. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    That's pretty easy to create via code. Create a template for what a single entry should look like and behave, and reference this game object in a script. This script can then instantiate copies, position them, and fill them with appropriate information. I did the backpack inventory this way in example 3.
     
  12. mindlube

    mindlube

    Joined:
    Oct 3, 2008
    Posts:
    993
    Wow- just going through the tutorial videos. Really like the component based, simple, elegant way this system is designed. Very cool!
    ++ for supporting texturepacker atlas!
     
  13. SteveJ

    SteveJ

    Joined:
    Mar 26, 2010
    Posts:
    3,085
  14. SteveJ

    SteveJ

    Joined:
    Mar 26, 2010
    Posts:
    3,085
    Sorry - it's obvious of course. There's two copies of MiniJSON.cs in the project. Must also be a part of UIToolkit.
     
  15. bigkahuna

    bigkahuna

    Joined:
    Apr 30, 2006
    Posts:
    5,434
    One question, which I think I know the answer to but will ask anyways, is it possible to use this for "pixel perfect" GUI's? I'm guessing not. I'm replicating a Windows 7 gui in game so need this and so far the only solutions I've found are Unity's built in OnGUI and GUITexture/GUIText game objects. Incidentally, you've done a very nice job on the two introductory tutorial videos. Very well organized, clear and easy to follow.
     
  16. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    Yes, that's the problem. Keep NGUI's version.
    It's possible, supported, and there is an example on how to do it (example 0). If you want pixel-perfect results on all resolutions, UIOrthoCamera script should be used. UIAnchor should also be used on the root with the half-pixel offset option checked. That's it. :)
     
  17. bigkahuna

    bigkahuna

    Joined:
    Apr 30, 2006
    Posts:
    5,434
    Besides pixel accurate positioning, will the GUI textures be displayed pixel perfectly? Not sure if I'm using the correct terminology or explaining myself very clearly but assuming I'm trying to re-create a Windows 7 window frame, buttons and contents, can I do this so it appears just like it would on a Windows 7 screen? I can do this using GUITexture / GUIText game objects and OnGUI but not with other sprite based systems. If so, you may have another new customer. ;)
     
  18. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    Yes, pixel-perfect. :) Just a note: ensure that the UIAnchor is used with the half-pixel offset the same way it's used in all 2D UI tutorials, or you will get blurriness on windows machines.
     
  19. bigkahuna

    bigkahuna

    Joined:
    Apr 30, 2006
    Posts:
    5,434
    Expect my order later this weekend! :)
     
  20. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    Cool, the setup should be fairly simple but if you have any questions, just ask.
     
  21. BrUnO-XaVIeR

    BrUnO-XaVIeR

    Joined:
    Dec 6, 2010
    Posts:
    1,687
    Any chance to implement tools that remove the need for those extra external tools?
    They are the only reason I didnt buy this already.
     
  22. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    External tools? Technically the only external tool that's needed is BMFont or Glyph Designer. Texture Packer support is a bonus, not a necessity. BMFont is also free, so why reinvent the wheel? :)
     
  23. Ostwind

    Ostwind

    Joined:
    Mar 22, 2011
    Posts:
    2,804
    I agree there is no point using time to re-create those external tools when the time can be used to implement new features, fix bugs or just focus on support + tutorials :)
     
  24. koen.pis

    koen.pis

    Joined:
    Mar 24, 2011
    Posts:
    66
    While your at it can you please implement a photoshop like editor window, I hate using that to design my gui textures.

    On more serious note love it, performance, no bloat, easy to use ... ugh way did it take so long for something like this to come along.
    *Starts deleting EZ Gui work arounds from long tem memorie.*
     
  25. mydingefnysen

    mydingefnysen

    Joined:
    Dec 15, 2011
    Posts:
    51
    Bought it yesterday, looks really promising! Very well crafted!

    Its great as it is but if I could throw in some features it would be:

    1) Support for bold/italic/underlined text the same way as colors are coded (of course the bold version of the font has to be present in the spritesheet and referenced somehow, possibly ruining the clean and simple feel of everything?)

    2) A more integrated and automatic setup between the fonts and the atlas, so that there is no need to enter the coords manually, and so that they also follow along when updating and adding to the sprite atlas.


    Two weirds things has happened though, dont know if its my fault or not:

    1) When adding one sprite to the atlas it changed ratio from square to 2:1. When reimporting all the sprites got updated correctly when pressing play (after dragging in the newly generated texture packer file to the prefab), but the inner rects from before where reset to default sprite-size values. Did I do something wrong?

    2) I sometimes get null reference exceptions in the OnDrawGizmo()-method in the UIWidget.cs, the line with "if (panel.showGizmos)". I could recreate it now when I tried so I dont know what I do. Ill get back to you when I recreate it next time.

    Im also wondering how effective this can be with a lot of moving sprites (for example lots of sprites always facing the 3D-camera that needs to redraw the panels mesh every frame?


    Keep up the good work!
     
  26. BrUnO-XaVIeR

    BrUnO-XaVIeR

    Joined:
    Dec 6, 2010
    Posts:
    1,687
    Id have to buy Glyph Designer just to use your plugin.
    Theres nothing funny about it from my point of view...
    When you already have a ton of tools to deal with, when more drop in the list it makes things worse for workflow.
    I would rather much more pay 200 in this doing the job it all than paying 65 the way it is splitted between some tools;
    But of course, it was just a question.

    Edit: Look, Im not saying the tool is not good, its the best I found until now.. Thats why Im interested.
    Hopefully mr Erich is such an amazing guy, he already did what I started to search for, he just had done it long ago:
    http://www.unifycommunity.com/wiki/index.php?title=SaveFontTexture

    With that workflow will be much better for me, so Im confident enough to buy it now; Maybe you could take a look into that and add something alike for next a version.
     
    Last edited: Dec 17, 2011
  27. Ostwind

    Ostwind

    Joined:
    Mar 22, 2011
    Posts:
    2,804
    Why would you need to buy Glyph Designer? its just one example and there are other tools too (free). Extra work doing something that already exists would probably mean price going up a bit too for no good reason in general. Platform independent font generator made with Unity isnt that fast to do anyways I think?
     
  28. BrUnO-XaVIeR

    BrUnO-XaVIeR

    Joined:
    Dec 6, 2010
    Posts:
    1,687
    Having the same problem.
    Show Gismos is turned off but still this error floods the logger.
     
    Last edited: Dec 17, 2011
  29. seon

    seon

    Joined:
    Jan 10, 2007
    Posts:
    1,441
    So I have looked over this GUI solution and it looks pretty good. Here are my questions/requirements...

    1. Buttons - Ability to set hover and down sprites as apposed to just tinting colours for each state. Is that possible?
    2. Sprite Animation - Is it possible to animate sprites? How do you set up the frame sequence? For animated buttons, dials etc
    3. Alpha - Is it possible to animate the alpha/opacity of a sprite or control? To face a button in or out etc on a per control basis ?
    4. Scripts - Is everything about each control scriptable at runtime? I would assume yes, but none of your videos show or mention this ability.

    Thanks...
     
  30. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    Yeah that's my concern as well -- keeping it clean and free of bloat sometimes means saying no to some features. But, if enough people want it, I can add something like this.

    I'll put it on the list.

    I'm not sure I follow... ratio of what?

    Hmm. Null exception? Curious I haven't seen it, but this should likely fix it:

    UIWidget, line 306:

    if (panel.showGizmos)

    Replace it with:

    if (mPanel != null mPanel.showGizmos)

    It should be fast enough, but I recommend putting them on a separate panel so they don't affect the rest of the UI.
     
  31. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    Unfortunately saving the texture is not enough. There is a ton of other information that needs to be saved -- where the glyphs are in the texture, what their size is, kerning information (offset depending on what character is before it), where they begin vertically, and more. Doing it this way also means the textures can't be hand-edited in tools like Photoshop adding effects like drop shadow, bevel, outline, etc.
     
  32. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    1. Sure. Think of it this way: If you had 2 different sprites (regular and pressed), you could hide one while displaying the other depending on the current state of the button. This can be done without adding any extra code, just use the UIStateColors script.

    2. No, there is no sprite animation. Consider animating by adjusting the transform -- scaling it, rotating it, moving it, etc. You can use Unity's built-in animation functionality for that to create your own custom animations to create some fancy buttons this way, complete with animationg color changes in addition to what was mentioned.

    3. Yep, UIStateColors script is an example.

    4. Yup. AddComponent<widgettype> and do what you want with it.
     
  33. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    P.S. I've updated the download package on the PayPal download page with the reported null exception fix and submitted an update to the asset store. It's odd that it was happening, but with 1.09c version that shouldn't happen anymore. You don't have to update if you just replace that one line I mentioned above.
     
  34. seon

    seon

    Joined:
    Jan 10, 2007
    Posts:
    1,441
    1. Ok, so we have to roll our own state system to track which button state gameobject to show/hide? that's a shame. Button image state change is a fundamental feature of any GUI system. Will you add this in?

    2. I'm not looking for transform animation but animation of images on the sprite. e.g. hover over button of a little man and the man runs.. (cycles between animation images on the sprite) - again, we would need to make a bunch of GO's manually and add them to an array and cycle through them manually switching them on and off. Not ideal.

    3. Thanks.

    4. Thanks.

    Your GUI system does look good and seems easy to use, but also seems to lack some basic stuff that other UI systems offer and that I would require.

    I'll keep watching this thread to see of the product evolves more as you seem to be very active in addressing user feedback and questions.
     
  35. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    1. Nope, no need for your own system. You can just attach UISendState and it will take care of sending out state notifications that will get picked up by UIStateColors. Both of these are very tiny scripts though, so if you wanted to you could write your own -- just implement OnPress, OnClick, and OnHover functions. In order to have on/off states, simply have 2 sprites in the same spot, each with UIStateColors set to show it when a specific state is set.

    2. Yes I understand, a slideshow animation essentially. I don't recommend using a bunch of game objects. You can simply have a script that has a string array, each entry is a sprite name -- ie: "runningMan0", "runningMan1", etc. It would then simply set the sprite on the UISprite it's attached to depending on time.
     
  36. seon

    seon

    Joined:
    Jan 10, 2007
    Posts:
    1,441
    1. Right, so using UIStateColors I would set the alpha of any state on the button to 0 for when I want to hide them for that state? Ok, I get it. So 3 image states would be 3 buttons on same spot (each with correct image) with alpha set to 1 only for the correct state version for each.

    Alternately, I could just (using your explanation for 2) set the image for the button to the correct state via string reference from the atlas via script using OnPress, OnClick and OnHover etc. Is there an OnHoverOut or OnMouseOut? So I can detect a loss of focus state?

    2. Ok, so you can manually set the sprite from an atlas at runtime by name reference? If so, that would work fine.

    Thanks ArenMook!
     
  37. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    1. Yup to both. You got it. :) OnHover has a boolean parameter. The function prototype is: void OnHover (bool isOver).

    2. Yup. :)

    P.S. More on the events: http://www.tasharen.com/?page_id=160
     
  38. SteveJ

    SteveJ

    Joined:
    Mar 26, 2010
    Posts:
    3,085
    Is anyone using GlyphDesigner with NGUI? Any tips for export procedure? I'm getting some funny results - like sometimes the NGUI labels I create appear correctly but others have this text all jumbled up. This is in a single scene, using the same atlas, font data file, etc.
     
  39. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    I'd like to know what the issue is as well. I don't have the program, I've only tested the exported font data sent to me and it worked fine. Can you select the font and check to see what area it has selected in the atlas? Does that change at all?
     
  40. SteveJ

    SteveJ

    Joined:
    Mar 26, 2010
    Posts:
    3,085
    OK - looks like a couple of things that were a problem. For anyone using GlyphDesigner/Texture Packer workflow, here's the only things you have to "make note of":

    GlyphDesigner:
    * Select your font on the left.
    * Click the "ASCII" button in the bottom-right corner under "Included Glyphs" (with some fonts, it seems to only pull in a subset unless you specifically press this button).
    * Turn off auto-size and size your output appropriately in the top-right corner, "Texture Atlas" section.
    * Press the export button on the far-right of the toolbar.
    * Export in "EZ GUI Text" format.

    Texture Packer:
    * Make sure you uncheck the "Trim" and "Auto rotation" options if your atlas includes a font (they're on by default).


    (it was "Trim" that was the main source of my problem).

    Only issue I have now is that my UILabels don't show spaces. Something to do with the specific font that I'm using though so I'll try to figure it out.

    EDIT: And yes, I know you show turning off "Trim" in the tutorial video, but it's during a part where you say that you need to do those things if you don't have a license. I do have a license so I ignored you :)
     
  41. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    Thanks for figuring it out! :)
     
  42. SteveJ

    SteveJ

    Joined:
    Mar 26, 2010
    Posts:
    3,085
    Is there any way to size the UILabel (e.g. to the width of the screen, height of the screen), and then get word-wrap happening?

    e.g. say you were creating a character dialogue window that's 400x300 somewhere on screen. You want to assign the text dynamically through code.
     
  43. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    Just set its max width.
     
  44. SteveJ

    SteveJ

    Joined:
    Mar 26, 2010
    Posts:
    3,085
    You're gonna get soooo sick of me asking dumb questions like that :)

    Just figured out what the "Line Width" setting does!
     
  45. mydingefnysen

    mydingefnysen

    Joined:
    Dec 15, 2011
    Posts:
    51
    Sorry I wasnt so clear there. My first imported atlas was 1024x1024. I set up some innner rects. I then added some sprites to the atlas which made it 1024x2048 in size when exported from texture packer. When I reimported that into unity, everything looked wrong, pressed play and the normal sprites looked fine again, fonts were garbled (as expected) but also all previous inner rects were gone. I dont know if I did something wrong though and I can try the procedure again to see if I can get it to work.
     
  46. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    I understand why hitting play would be necessary of the texture dimensions changed. As for the inner rects... are you using 1.09? Prior to that inner rects were not preserved.
     
  47. SteveJ

    SteveJ

    Joined:
    Mar 26, 2010
    Posts:
    3,085
    I've been playing around all day with UILabel and the process of getting fonts into an atlas.

    I've tried GlyphDesigner and BMFont and I always get the same results.

    If I use the Arial font. It works fine. I'm sure it also works fine with the majority of other fonts.

    SOME fonts though work perfectly, EXCEPT that space is not recognised. So, once you have everything up and running and you create your UILabel, you can type sentences but the spaces between the words don't appear.

    I'm not sure if this is a font thing, or an NGUI thing.

    @ArenMook - I'm going to PM you a font that I'm using in my project which produces the problem. Think you could have a quick look whenever you get a sec?
     
  48. ArenMook

    ArenMook

    Joined:
    Oct 20, 2010
    Posts:
    1,902
    I looked into that font you gave me. It is simply an incomplete font that doesn't have a character for space. In fact, it's missing a lot of characters. It doesn't even have numbers aside from 0, 1, and 2.

    Look for yourself:



    Solution: use a proper font. :p
     
  49. SteveJ

    SteveJ

    Joined:
    Mar 26, 2010
    Posts:
    3,085
    Weird. Thanks man - I'll go back to the source for the font. It definitely USED to be complete. I've used it in standard apps previously - i.e. Word.
     
  50. mindlube

    mindlube

    Joined:
    Oct 3, 2008
    Posts:
    993
    @ArenMook- hey I bought it, haven't had a chance to dig into it yet, will tomorrow. Just wanted to throw in my 0.02c dont waste energy making atlas generator or bitmap font generator. Instead focus on refining the product you have done so far. EZGUI has an atlas creation tool builtin- but is kind of clunky to use compared to texturepacker and doesn't have the flexibility of ngui - for example you can't embed a font bitmap in an atlas. That's a really cool feature by the way!
     
Thread Status:
Not open for further replies.