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

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

  1. pweeks

    pweeks

    New Member

    Joined:
    Mar 29, 2011
    Messages:
    87
    and in retrospect,while the backgroundlayout change i made worked, it obviously stretches backgrounds on larger resolutions.

    whats the best method for having full screen backgrounds that are resolution independent?

    sprites initialize themselves to the size of the texture, and i know about adding 2x to the extension, but it seems there should be a way of having one background for all resolutions, including the new ipad...no?
  2. KeeZ

    KeeZ

    Member

    Joined:
    Feb 1, 2011
    Messages:
    20
    All shaders should have been updated with Fog { Mode Off } so if you haven't got the latest version of UIToolkit you should check it out.
  3. francoislouw01

    francoislouw01

    New Member

    Joined:
    Mar 22, 2012
    Messages:
    3
  4. francoislouw01

    francoislouw01

    New Member

    Joined:
    Mar 22, 2012
    Messages:
    3
    Right, new issue. I need to add a text instance to a UIAbsoluteContainer..... the joy thereof is that you seem to only be able to add sprites to that and cant add UIobject? right, not right?

    how do i do that?

    infoButtonDescription1 = TrebuchetMS.addTextInstance( body, 87, 390, buttonBodyScale, 0, bodyColor );

    container = new UIAbsoluteLayout();

    i want to:

    container.addChild (infoButtonLabel1);

    but it accesses the object and not the sprite...

    so how do i add that textInstance to the container?
  5. unitynewb

    unitynewb

    Member

    Joined:
    Feb 22, 2009
    Messages:
    182
    Is there a way to draw a sprite at the touch location? I can draw one sprite then if there is a move command to the touch location kinda like positionCenter() that would work also.

    Edit: nevermind I figured it out:

    touch.y = Screen.height - touch.y;
    var fingerloc = UI.firstToolkit.addSprite( "optionsUp.png", (int)touch.x, (int)touch.y, 1 );
    Last edited: Mar 29, 2012
  6. jscifers

    jscifers

    New Member

    Joined:
    Jul 21, 2010
    Messages:
    10
    Can anyone provide guidance on specifying depth for UIButton creating using Prime31's UIToolkit? I have a series of buttons with changing text (from the user's point of view, anyway), and it seems the best way to accomplish this is to create UIButton and set its depth lower than UIText (any other suggestions on setting text for a button are welcome). Problem is, I can't figure out what do for the first parameter in the overloaded method for UIButton.create that allows setting the depth: UIButton.create(UIToolkit manager, string filename, string Highlightedfilename, int xPos, int yPos, int depth).

    What the heck do I do for that first "UIToolkit manager" parameter? As I said, any suggestions on other ways to assign text to buttons are welcome (this is for an educational, quiz-type game).

    Also...I've tried declaring "public UIToolkit buttonToolkit;" (as illustrated in the example at https://github.com/prime31/UIToolkit...Manager.cs#L15) and then using that in my UIButton instantiation (var btn150 = UIButton.create(buttonToolkit, "150.png", "150.png", 0, 0, 5), but this just results in an "Object reference not set to an instance of an object" error. Any ideas?

    Thanks!
  7. BeforeTheLight

    BeforeTheLight

    Member

    Joined:
    Jan 7, 2011
    Messages:
    132
    I am having issues with UIStateButton. I love how it works however if you touch inside and then slide out of touch area the button defaults to state 0. Is this a intended behavior? I made a change to the code under onTouchEnded removing the state++; but have removed this change and put it back to normal to test and even the standard code does this. The strange thing to me is when you click it after you have slid out of the touch area and the texture is now state 0 the actual state is still whatever it was before you slid off of the touch area and when you click it again it picks up where you were. Any thoughts? I have combed through the UIStateButton code but cannot find where touchWasInsideTouchFrame is false and it sets frame to 0. Thank You in advance!!
    Last edited: Mar 30, 2012
  8. jacksmash

    jacksmash

    New Member

    Joined:
    Mar 20, 2012
    Messages:
    5
    Has anyone else had an issue with using the function "alphaTo" with objects other than UIButtons? For instance, when I call alphaTo on an instance of UIVerticalLayout nothing happens... but it works fine with my UIButton instances.

    E.G:

    mScrollable.alphaTo(0.2f, 0f, Easing.Linear.easeOut);

    Thanks :)
    Last edited: Mar 31, 2012
  9. 10001110101

    10001110101

    Member

    Joined:
    Jan 19, 2012
    Messages:
    9
    Hey all, is the Joystick borked or something? It seems to be seriously offset. I've checked out the hitbox debugger, and my yellow hitboxes wrap the Joystick graphic, but whenever I touch down, it jumps around madly. :( Its even like that in the example.
  10. unitynewb

    unitynewb

    Member

    Joined:
    Feb 22, 2009
    Messages:
    182
    I am running a build back from when Unity was 3.4.2. I have since updated to Unity3.5 and am still using the same version of the UI Tool Kit and have not updated it due to some small changes I made to it myself. Now since my update to 3.5 I've been receving reports of lag on the evo 4G, could me not updating the UIToolkit be the cause?
  11. jscifers

    jscifers

    New Member

    Joined:
    Jul 21, 2010
    Messages:
    10
    any ideas? really struggling here with something that i'm sure should be simple if I only had some guidance...If UIToolkit doesn't let me do this, is there another iOS/Android-friendly component that will let me create a UI button with dynamic text?
  12. jscifers

    jscifers

    New Member

    Joined:
    Jul 21, 2010
    Messages:
    10
    oops...forgot to include the original post. can anyone help out here? not sure how to set the level for a button show I can show dynamic, overlaid text (this is for a kind of quiz game where answer choices will change)
  13. jscifers

    jscifers

    New Member

    Joined:
    Jul 21, 2010
    Messages:
    10
    OK, figured this out...MultipleAtlasManager example got me where I needed to go.
  14. numberkruncher

    numberkruncher

    Member

    Joined:
    Feb 18, 2012
    Messages:
    838
    I have added two sprites to a toolkit. One is an arrow and the other is an image. Here is what I have:

    Code (csharp):
    1.  
    2.         if (_hintMoveLayout == null) {
    3.             _hintMoveLayout = new UIAbsoluteLayout();
    4.            
    5.             UISprite hintMove = _toolkit.addSprite("hint_move.png", 0, 0, 0);
    6.             hintMove.pixelsFromBottomLeft(240, 180);
    7.            
    8.             UISprite hintArrow = _toolkit.addSprite("hint_arrow.png", 0, 0, 0);
    9.             hintArrow.pixelsFromBottomLeft(150, 210);
    10.            
    11.             _hintMoveLayout.addChild(hintMove, hintArrow);
    12.         }
    13.        
    14.         _hintMoveLayout.scaleFromTo(0.5f, Vector3.zero, Vector3.one, Easing.Linear.easeIn);
    I thought that animating the layout would animate properly, but it doesn't. How can I change the origins of the hintMove and hintArrow sprites so that they popout from center?

    Cheers
  15. numberkruncher

    numberkruncher

    Member

    Joined:
    Feb 18, 2012
    Messages:
    838
    Just to clarify, by popout from center I mean center of both sprites, not independent of each sprite but grouped.
  16. Neverbe

    Neverbe

    New Member

    Joined:
    Jun 29, 2010
    Messages:
    34
    Can I use it to build UI for desktop app?
    How can I download it? GitHub is not really "user friendly"...
  17. numberkruncher

    numberkruncher

    Member

    Joined:
    Feb 18, 2012
    Messages:
    838
  18. numberkruncher

    numberkruncher

    Member

    Joined:
    Feb 18, 2012
    Messages:
    838
    I would like to dynamically create a UIToolkit at the end of the level. Here is the code that I am trying but it fails to create the UIToolkit component:

    Code (csharp):
    1. using UnityEngine;
    2. using System.Collections;
    3.  
    4. public class BubbleUI : MonoBehaviour {
    5.    
    6.     // Material for bubble UI
    7.     public Material bubbleMaterial;
    8.    
    9.     private UIToolkit _toolkit;
    10.    
    11.     void InitToolkit() {
    12.         if (_toolkit != null)
    13.             return;
    14.        
    15.         // Create new UI toolkit for bubble interface
    16.         GameObject bubbleToolkit = new GameObject();
    17.         bubbleToolkit.transform.parent = GameObject.Find("UI").transform;
    18.         bubbleToolkit.layer = LayerMask.NameToLayer("UI");
    19.        
    20.         _toolkit = bubbleToolkit.AddComponent<UIToolkit>();
    21.         _toolkit.material = bubbleMaterial;
    22.         _toolkit.texturePackerConfigName = "Bubble";
    23.         _toolkit.layer = 0;
    24.     }
    25.    
    26.     public void DisplayWellDone() {
    27.         InitToolkit();
    28.     }
    29.    
    30.     public void DisplayWhoops() {
    31.         InitToolkit();
    32.        
    33.         UISprite bubble = _toolkit.addSprite("whoops_bubble.png", 0, 0);
    34.         bubble.centerize();
    35.         bubble.positionCenter();
    36.         bubble.scaleFromTo(1.0f, Vector3.zero, Vector3.one, Easing.Linear.easeIn);
    37.     }
    38.    
    39. }
    40.  
    Any ideas?
  19. adam718

    adam718

    Member

    Joined:
    Mar 11, 2012
    Messages:
    58
    Hi!
    I am from asia and I try to implement cjk font in uitoolkit.
    I made NanumGothicExtraBold resource as in http://forum.unity3d.com/threads/87...-Solution-Ready-for-Use...and-it-s-free/page4

    But following error occurred when it runs.

    IndexOutOfRangeException: Array index is out of range.
    UIText.loadConfigfile (System.String filename) (at Assets/Plugins/UIToolkit/UIElements/UIText.cs:135)
    UIText..ctor (.UIToolkit manager, System.String fontFilename, System.String textureFilename) (at Assets/Plugins/UIToolkit/UIElements/UIText.cs:86)
    UIText..ctor (System.String fontFilename, System.String textureFilename)
    OutlineTextManager.Start () (at Assets/_Test/OutlineTextManager.cs:22)

    Doesn't it support unicode?
    Attached file is what I made for cjk font in texturepacker.
    Help me?

    Thank you,
    Regards,
    Adam.

    Attached Files:

    Last edited: Apr 3, 2012
  20. 10001110101

    10001110101

    Member

    Joined:
    Jan 19, 2012
    Messages:
    9
    Hey guys, Can someone take a look at the Joystick code? I think it's faulty.
  21. adam718

    adam718

    Member

    Joined:
    Mar 11, 2012
    Messages:
    58
    HI!
    I made BMFont(4096*4096) for asian font.
    But when I run it in Android, font doesn't work correctly.
    when BMFont size is 2048*2048, it works well.
    But in case of only 4096*4096 texture, it works wrong.
    Could you tell me what's wrong with me?

    $SC20120405-005312.jpg

    Thank you,
    Adam
  22. gunga

    gunga

    New Member

    Joined:
    Jan 2, 2012
    Messages:
    170
    +1

    They UIjoystick isn't working properly. On the old package download (march 2011) from Github, if you put your finger on the joystick it moves to a position to the right of your finger.

    Upgraded to the latest version and I can place a nice even touch rectangle with the joystick central in that rectangle. I've had to use the whole left side of the screen for the left joystick all the right side for the right joystick which isn't ideal and messes with other buttons.

    On another note. Is there a way to position a graphic, without it being a button? UISprite?

    Thanks
  23. bitomule

    bitomule

    Member

    Joined:
    Oct 27, 2008
    Messages:
    173
    Any Idea of how can I work with another Atlas for iPad retina? I've UIToolkit working on iPhone and iPhone retina but now I need to add iPad retina images.
  24. pweeks

    pweeks

    New Member

    Joined:
    Mar 29, 2011
    Messages:
    87
    in lieu of all these different texture resolutions, do we have access to the UI camera possibly, maybe change viewport settings or something? also how would you handle something like a "panning story" like in "where's my water"...
  25. 10001110101

    10001110101

    Member

    Joined:
    Jan 19, 2012
    Messages:
    9
    So did you get it working?

  26. timshaya

    timshaya

    New Member

    Joined:
    Apr 5, 2012
    Messages:
    8
    Hi Glyphed,

    Did you ever find a solution to this problem? I'm having a similar issue.

    I get zero errors in the Console when I run the project in the Game view but the text won't show up.

    I used the Gotham Light open type font with AngelCode's BMFont on PC (for anti-aliasing support) to create the .fnt .png Texture Packer to generate the JSON .txt for the texture atlas. I'm developing on Mac for iOS.

    Here's a link to the project as a .unitypackage. I'm stumped.

    Can someone take a look please? Thanks very much in advance.
  27. pweeks

    pweeks

    New Member

    Joined:
    Mar 29, 2011
    Messages:
    87
    have you tried hiero instead? i thought i've read that bmfont has some issues with uitoolkit or vice versa
  28. adam718

    adam718

    Member

    Joined:
    Mar 11, 2012
    Messages:
    58
    Hi! prime32.

    Does UIToolkit support BMFont Multiple textures?

    For the fist I used 4096*4096 texture for asian font.
    But in Android tab, device doesn't support 4096*4096 texture.

    $SC20120405-005312.jpg
    So I want to use multiple textures for an asian font.

    Could you help me with my problem?

    Thank you,
    Best Regards,
    Adam.
  29. pweeks

    pweeks

    New Member

    Joined:
    Mar 29, 2011
    Messages:
    87
    for the panning is moving the UICamera sufficient?

    create a "story board" that is taller and wider then visible, start the camera at whatever the start point is (16:9 in the editor seems to be 502,-288,-10), and then just move the xy of the UICamera to pan around the story board? How do you control the size of the viewport? for example an artist creates 2880x1920 for 9 panels of 960x640, so i want the camera to pan around these 9 panels and i want it to work on all resolutions...can UIToolkit handle this?
  30. timshaya

    timshaya

    New Member

    Joined:
    Apr 5, 2012
    Messages:
    8
    @pweeks - Just tried Hiero, but same problem happening. Here's the .unitypackage with Hiero .fnt's textures.

    I suspect that something is getting screwed up between Hiero and the free version of Texture Packer. Since I'm getting no errors in the Console and no fonts on screen, I'm guessing somehow the JSON file is pointing to the wrong location. Not sure why and it's just a guess for now... If anyone has time, please take a look at the .unitypackage link above.
  31. timshaya

    timshaya

    New Member

    Joined:
    Apr 5, 2012
    Messages:
    8

    Finally got this working w/ 2 UIToolkit instances under a UI instance in the Hierarchy. Here's a working .unitypackage link in case it helps anyone with a similar problem.

    Code (csharp):
    1.  
    2. /*
    3. this gave me NO ERRORS in Console BUT fonts didn't show up in Game panel
    4. */
    5.  
    6. //var text = new UIText( textToolkit2, "gunplayDemoSheet", "gunplay.png" );
    7. //UIText(obj, "name_of_texture_in_Resources_folder", 'line 3 in .fnt file')
    8.      
    9. /*
    10. The below code worked for me. Set Game panel to iPhone 4G Tall (640x960) for the "2x" png.
    11. */
    12.  
    13. //UIText(obj, "name of .fnt file created by Hiero", 'name of png created by Hiero')
    14. var text = new UIText( textToolkit2, "gunplay", "gunplay2x.png" );
    15.  
  32. pweeks

    pweeks

    New Member

    Joined:
    Mar 29, 2011
    Messages:
    87
    "failed importing package...."
  33. jason0202

    jason0202

    New Member

    Joined:
    Feb 15, 2012
    Messages:
    13
    Hi guys,

    I'm new to unity and try to use uitoolkit in my current project.

    I'm working on to create Unity web games. But the problem is when i set my game to fullscreen,
    all uitoolkit buttons loses focus (click area with wrong position).

    Any solution to fix that? Thanks
  34. jason0202

    jason0202

    New Member

    Joined:
    Feb 15, 2012
    Messages:
    13
    i think he is posting iOS project (which made in mac). So, u will failed to open it using pc.
  35. timshaya

    timshaya

    New Member

    Joined:
    Apr 5, 2012
    Messages:
    8
    I'm guessing this might have to do with the missing iOS SDK if you're on Windows.

    Try this version - Build Settings > Switch Platform set to Android (still developed on Mac OS X):
    http://minus.com/mKy81gSDS/5f

    This is the latest iOS version:
    http://minus.com/mKy81gSDS/4f

    I cleaned up the JSON file for the font a bit, so there's no bleeding/cutoff in the text.

    The iOS link imported ok for me and 1 other person with the same Mac set up as me. We're both on Mac OS X 10.6.8 with a Trial version of Unity Pro 3.5.0f5 (Pro, Team, iOS Pro, Android Pro).

    If you're on Windows, please test the Android link and let me know if that works.
    Last edited: Apr 9, 2012
  36. pweeks

    pweeks

    New Member

    Joined:
    Mar 29, 2011
    Messages:
    87
    nah...maybe a 3.5 vs 3.4 issue...i can open ios projects on pc...just can do a build
  37. pweeks

    pweeks

    New Member

    Joined:
    Mar 29, 2011
    Messages:
    87
    i'll try both android and on the mac today
  38. Essential

    Essential

    Member

    Joined:
    Sep 8, 2011
    Messages:
    240
    Pardon my ignorance but how am I supposed to download this? I went to the "Downloads" tab on GitHub and downloaded the .unitypackage, which I started using fine but I just noticed it's dated November, and I can see files on the GitHub page were updated more recently than that. Did I download the right thing?
  39. prime31

    prime31

    Member

    Joined:
    Oct 9, 2008
    Messages:
    6,424
  40. Essential

    Essential

    Member

    Joined:
    Sep 8, 2011
    Messages:
    240
    Hmm… Don't seem to have that clone button on my screen.

    I downloaded the zip but then I have all these .meta files I have to delete.
  41. prime31

    prime31

    Member

    Joined:
    Oct 9, 2008
    Messages:
    6,424
    @essential, the meta files are not optional if you use version control. They are how Unity handles it's database for VC.
  42. Essential

    Essential

    Member

    Joined:
    Sep 8, 2011
    Messages:
    240
    Well it has nothing to handle anymore. Pow! Hahaha!



    …I joke when I make mistakes.
  43. Tjitse

    Tjitse

    New Member

    Joined:
    Apr 9, 2012
    Messages:
    10
  44. Essential

    Essential

    Member

    Joined:
    Sep 8, 2011
    Messages:
    240
    Following javascript code displays the button but gives "Object reference not set to an instance of an object" on the second line. Anyone know what I'm doing wrong?

    Code (csharp):
    1. var playButton : UIButton;
    2.  
    3. function Start () {
    4.     playButton.create("playUp.png", "playDown.png", 0, 0);
    5.     IPositionablePositioningExtensions.positionFromTopRight(playButton, 0.3, 0.3);
    6. }
    Specific error:
  45. jason0202

    jason0202

    New Member

    Joined:
    Feb 15, 2012
    Messages:
    13
    Hi guys,

    I'm new to unity and try to use uitoolkit in my current project.

    I'm working on to create Unity web games. But the problem is when i set my game to fullscreen,
    all uitoolkit buttons loses focus (click area with wrong position).

    Any solution to fix that? Thanks
  46. laserlars

    laserlars

    Member

    Joined:
    Nov 17, 2011
    Messages:
    254
    Did you figure this one out? Need to do the same. Anyone got any pointers on how to achieve this?
  47. pweeks

    pweeks

    New Member

    Joined:
    Mar 29, 2011
    Messages:
    87
    couldnt you make the "small" atlas 1024x1024 and the "large" 2048x2048? that would cover all platforms no?
  48. numberkruncher

    numberkruncher

    Member

    Joined:
    Feb 18, 2012
    Messages:
    838
    What about creating a separate toolkit and switch between which toolkit you use depending upon platform? You could destroy the one that you do not need right at the start.
  49. timshaya

    timshaya

    New Member

    Joined:
    Apr 5, 2012
    Messages:
    8
    I'm not a Unity or UIToolkit expert but in general IPositionablePositioningExtensions looks like an Interface (conventional to name interfaces starting w/ a capital "I"). So it's not an instance of a Class or a Static class/method use case. When you try to call the positionFromTopRight() method on the Interface it doesn't know what to do because it's job is to merely define the method's signature ("public function positionFromTopRight(var1, var2, var3)" part), not it's implementation (the actual code inside the method that does stuff). Interfaces are used to facilitate code reuse flexibility (for more details, look up Polymorphism).

    Check out the MultipleAtlasManager.cs example from the Demo files:
    Code (csharp):
    1.  
    2.  
    3. //link this to an UIToolkit instance via the Inspector like in MultipleAtlases GameObject in the Hierarchy
    4. public UIToolkit buttonToolkit;
    5. ...
    6. var playButton = UIButton.create( buttonToolkit, "optionsUp.png", "optionsDown.png", 0, 0 );
    7. playButton.positionFromBottomRight( .2f, .02f );
    8.  
    Last edited: Apr 13, 2012
  50. laserlars

    laserlars

    Member

    Joined:
    Nov 17, 2011
    Messages:
    254
    Thanks pweeks and numberkruncher. I followed pweeks´ suggestion, just scale down 50% when running on 3GS.
    It may not be optimal, but 3GS is about to hit its 3 years and it´s not my priority number one.

    Will work great on iP4 and up.