Hello Guest

Author Topic: How can i create HUD movement buttons?  (Read 8015 times)

Rukasu

  • Newbie
  • *
  • Posts: 7
    • View Profile
How can i create HUD movement buttons?
« on: July 19, 2013, 02:55:39 am »
Hey guys, i am really new to Unity and 2D Toolkit as well.
I have read "all" the 2.1/2.0 documentation.
I'm making a 2D Platformer game for mobile devices, and i already have all the animations of my Character working.
I'm using tk2dcamera and a resolution of 800x480 (landscape).
I'm about to start the movement of my character, but i'm a little lost in this part... How can i add movement buttons (an arrow and a button to jump, for example) to my game?
Is this just a sprite like any other sprite in the scene? If so, how can i detect that i pressed the button to jump?
Or should i use 2D Tookit UI to create these buttons and use the Events to track what button do i pressed?
And sorry about my english, it's not my native language.
Thanks.

gary-unikronsoftware

  • 2D Toolkit
  • Jr. Member
  • *
  • Posts: 74
    • View Profile
Re: How can i create HUD movement buttons?
« Reply #1 on: July 19, 2013, 09:59:05 am »
Hi Rukasu,

You can do it either way, just by using a regular sprite and writing behaviour code for it, or by using a Tk2d UIItem button.  However, by using the button you can easily attach your own sprite to it, PLUS you get all of the button's in-built functionality for detecting presses and sending messages to other parts of the game, so a lot of the 'hard work' is already done for you.

In the tk2d toolkit 2.1 update (coming soon), it makes it even easier to define button behaviour.

Hope this helps.

Rukasu

  • Newbie
  • *
  • Posts: 7
    • View Profile
Re: How can i create HUD movement buttons?
« Reply #2 on: July 20, 2013, 02:11:41 am »
Thanks for the reply  ;D
Just one more question, i have downloaded 2D Toolkit from Asset Store, am i using the latest version available (2.1 beta) ?

Rukasu

  • Newbie
  • *
  • Posts: 7
    • View Profile
Re: How can i create HUD movement buttons?
« Reply #3 on: July 20, 2013, 06:55:10 am »
Hey, i am creating an tk2dUiItem and puting inside of an Empty Game Object (just to keep things organized), then i added a sprite to this tk2dUiItem, but i am a little lost here.
What do i have to do now?
Where do i have to add a new script?
I'm reading this page http://www.unikronsoftware.com/2dtoolkit/docs/2.00/ui/system.html but it doesn't tell me how or where do i have to create the scripts...
Is there a more complete example, i mean, step by step?
And do i need create a tk2dUiManager object in order to tk2dUiItem work?

gary-unikronsoftware

  • 2D Toolkit
  • Jr. Member
  • *
  • Posts: 74
    • View Profile
Re: How can i create HUD movement buttons?
« Reply #4 on: July 20, 2013, 09:20:43 am »
Hi,

Yes you will need a UIManager in order for the tk2d buttons to work: In the hierarchy window select 'Create > tk2d > UI Manager'.  Once it's created, select it in the hierarchy window then drag your scene camera onto the 'UI Camera' slot in the Inspector window.

tk2d provides a number of different button and UI prefabs which can be found in 'Project > TK2DROOT > tk2dUI_demo > ControlPrefabs'.  Drag the BasicButton prefab into your hierarchy window and select it.  If you expand the button object, the ButtonGraphic will let you select one of the existing sprites from the default UIDemoSpriteCollection, or you can use a sprite from another collection.  You may need to scale the size of the button sprite up depending on your camera settings.  If you do change the scale of the button graphic, remember to click on 'Fit' in 'Tk 2d UIItem > Collider > Automatic Fit' to ensure the collider is the same size as your button.

Finally, you can drag a game object that contains a script onto 'Send Message > Target', which will then allow you to select which functions are called depending on the state of the button e.g. 'On Click', On Up' etc.  e.g. If you have an arrow pointing right as your button graphic, you might link this to a function 'MoveRight' when the button is clicked.

I hope this clarifies things for you.

Thanks.


Rukasu

  • Newbie
  • *
  • Posts: 7
    • View Profile
Re: How can i create HUD movement buttons?
« Reply #5 on: July 22, 2013, 09:05:15 pm »
Hello again.
I still can't get it to work.
I have added a UiManager, and i have dragged my tk2dcamera in the "Camera Slot" in the inspector window. My camera is tagged as "Main Camera".
I dragged the "BasicButton" from "ControlPrefabs" to my hierarchy (i call it RightButton), i have changed the sprite, resized the sprite and after that i clicked in the "Fit" button, so that the BoxCollider fits in the new sprite.
I have a GameObject, it is a "Sprite With Animator" (AnimatedSprite) and in this object i have attached a C# script.
This is my script:
Code: [Select]
public class GeorgeController : MonoBehaviour
{   
    private tk2dSpriteAnimator animation;   
    private string lastAnimation = "";   
       
    void Start()
    {
        this.animation = GetComponent<tk2dSpriteAnimator>();
        lastAnimation = animation.CurrentClip.name;       
    }
   
    void Update()
    {

    }

    void MoveRight()
    {       
        lastAnimation = animation.CurrentClip.name;
        animation.Play("WalkRight");
    }
}
Then in my "Right Button" object i dragged my GameObject (AnimatedSprite) in the Send Message > Target.
Then, in the OnDown event  i have selected the "MoveRight" function from the DropDownList (i'm using 2D Toolkit 2.1 beta 3).
But this still doesn't work, i don't know what i am missing.

unikronsoftware

  • Administrator
  • Hero Member
  • *****
  • Posts: 9709
    • View Profile
Re: How can i create HUD movement buttons?
« Reply #6 on: July 22, 2013, 10:12:34 pm »
1. Are you getting any feedback while clicking the button? i.e. Do you see the button scale / do you hear the click?
2. Are raycasts turned off somehow? What is the RaycastLayerMask set to on the UIManager? Also, in Edit > Project Settings > Physics Settings - is Raycasts Hit Triggers turned off?
3. Does the ui demo work for you?
4. Is the BasicButton object too close to the camera? Try pushing it back a bit.

Rukasu

  • Newbie
  • *
  • Posts: 7
    • View Profile
Re: How can i create HUD movement buttons?
« Reply #7 on: July 22, 2013, 10:39:42 pm »
1. I get nothing, i'm using mouse to test, is that ok? I have tested in my Android Device but it won't work either.
2. RaycastLayerMask was set to Everything, but i set to just the layer that my buttons are (Layer HUD) but still don't work.
Raycast Hit Triggers is turned on.
3. The BasicButton don't work too.
4. I tried changing Z from 0 to 2 and -2, no feedback of the button.

unikronsoftware

  • Administrator
  • Hero Member
  • *****
  • Posts: 9709
    • View Profile
Re: How can i create HUD movement buttons?
« Reply #8 on: July 22, 2013, 11:00:17 pm »
Post a screenshot of your button selected in scene view. Or send me a repro sample to support at unikronsoftware.com. It must be something you're missing.

Rukasu

  • Newbie
  • *
  • Posts: 7
    • View Profile
Re: How can i create HUD movement buttons?
« Reply #9 on: July 22, 2013, 11:38:05 pm »
I started a new project, and imported the 2D Toolkit.
I let default tk2dcamera settings (Orthographic, 20 Pixels Per Meter).
Then i tested and it worked!
I think i will try using these settings, if i had more questions i will post them here.
The only thing is that my sprites are too tiny (1:1) in my Viewport, is there a problem increase the value of Pixels Per Meter?
Thanks for the help.

unikronsoftware

  • Administrator
  • Hero Member
  • *****
  • Posts: 9709
    • View Profile
Re: How can i create HUD movement buttons?
« Reply #10 on: July 23, 2013, 12:21:37 am »
If you increase pixels per meter, you need to change the sprite collection to pixels per meter as well. The sprites are set up to work with ortho size 1 by default as mentioned in the documentation. Use that size and you won't have to mess with any sprite / object / etc. sizes.