Tasharen Entertainment Forum

Support => NGUI 3 Support => Topic started by: poolts on October 04, 2014, 07:18:48 AM

Title: How To Make: Tickertape / Scrolling Text
Post by: poolts on October 04, 2014, 07:18:48 AM

I want to make a tickertape effect with nGUI

I've looked through countless posts, looked at the quest log example but I'm still trying to find the best way to make a horizontal scrolling "tickertape" effect.

I just want a piece of text to scroll right to left, clip when it's out of bounds and then carousel back to the right hand side (just like the effect above).

I assume I need a UIScrollView and then move the UILabel inside, but not sure if performance wise this is the best way to do it?

Title: Re: How To Make: Tickertape / Scrolling Text
Post by: ArenMook on October 04, 2014, 08:04:09 AM

Don't need a scroll view. Just have a label and tween its position from right to left using TweenPosition. Set the tween to loop.

Title: Re: How To Make: Tickertape / Scrolling Text
Post by: poolts on October 04, 2014, 09:06:20 AM

Perfect! Thanks!

I'm now trying to work out how to get the label to resize freely and then anchor to the right hand size of the clippable area.

The string length will change, but I want the text to start (anchor) just off the left side of the clippable area. So it seems I can't clamp the content as the string length will change, and I don't want to shrink it, but I can't select resize freely and then anchor the right hand side of the label, to the left hand side of the clippable area.

Title: Re: How To Make: Tickertape / Scrolling Text
Post by: poolts on October 04, 2014, 09:37:29 AM

Worked out that I should pivot the label on it's right hand side to get it to start in the same position (just to the left of the clippable area).

However, last step I'm trying to work out, is how far I should move it along the x axis (on the tween position) as the label size is freely resizable.

Think I'll have to work out the size of the widget, and then add that onto the end of the right side of the clippable area.

Title: Re: How To Make: Tickertape / Scrolling Text
Post by: poolts on October 04, 2014, 09:53:25 AM

Solved it.

1. m_tweenPosition.to.x = m_newsPanel.GetSides(m_newsPanel.cachedTransform)[0].x - m_newsLabel.localSize.x;

I basically added the size of the UILabel to the left hand side of the clippable panel and set that as the TweenPositions to x