Author Topic: NGUI: HUD Text  (Read 34477 times)

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 17
  • -Receive: 138
  • Posts: 14,048
  • Toronto, Canada
    • View Profile
NGUI: HUD Text
« on: July 11, 2012, 01:31:33 PM »
What is it?

In the simplest form, it's like Scrolling Combat Text from World of Warcraft. Numbers pop up, fly up. Unlike SCT, the numbers get automatically added up (for up to one second), and positives and negatives get treated differently, so you can basically show DPS and HPS separately without any additional work on your end.

You can also use it to display text -- such as chat messages -- right above your character's heads. You can even tell messages to stay on the screen for X number of seconds before floating up and fading.

You can (of course) modify the curves for how the messages disappear. This very system is used in Windward.

Examples that come with the package

http://www.tasharen.com/hudtext/ex1/
http://www.tasharen.com/hudtext/ex2/

Video Tutorials

http://www.youtube.com/watch?v=diql3UP1KQM
http://www.youtube.com/watch?v=idVr8-jfdAI (adding unit health bars to go with HUDText)

Usage
  • Attach the HUDText script to a game object underneath your UIRoot and set the font it should use.
  • To make it follow an object drawn with another camera, attach UIFollowTarget to the same object and set its target.
  • From code, use HUDText's Add() function to add new floating text entries.
You can also tweak the splines on the HUDText script, changing the motion of the text as you see fit.

Example Usage
Code: [Select]
HUDText hudText = GetComponent<HUDText>();

// This will show damage of 123 in red
hudText.Add(-123f, Color.red, 0f);

// This will show "Hello World!" and make it stay on the screen for 1 second before moving
hudText.Add("Hello World!", Color.white, 1f);
Have questions? Please ask and I'll improve the documentation accordingly.

Screenshot of it used in Windward

« Last Edit: August 03, 2013, 02:41:08 PM by ArenMook »

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 17
  • -Receive: 138
  • Posts: 14,048
  • Toronto, Canada
    • View Profile
Re: HUD Text Readme.txt
« Reply #1 on: July 12, 2012, 02:26:04 AM »

catacomber

  • Jr. Member
  • **
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 79
  • Games with stories. . .
    • View Profile
    • catacomber.com
Re: NGUI: HUD Text
« Reply #2 on: July 12, 2012, 07:20:55 PM »
Thank you so much for this! The minute I saw it, I scarfed it up. I'm sure I'll have questions but you've given me and many others great support so far with NGUI. This is just what I needed.  :  ) 

 :-*
I love mice!
www.catacomber.com
www.zaristagames.com
itunes.apple.com/us/app/hordeiifaq/id492108317?mt=8

catacomber

  • Jr. Member
  • **
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 79
  • Games with stories. . .
    • View Profile
    • catacomber.com
Re: NGUI: HUD Text
« Reply #3 on: July 14, 2012, 08:58:14 PM »
When I have both NGUI and Hud examples in the same project, I get these compiler errors:

Scripts named 'LookAtTarget.cs' exist in multiple locations (Assets/HUD Text/Examples/Scripts/LookAtTarget.cs). Please rename one of the scripts to a unique name.
Scripts named 'LookAtTarget.cs' exist in multiple locations (Assets/NGUI/Examples/Scripts/Other/LookAtTarget.cs). Please rename one of the scripts to a unique name.

If I rename one of the scripts, I get a new error message:

Assets/NGUI/Examples/Scripts/Other/LookAtTarget.cs(9,14): error CS0101: The namespace `global::' already contains a definition for `LookAtTarget'

What should I do? Thank you in advance. 
I love mice!
www.catacomber.com
www.zaristagames.com
itunes.apple.com/us/app/hordeiifaq/id492108317?mt=8

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 17
  • -Receive: 138
  • Posts: 14,048
  • Toronto, Canada
    • View Profile
Re: NGUI: HUD Text
« Reply #4 on: July 14, 2012, 10:07:46 PM »
Delete LookAtTarget from HUDText (or dont import it). I'll fix it in the next update -- it seems the metadata changed.

catacomber

  • Jr. Member
  • **
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 79
  • Games with stories. . .
    • View Profile
    • catacomber.com
Re: NGUI: HUD Text
« Reply #5 on: July 14, 2012, 10:08:55 PM »
Thank you!!!!   :)  I deleted it. No more errors. I know what it does and if I need to use it hopefully I can juggle things. It's useful for NPC's.  :  )  Especially if they're walking around!
« Last Edit: July 14, 2012, 10:13:46 PM by catacomber »
I love mice!
www.catacomber.com
www.zaristagames.com
itunes.apple.com/us/app/hordeiifaq/id492108317?mt=8

catacomber

  • Jr. Member
  • **
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 79
  • Games with stories. . .
    • View Profile
    • catacomber.com
Re: NGUI: HUD Text
« Reply #6 on: July 14, 2012, 10:22:34 PM »
Oops! Just reopened project and two new errors:

Assets/HUD Text/NGUI/Scripts/Editor/UIWidgetInspector.cs(16,19): error CS0433: The imported type `UIWidget' is defined multiple times
Assets/NGUI/Scripts/Editor/BMFontReader.cs(47,34): error CS0433: The imported type `BMFont' is defined multiple times

Not meaning to be difficult, just letting you know.  :  )  Patiently awaiting what to do. I'm really happy to have this.
« Last Edit: July 14, 2012, 10:26:15 PM by catacomber »
I love mice!
www.catacomber.com
www.zaristagames.com
itunes.apple.com/us/app/hordeiifaq/id492108317?mt=8

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 17
  • -Receive: 138
  • Posts: 14,048
  • Toronto, Canada
    • View Profile
Re: NGUI: HUD Text
« Reply #7 on: July 14, 2012, 10:28:16 PM »
Post only in one place please. I get email notifications from every single post. No need to double them up.

http://www.tasharen.com/forum/index.php?topic=1013.0

oregon_tony

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 1
    • View Profile
Re: NGUI: HUD Text
« Reply #8 on: September 08, 2012, 04:10:24 AM »
How to assign HUD Text to javascript object dynamically created in code?
I do this in my project to create a new game object via code in javascript:

var Zombie:GameObject;
Zombie=Instantiate(createThis[rndNr], transform.position, transform.rotation);

I was trying to do this to assign the script to my Zombie GO, but I get a compile error saying the type "HUDText" isn't found:

   var myHUD : HUDText;   //<< compile error
   Zombie.AddComponent("HUDText");
   myHUD = Zombie.GetComponent("HUDText");
   myHUD.Add(-123f, Color.red, 0f);

Thanks,
Tony

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 17
  • -Receive: 138
  • Posts: 14,048
  • Toronto, Canada
    • View Profile
Re: NGUI: HUD Text
« Reply #9 on: September 08, 2012, 03:05:33 PM »
HUDText scripts would need to go into the Plugins folder. Roughly the same place as NGUI when used with javascript.

nkls

  • Newbie
  • *
  • Thank You
  • -Given: 1
  • -Receive: 0
  • Posts: 28
    • View Profile
Re: NGUI: HUD Text
« Reply #10 on: September 25, 2012, 04:09:26 AM »
Hi.
Bought this extension a couple of days ago, and I really like it. It works great, but I have a question.
Im setting my UIroot by script, to make it support different aspect ratios. Im adding my hud-labels with a reference font, but when i add them by code (score.Add(1500f, Color.green, 0.75f) they dont get the correct scale in my scene. If i add a label with the create widget tool those labels are scaled correctly.
How do I solve this problem?

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 17
  • -Receive: 138
  • Posts: 14,048
  • Toronto, Canada
    • View Profile
Re: NGUI: HUD Text
« Reply #11 on: September 25, 2012, 08:43:45 AM »
What do you set on the UIRoot by script?

nkls

  • Newbie
  • *
  • Thank You
  • -Given: 1
  • -Receive: 0
  • Posts: 28
    • View Profile
Re: NGUI: HUD Text
« Reply #12 on: September 25, 2012, 09:08:46 AM »
I have 3 atlases, SD,HD and SHD. I use my SHD when doing the layout, and my pixel size on that one is 0.5.
I set my Manual height on start by script.

I fixed the problem (temporarily?) by edit this line in the HUDtext script:
float size = font.size * Mathf.Clamp01((time - ent.time) * 4f);

If i divide font.size / 2 everything looks good again.. Is this the right way to go?

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 17
  • -Receive: 138
  • Posts: 14,048
  • Toronto, Canada
    • View Profile
Re: NGUI: HUD Text
« Reply #13 on: September 25, 2012, 09:38:42 AM »
Multiply it by font.atlas.pixelSize instead.

nkls

  • Newbie
  • *
  • Thank You
  • -Given: 1
  • -Receive: 0
  • Posts: 28
    • View Profile
Re: NGUI: HUD Text
« Reply #14 on: September 25, 2012, 10:16:13 AM »
Great, thank you.

steddyman

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 20
    • View Profile
Re: NGUI: HUD Text
« Reply #15 on: September 28, 2012, 09:31:44 AM »
I just bought this component and I am using it with the full version of NGUI (2.2.1).  I am unsure of how to apply this in my context, so would like a bit of help please.

I want to have a score float up above a Star object whenever the user collects them.  The player is moving up the screen rapidly (think doodle jump) and trying to collect stars along the way.  The stars are in the main scene rendered by the main camera.  I have created the following UI hierarchy:

UI Root (2D)
-Camera
--Anchor - Top Left (score labels)
--Anchor - Top Right (high score labels)
--HudText - contains only HudText and UIFollowScripts

In the collision detection script for my player, I am trying to make the HudText appear above the star like this:
Code: [Select]
	if(collision.gameObject.tag=="Star") {
// Get Collect Star script and trigger it
var coll : StarCollected = collision.gameObject.GetComponent(StarCollected);
// Setup Hudtext for collection
follow.target = collision.gameObject.transform;
hudText.Add("100", Color.white, 0.5f);
// And tell the star to collect itself
coll.CollectStar();
}

But nothing is appearing on screen.  I have set the Font for the text in the HudText component.

Am I missing something?  Is this the best way?  Also a bit concerned about if the users collects 2 stars in a row too quickly, what would then happen.

Thanks

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 17
  • -Receive: 138
  • Posts: 14,048
  • Toronto, Canada
    • View Profile
Re: NGUI: HUD Text
« Reply #16 on: September 28, 2012, 11:42:51 AM »
You need multiple HUDTexts for this. Each star would have its own HUDText element. What I do in Windward is have each game object that needs this kind of text instantiate a HUDText prefab object under the HUDRoot and set its follow target to be that object.

steddyman

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 20
    • View Profile
Re: NGUI: HUD Text
« Reply #17 on: September 28, 2012, 02:39:13 PM »
Thanks, that will work.

However, why is this not working at all?  I get nothing on screen for it.  What am I missing?

steddyman

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 20
    • View Profile
Re: NGUI: HUD Text
« Reply #18 on: September 28, 2012, 03:11:32 PM »
Never mind, found it.  Needed to be on a UIAnchor.

steddyman

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 20
    • View Profile
Re: NGUI: HUD Text
« Reply #19 on: September 28, 2012, 03:48:23 PM »
Sorry about this.  Can you post a small sample of the code you have for instantiating the prefab.  I am using the following, however despite the HUDText appearing in the folder and being in the right layer, it doesn't appear.  Even zooming into it in the Editor show it position right but invisible.

Code: [Select]
	// Create a hud text for the score
var hudObj : GameObject;
hudObj = Instantiate(hudTextPrefab, transform.position, Quaternion.identity);
hudObj.transform.parent = hud.transform;
//hudObj.transform.localScale = Vector3.one;
// Get the HudText  and UIFollow components
var hudText : HUDText = hudObj.GetComponent(HUDText);
var follow : UIFollowTarget = hudObj.GetComponent(UIFollowTarget);
// Set the target to the transfor of the star
follow.target=transform;
// Now add the score text
hudText.Add(score.ToString(), Color.white, 0.5f);

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 17
  • -Receive: 138
  • Posts: 14,048
  • Toronto, Canada
    • View Profile
Re: NGUI: HUD Text
« Reply #20 on: September 28, 2012, 09:46:01 PM »
Use NGUITools.AddChild. It properly parents things for you, resets the position/rotation/scale, and sets the correct game object layer.

steddyman

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 20
    • View Profile
Re: NGUI: HUD Text
« Reply #21 on: September 29, 2012, 07:31:49 AM »
Thanks.  Using that method now but still no text appears.

If I pause the game, and use the Widget tool to create a label under the Hud object it appears just fine.  However all the HUDText (Clone) prefabs that appear under that display nothing.

I've tried everything.  Pausing the game and moving the transforms of the HUdText or sub text object that gets greated, enabling and disabling components.  Nothing works.  It only works if I setup a quick test scene and don't spawn anything using prefabs.

As I said, even zooming right in on the editor and there is nothing visible. It's like the text is blank.

I notice that if I pause the game immediately after issueing hudText.Add the little label that gets created under the hudtext is disabled.  I've tried enabling this too and still nothing appears.  Completely lost here.

I've attached a screenshot of what it looks like running.  My other GUI elements work and as stated above manually creating a label also works:
 

steddyman

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 20
    • View Profile
Re: NGUI: HUD Text
« Reply #22 on: September 29, 2012, 07:51:51 AM »
The problem appears to be an issue with the UIFollowTarget script.

If I comment out the line follow.target=transform, then it works but the text just appears in the middle of the screen.

I've check the script picked up the right cameras for MainCamera and GUICamera and it did, so not sure what is going on here.

ArenMook

  • Administrator
  • Hero Member
  • *****
  • Thank You
  • -Given: 17
  • -Receive: 138
  • Posts: 14,048
  • Toronto, Canada
    • View Profile
Re: NGUI: HUD Text
« Reply #23 on: September 29, 2012, 10:53:50 AM »
Where is your HUDText instantiated? Is it under the HUDRoot / UIRoot?

steddyman

  • Newbie
  • *
  • Thank You
  • -Given: 0
  • -Receive: 0
  • Posts: 20
    • View Profile
Re: NGUI: HUD Text
« Reply #24 on: September 29, 2012, 03:01:01 PM »
You can see it in the screenshot above.  It is under the Hud GameObject which is a UIAnchor, which is under the camera which is under the UIRoot.

Like I say, works if I create a label manually and also works if I don't set the follow but just appears in the middle of the screen.