跑马灯效果在移动客户端中多用于“公告”、“消息”等功能的展示,本次demo以一种简易的实现方法(UILabel配合timer控制label位置变化)实现了该需求。
主要实现方法如下:
- (void)setUpView {
[selfaddSubview:self.marqueeLabel];
self.marqueeLabel.sd_layout.leftSpaceToView(self,self.frame.size.width).centerYEqualToView(self).heightIs(20);//UI布局----借助SDAutoLayout框架
//启动NSTimer定时器来改变label的位置
self.timer= [NSTimerscheduledTimerWithTimeInterval:0.01
target:selfselector:@selector(changePosition)
userInfo:nilrepeats:YES];
}
- (void)setMarqueeText:(NSString*)marqueeText {
self.marqueeLabel.text= marqueeText;// 从控制器获取文本
}
- (void) changePosition
{
CGPointcurPosition =self.marqueeLabel.center;
//当curPos的x坐标已经超过了屏幕的宽度
if(curPosition.x<-self.marqueeLabel.width/2)
{
//控制label再次从屏幕左侧开始移动
self.marqueeLabel.center=CGPointMake(self.frame.size.width+self.marqueeLabel.width/2,20);
}
else
{
//通过修改iv的center属性来改变iv控件的位置
self.marqueeLabel.center=CGPointMake(curPosition.x-0.5,20);
}
//其实label的整个移动都是靠label.center来去设置的
}
效果如图:
附带GitHub地址:https://github.com/FantasyWanH/Marquee
demo中包含了SDAutoLayout第三方库