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

Prime31 UIToolkit Multi Resolution GUI Solution Ready for Use...and it's free

Discussion in 'iOS and tvOS' started by prime31, May 3, 2011.

  1. Vitalii

    Vitalii

    Joined:
    Mar 2, 2012
    Posts:
    9
    Pretty old question, but i didnt manage to find answer.

    I'm trying to make inventory, how should i put UIHorizontalLayout inside UIVerticalLayout (or vise versa?)
    Tried something like this

    Code (csharp):
    1.  
    2. row = new UIHorizontalLayout[rowsNumber];
    3.         col = new UIVerticalLayout[colsNumber];
    4.         UIButton slot;
    5.        
    6.         //int i = 0;
    7.         for (int i = 0; i < row.Length; i++) {
    8.             row[i] = new UIHorizontalLayout(rowsOffset);
    9.             for (int j = 0; j < col.Length; j++) {
    10.                 slot = UIButton.create("cbDown.png", "cbUnchecked.png", 0, 0);
    11.                 row[i].addChild(slot);
    12.             }
    13.             col[i].addChild(row[i]);
    14.         }
    15.  
    but got error here
    col.addChild(row);
     
  2. KeeZ

    KeeZ

    Joined:
    Feb 1, 2011
    Posts:
    20


    It's not possible yet to add anything but inherited members of UISprite to layouts.
     
  3. Vitalii

    Vitalii

    Joined:
    Mar 2, 2012
    Posts:
    9
    Sounds not that good... anyway, thanks.
     
  4. Reks

    Reks

    Joined:
    Feb 7, 2012
    Posts:
    2
    Hello
    I got problem with UIToolkit text. When I use font without lengthening everything
    works great but when I use font with A Ā E Ē I got this error -
    Can someone please help me?
     
  5. laserlars

    laserlars

    Joined:
    Nov 17, 2011
    Posts:
    255
    Hey Prime31, thanks for this magnificent tool :)
     
  6. BeforeTheLight

    BeforeTheLight

    Joined:
    Jan 7, 2011
    Posts:
    168
    $Problem.png

    Here is my issue. The kitchen sink panel works fine. No fade in it at all. So when i was making my panel I followed the sizes to make mine. Mine had fade from panel color to black every time. I used yellow in this panel because it is so easy to see, and have resized the textures to try to fix the issue. Is there a set of rules that allow these panels to not fade? Thanks In advance.
     
  7. Vitalii

    Vitalii

    Joined:
    Mar 2, 2012
    Posts:
    9
    Another question: can i make compound sprites?
    I want to combine some sprites into one, and attach it to button (now working on inventory):


    upper level ------ picture of weapon (blade or axe)
    ---------------------- shining around weapon (showing strength of weapon)
    ---------------------- button background (which reacts on mouse movement)
    lower level ------ border around button (showing is weapon equiped or not)


    I guess, for the start, i'll use pre-ready images.
     
    Last edited: Mar 4, 2012
  8. Vitalii

    Vitalii

    Joined:
    Mar 2, 2012
    Posts:
    9
    Other question: is it possbile to cuztomize sprite images for other states of UIToggleButton? (for Common, Selected, and Highlited states?)

    The only thing i found is
    sender.setSpriteImage("item.png")
     
  9. KeeZ

    KeeZ

    Joined:
    Feb 1, 2011
    Posts:
    20
    You need to make sure you've exported the font with the mentioned characters.
     
  10. laserlars

    laserlars

    Joined:
    Nov 17, 2011
    Posts:
    255
    Hm, I`m using multiple texture atlases with no problems untill now.

    I know I´m supposed to use UIProgressbar.create(<my textureatlas>, "img1", "img2"... but it doesn`t work. Seems like theres no argument for the atlas in .create even though the documentation says so ?
    The game runs without the atlas-argument, but.. it doesn not show the correct sprites :)
    I downloaded UItoolkit from github about a week ago, so it can`t be an old version.

    Ideas? Thanks.
     
  11. Ben-BearFish

    Ben-BearFish

    Joined:
    Sep 6, 2011
    Posts:
    1,204
    I modify text to this:

    Code (csharp):
    1.  
    2.     public string text
    3.     {
    4.         get { return _text; }
    5.         set
    6.         {
    7.             clear(  );
    8.             _text = value;
    9.             // cleanse our textSprites of any excess that we dont need
    10. //          if( _text.Length < textSprites.Count )
    11. //          {
    12. //              for( var i = textSprites.Count - 1; i >= _text.Length; i-- )
    13. //              {
    14. //                  var sprite = textSprites[i];
    15. //                  textSprites.RemoveAt( i );
    16. //                  _parentText.manager.removeElement( sprite );
    17. //              }
    18. //          }
    19.             _parentText.updateText( this );
    20.             updateSize(  );
    21. }
    22.  
    Not sure if this fixes or not, but it seems to make things run faster for me.
     
    Last edited: Mar 7, 2012
  12. Ben-BearFish

    Ben-BearFish

    Joined:
    Sep 6, 2011
    Posts:
    1,204
    Is it possible to have a hierarchy of parenting, so that say we have this:

    UIKnob (Parent of UIButton) -> UIButton (Parent of UITextInstance) -> UITextInstance

    When I try to do this currently, the button will parent to the UIKnob, but the text will not parent to the Button it seems.

    This is mainly noticeable when I use the UIAnimation property positionFromTo on the UIKnob.

    The UIButton follows the UIKnob, but the UITextInstance does not follow the UIButton. Does anyone know a possible fix or solution? Thank you.
     
  13. Ben-BearFish

    Ben-BearFish

    Joined:
    Sep 6, 2011
    Posts:
    1,204
    You're going to have to provide more code for us to help you. Let's see the function you're calling that in.
     
  14. EriKo

    EriKo

    Joined:
    Mar 23, 2010
    Posts:
    1
    Hi all
    I'm using this line of code:
    var btn= UIButton.create("egreen.png","eorange.png",0,0);
    without unity "Maximize On Display" it run ok but if i enable "Maximize On Display" and
    hit play then i get this message:
    NullReferenceException: Object reference not set to an instance of an object
    UISpriteManager.textureInfoForFilename (System.String filename) (at Assets/Plugins/UIToolkit/BaseElements/UISpriteManager.cs:172)
    UIButton.create (.UIToolkit manager, System.String filename, System.String highlightedFilename, Int32 xPos, Int32 yPos, Int32 depth) (at Assets/Plugins/UIToolkit/UIElements/UIButton.cs:33)
    UIButton.create (.UIToolkit manager, System.String filename, System.String highlightedFilename, Int32 xPos, Int32 yPos) (at Assets/Plugins/UIToolkit/UIElements/UIButton.cs:26)
    UIButton.create (System.String filename, System.String highlightedFilename, Int32 xPos, Int32 yPos) (at Assets/Plugins/UIToolkit/UIElements/UIButton.cs:20)
    CButtons.Start () (at Assets/scripts/CButtons.cs:13)

    any idea why?
     
  15. Ben-BearFish

    Ben-BearFish

    Joined:
    Sep 6, 2011
    Posts:
    1,204
    Same as what I said to laserlars. You're going to have to provide more code for us to help you. Let's see the function you're calling that in.
     
  16. vividnova

    vividnova

    Joined:
    Mar 10, 2012
    Posts:
    1
    Hi, I'm trying to rotate my UI elements (button/text etc) and was able to do that fine by rotating the UIToolkit camera, however the touchFrame for the buttons doesn't reposition to match the buttons new locations.



    The touch hotspots are still in the locations designated in red. Is there something I need to be doing to tell the touchFrames to rotate as well, or is this not possible?

    Thanks.
     
  17. jjobby

    jjobby

    Joined:
    Nov 28, 2009
    Posts:
    160
    How can I make UIToolkit to automatically adjust its size and position when I change the resolution of the screen? My problem is it only works for one screen resolution when UIToolkit is initialized. If I change the resolution, UIToolkit does not update its size and position which makes it unplayable.
     
  18. laserlars

    laserlars

    Joined:
    Nov 17, 2011
    Posts:
    255
    .positionFromXXX is resolution-independent.

    I use Screen.width to check if its 3GS, retina or iPad.. not sure if that's the best way to do it but I get exactly what i want.
    ..only downer is that i can't test the new iPad resolution yet :p
     
    Last edited: Mar 13, 2012
  19. VeraxOdium

    VeraxOdium

    Joined:
    Jul 2, 2011
    Posts:
    233
    Having trouble understanding the positioning system. If you position a control using percentages you get slightly different positioning with different aspect ratios. So for laying out a menu with very exact button placement... I don't understand how you are supposed to do this across different AR's without large buffer zones between controls to allow them to walk around. This wouldn't be so bad but with mobile you have small screen space so everything needs to be packed tight and precise for what I'm doing...

    The other positioning system you can use is PixelsFrom top, left, etc. So if I come up with some formulas I can position everything manually through this with a lot of work but I figure there must be something easier? Is there some way to position from PixelsFromCenter? I could use the middle of the screen as reference and design everything off of that but I don't see that.

    Am I missing something here? I have to be doing it wrong.
     
  20. Ben-BearFish

    Ben-BearFish

    Joined:
    Sep 6, 2011
    Posts:
    1,204
    Use:
    pixelsFromCenter

    When there is no parent to the UI object the parent position is based off of the screen coordinates itself.
     
  21. VeraxOdium

    VeraxOdium

    Joined:
    Jul 2, 2011
    Posts:
    233
    I can find no "pixelsFromCenter". Also parenting changes nothing, everything is still in screen space??? I'm not talking about changing it directly through localPosition.
     
  22. Ben-BearFish

    Ben-BearFish

    Joined:
    Sep 6, 2011
    Posts:
    1,204
    You might have an old version of UIToolkit. You may want to update to the most recent build. It has what you want in there.
     
  23. VeraxOdium

    VeraxOdium

    Joined:
    Jul 2, 2011
    Posts:
    233
    Aha! How I got a hold of Nov 3 release I do not know, ty everything works fine now.
     
  24. emiliooo

    emiliooo

    Joined:
    Mar 14, 2012
    Posts:
    4
    Hi,
    I'm using the scrollable layout of the toolkit . My game contains chapters and levels . the user select a chapter from the chapters menu then select a level from the levels menu . I want both of these menus scrollable . How can I make two different scrollable menus in the same scene and switch between them?
     
  25. pixelbacon

    pixelbacon

    Joined:
    Mar 8, 2012
    Posts:
    10
    Is it possible to animate a UIAbsoluteLayout?

    I'm not getting compile errors with the alphaTo, but I also see no results either... What is the point of using a container, if we can't animate it, but have to animate the individual children?
     
  26. pixelbacon

    pixelbacon

    Joined:
    Mar 8, 2012
    Posts:
    10
    UIAnimation testAnim = _applePiePanel.alphaTo(1f, .1f, Easing.Quartic.easeOut);

    Is the code.
     
  27. pixelbacon

    pixelbacon

    Joined:
    Mar 8, 2012
    Posts:
    10
    Also, is there a reason there is no variable for simple comparison sake?

    For example a name or id or something so that we don't have to do switches against instances on button listeners, or make a new listener function per button?

    UIToolkit is awesome for simple setup, but it seems when it's lacking something this basic, it becomes over the top to manage button clicks, layouts, containers, etc.
     
    Last edited: Mar 14, 2012
  28. pixelbacon

    pixelbacon

    Joined:
    Mar 8, 2012
    Posts:
    10
    You have to set a variable that says what to show. So after they choose a level, update the variable, and based on that update, show the levels menu.

    You have the instances of the scrollable items, it's basic code to decide which to show, nothing specific to UItoolkit.

    If you don't know how to toggle them, simply use:
    scrollableInstance.hidden = boolean;
     
  29. emiliooo

    emiliooo

    Joined:
    Mar 14, 2012
    Posts:
    4
    Thanks a lot , that was very helpful.
     
  30. Ben-BearFish

    Ben-BearFish

    Joined:
    Sep 6, 2011
    Posts:
    1,204

    Does anyone know how to implement this exactly and in what files? Thanks.
     
  31. VeraxOdium

    VeraxOdium

    Joined:
    Jul 2, 2011
    Posts:
    233
    I updated to the latest files at GitHub, everything worked fine until I built to Android. It throws these errors:

    Assets/Plugins/UIToolkit/UI.cs(79,58): error CS0103: The name `iPhone' does not exist in the current context

    Assets/Plugins/UIToolkit/UI.cs(81,21): error CS0019: Operator `' cannot be applied to operands of type `bool' and `object'

    The difference between the 11-03 UI.cs script and the 02-29 UI.cs script is this one line

    Code (csharp):
    1. var deviceAllowsHD = ( allowPod4GenHD  iPhoneSettings.generation == iPhoneGeneration.iPodTouch4Gen ) || iPhoneSettings.generation != iPhoneGeneration.iPodTouch4Gen;
    and

    Code (csharp):
    1. var deviceAllowsHD = ( allowPod4GenHD  iPhone.generation == iPhoneGeneration.iPodTouch4Gen ) || iPhone.generation != iPhoneGeneration.iPodTouch4Gen;
    respectively.

    The fix was for the deprecated iPhoneSetting.generation to iPhone.generation.. For whatever reason it is broken now, I don't know enough about these things to understand what the deal is...
     
  32. KeeZ

    KeeZ

    Joined:
    Feb 1, 2011
    Posts:
    20
    I assume you're using Unity 3.5, but the fastest way to get it working on Android is to add the Android preprocessor define to the line above as so:
    Code (csharp):
    1. #if UNITY_EDITOR || UNITY_STANDALONE_OSX || UNITY_STANDALONE_WIN || UNITY_WEBPLAYER || UNITY_ANDROID
     
  33. VeraxOdium

    VeraxOdium

    Joined:
    Jul 2, 2011
    Posts:
    233
    Ahhh, that was the first thing I tried, I had the two UI files open in VS to compare and apparently edited the wrong one, ty.
     
  34. JakeT

    JakeT

    Joined:
    Nov 14, 2010
    Posts:
    34
    @Prime31 - love your plugins. Have a question for you on the UIToolkit. I've got UIToolkit running well for iPhone with 1x textures (512x512) and 2x (1024x1024) textures for all my atlases for Retina, but how exactly would I set this up for the "New iPad"? Do you have a 4x option in there somewhere? I'm guessing something like the following:
    1) Switch to the iPad build in Player Settings, and move all of my original 512x512 textures out of Unity
    2) Rename all of my "2x" texture atlases to just the atlas name
    3) Create all of my 2048x2048 textures for the "New iPad" and label them "2x"
    4) Set my "Max width or Height for HD" value to 2048 so it switches to 2x atlases
    5) Build and voila?

    Is there an easy way to do all of this? And how do I test this without having a brand new shiny iPad (I'll try it out in the Xcode simulator I guess)?

    Thanks!
    Jake
     
  35. prime31

    prime31

    Joined:
    Oct 9, 2008
    Posts:
    6,426
    I still haven't decided the best course of action for The New iPad. For now your best bet is to make a subclass of the UIToolkit class and add a 3rd level of detail just like the current class handles them. As for the future it will go one of two routes (or possibly a combo of the two):

    - stick with 2 texture levels and add an iPad flag for auto loading. That would make for a total of 4 possible combos: iPhone, iPhone2x, iPad, iPad2x
    - add a 3rd texture level (4x)
     
  36. emiliooo

    emiliooo

    Joined:
    Mar 14, 2012
    Posts:
    4
    Hi,
    I have an issue that on using the scrollable menus containing buttons or state buttons , when I click these buttons the whole menu disappear .
     
  37. jacksmash2012

    jacksmash2012

    Joined:
    Sep 21, 2010
    Posts:
    27
    Question..

    I have a vertical "slice" of an image that contains the gradient coloring for a horizontal bar (like what you'd see at the top of an iPhone app). I want to use this to fill an object at the top of the screen. How would I do this using UISprite?
     
  38. JakeT

    JakeT

    Joined:
    Nov 14, 2010
    Posts:
    34
    @Prime - thanks, seems to have worked perfectly! I ended up going with your first option (2 sets of textures and just added an "_iPad" extension to the 2nd set of textures (so 1 set is 480 and 960 width, 2nd set is 1024 and 2048 width). But I am not 100% convinced this is the most scalable / long-term solution. There's got to be an easy way to manage so many textures/atlases/resolutions. Anyhow, here's what I did:

    UI.cs (Line 31, in declarations):

    Code (csharp):
    1.     // **************************** - adding support for iPad atlases
    2.     public int maxWidthOrHeightForiPadSD = 2048; // if the width/height of the screen equals or exceeds this size HD mode will be triggered
    3.     public bool isiPad = false;
    4.     public string iPadExtension = "_iPad";
    5.     // ****************************  - adding support for iPad atlases
    UI.cs (Line 88, replaced "if( autoTextureSelectionForHD deviceAllowsHD )" with):

    Code (csharp):
    1. // ****************************  - START - supprt for iPad Retina ****************************
    2.         if (Screen.width >= 1024 ) // iPad or Mac (either way, can use the larger textures)
    3.         {
    4.             isiPad = true;
    5.             if (Screen.width >= maxWidthOrHeightForiPadSD ) // "New" iPad Retina
    6.                 isHD = true;               
    7.         }
    8.         else if( autoTextureSelectionForHD  deviceAllowsHD )
    9.         // ****************************  - END ********************************************************
    UISpriteManager.cs (Line 82 in loadTextureAndPrepareForUse after check for UI.instance.isHD):

    Code (csharp):
    1. // ************************ - Load iPad Atlases if necessary ********************
    2.         if( UI.instance.isiPad )
    3.             texturePackerConfigName = texturePackerConfigName + UI.instance.iPadExtension;
    4.         // **********************************************************************************
    I'll let you know if I run into any problems. Thanks!

    Jake
     
  39. numberkruncher

    numberkruncher

    Joined:
    Feb 18, 2012
    Posts:
    953
    What is the easiest way to create a panel that repeats a texture vertically down the right side of the screen? Width is 225px height is whatever the screen resolution is set to.

    I will be putting 3 touch buttons within this space.

    Cheers
     
  40. opsive

    opsive

    Joined:
    Mar 15, 2010
    Posts:
    5,122
    Although native iOS uses the first option, my vote would be for the second. The iPhone 4 retina and the original iPad are so similar is screen resolution, in my mind it isn't worth an extra texture map.
     
  41. cayse

    cayse

    Joined:
    Mar 20, 2012
    Posts:
    1
    It is strange that such a strong and free product remains virtually unchanged at github. Few offer patches and changes. Even offered patches not inspected. Few errors are tracked. Perhaps the development project is expected through the Forks ?
    How developers see opportunities for the development of the project?
     
  42. jacksmash

    jacksmash

    Joined:
    Mar 20, 2012
    Posts:
    5
    Not sure of the best way to do this. I need to have buttons positioned relative to each other. I'm creating one button with an image and then stretching it, like so:

    var y = (int)UIRelative.yPercentFrom( UIyAnchor.Top, .25f, Screen.height );
    mButton = UIButton.create(experience_select, "menu_background.png", "menu_background.png", 0, y);
    mButton.centerize();
    mButton.scale = new Vector3(1000f,1f,1f);

    The first problem here is that as soon as I call "scale" it overrides the initial "y" value and the button is no longer positioned relative to the screen height.

    After I get that sorted out, I want to position the next button to start at the bottom of the previous button (mButton).

    Any help is appreciated.
     
  43. pweeks

    pweeks

    Joined:
    Mar 29, 2011
    Posts:
    104
    i made a small change to uibackgroundlayout if you want the change...i added a new constructor to take in a rect for size of the sprite so that you can initialize with new Rect(0,0,Screen.Width,Screen.Height). Makes it so my backgrounds are always full screen...unless there was a better way to have accomplished this
     
  44. KeeZ

    KeeZ

    Joined:
    Feb 1, 2011
    Posts:
    20
    Set autoRefreshPositionOnScaling to false.
     
  45. Dun1031

    Dun1031

    Joined:
    Mar 22, 2012
    Posts:
    5
    I am loving the UIToolkit but after updating to revision 316 I have found there is an issue with progress bars and borders (actually started at Revision 313).

    Is there a reason the option to have a border for progress bars was removed? According to the commit message it was just referred to as silly, though I find it extremely useful from a GUI sense. Will this be re-added later?
     
  46. prime31

    prime31

    Joined:
    Oct 9, 2008
    Posts:
    6,426
    @Dun, glad to see somebody reads the commit messages! Having the framework impose a border on the progress bar didn't make any sense. It made the control no longer a good building block. You can easily mimic the border by making a standard UISprite and putting it behind the progress bar.
     
  47. Dun1031

    Dun1031

    Joined:
    Mar 22, 2012
    Posts:
    5
    Aha that makes sense. It also cleaned the code up nicely :p

    Thanks for the fast response. Its an awesome utility!

    Edit:
    Everyone should read the commit messages! They will answer a lot of your questions, and sometimes lead you to ask better questions when they don't provide the answer you need.
     
    Last edited: Mar 22, 2012
  48. Deleted User

    Deleted User

    Guest

    Some users are complaining that our game menus don't work with a Droid Bionic (Android device). Has anyone figured why not?
     
  49. francoislouw01

    francoislouw01

    Joined:
    Mar 22, 2012
    Posts:
    3
    hey. been using uitoolkit to generate our entire UI, however, we have run into a problem. we use a fog render when going underwater. the ui on iOS picks up the fog render, however on unity in player it doesnt. so it looks perfect till i build and run on ipad, and then we have our problems. we have another camera that works almost like a minimap, basically a camera that picks up a plane with a texture on it. now that doesnt get affected by the fog.

    how can i get the ui to ignore the fog render?
     
  50. Deleted User

    Deleted User

    Guest

    Does this help -> https://github.com/acron0/UIToolkit/commit/113cff2b3bdbebded96a815923bd0e90099392b5