animated "crawling text" on iPhone

Question

Does anyone know how to create a "text crawl" like that shown at the bottom of the ESPN ScoreCenter app for the iphone?

Basically, there is a small bar of text at the bottom of the screen and the text is animated so that it moves slowly from right to left across the screen.

Can anyone point me to some source code that does something similar? Is it simply a UIWebView?

I've tried to google this, but to no avail.

Thanks to anyone who can point in the right direction!

Answer 1

Have you looked at animations in the documentation? This could be solved in a number of ways. If you created this as a UILabel, you could simply move it in an animation (CoreAnimation) using something similar to the following:

_label.frame = ???   // set it to the origin (right edge) 

[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:6.0];   // 6 seconds, adjust
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];

_label.frame = ???  // set it to the destination (left edge)

[UIView commitAnimations];

Answer 2

I'd recommend creating a UIView subclass. In your init method, set self.clipsToBounds=YES and add two UILabels, both with the same text (whatever you want to scroll). The two are so that you can seamlessly animate them -- put one immediately to the right of the other so that, when they scroll, it looks like the message repeats. As soon as the label scrolls all the way to the left, move it to the right of the other one. This will give you the illusion of seamless scrolling.

You can then use [UIView beginAnimations:] etc to setup the animations, and [UIView setAnimationDelegate:self]; [UIView setAnimationDidStopSelector:@selector(animationDone)] to receive the messages that the animation ended (so that you can move the view over). Just make sure you create the method referenced.

You could also do this with an NSArray of UILabels to display multiple distinct messages, without adding a whole lot of complexity.