蘋果跑馬燈怎么設置(怎么在iOS中實現一個跑馬燈效果)

實現方法

1、首先我們從這個圖片里面能聯想到如果實現這個效果必然需要使用到動畫,或者還有有用scrollView的思路,這里我是用的動畫的方式實現的。

2、.h文件

自定義一個繼承UIView的LGJAutoRunLabel類,在.h文件中:

@classLGJAutoRunLabel;typedefNS_ENUM(NSInteger,RunDirectionType){LeftType=0,RightType=1,};@protocolLGJAutoRunLabelDelegate<NSObject>@optional-(void)operateLabel:(LGJAutoRunLabel*)autoLabelanimationDidStopFinished:(BOOL)finished;@end@interfaceLGJAutoRunLabel:UIView@property(nonatomic,weak)id<LGJAutoRunLabelDelegate>delegate;@property(nonatomic,assign)CGFloatspeed;@property(nonatomic,assign)RunDirectionTypedirectionType;-(void)addContentView:(UIView*)view;-(void)startAnimation;-(void)stopAnimation;

定義一個NS_ENUM用來判斷自動滾動的方向,分別是左和右,聲明一個可選類型的協議,用來在controller中調用并對autoLabel進行操作。聲明對外的屬性和方法。這里一目了然,主要的實現思路都集中在.m文件中。

3、.m文件

聲明“私有”變量和屬性:

@interfaceLGJAutoRunLabel()<CAAnimationDelegate>{CGFloat_width;CGFloat_height;CGFloat_animationViewWidth;CGFloat_animationViewHeight;BOOL_stoped;UIView*_contentView;//滾動內容視圖}@property(nonatomic,strong)UIView*animationView;//放置滾動內容視圖@end

初始化方法:

-(instancetype)initWithFrame:(CGRect)frame{if(self==[superinitWithFrame:frame]){_width=frame.size.width;_height=frame.size.height;self.speed=1.0f;self.directionType=LeftType;self.layer.masksToBounds=YES;self.animationView=[[UIViewalloc]initWithFrame:CGRectMake(_width,0,_width,_height)];[selfaddSubview:self.animationView];}returnself;}

將滾動內容視圖contentView添加到動畫視圖animationView上:

-(void)addContentView:(UIView*)view{[_contentViewremoveFromSuperview];view.frame=view.bounds;_contentView=view;self.animationView.frame=view.bounds;[self.animationViewaddSubview:_contentView];_animationViewWidth=self.animationView.frame.size.width;_animationViewHeight=self.animationView.frame.size.height;}

讓animationView上的contentView自動滾動起來的主要方法在這兒,重點來了,就是這個- (void)startAnimation方法,看一下這個方法里面是怎么樣實現的:

-(void)startAnimation{[self.animationView.layerremoveAnimationForKey:@"animationViewPosition"];_stoped=NO;CGPointpointRightCenter=CGPointMake(_width+_animationViewWidth/2.f,_animationViewHeight/2.f);CGPointpointLeftCenter=CGPointMake(-_animationViewWidth/2,_animationViewHeight/2.f);CGPointfromPoint=self.directionType==LeftType?pointRightCenter:pointLeftCenter;CGPointtoPoint=self.directionType==LeftType?pointLeftCenter:pointRightCenter;self.animationView.center=fromPoint;UIBezierPath*movePath=[UIBezierPathbezierPath];[movePathmoveToPoint:fromPoint];[movePathaddLineToPoint:toPoint];CAKeyframeAnimation*moveAnimation=[CAKeyframeAnimationanimationWithKeyPath:@"position"];moveAnimation.path=movePath.CGPath;moveAnimation.removedOnCompletion=YES;moveAnimation.duration=_animationViewWidth/30.f*(1/self.speed);moveAnimation.delegate=self;[self.animationView.layeraddAnimation:moveAnimationforKey:@"animationViewPosition"];}

↘?首先先把animationView.layer上的動畫移除掉,接下來就是要找到animationView\contentView的pointCenter這里把這個中點當做是animationView或者是contentView都行,因為這兩個視圖的frame是相等的,這步找左右中點的意義在于,完全顯示出文字內容,因為可能會遇到那種比如文字太長了,view長度不夠,不能完全顯示出來文字的全部內容, 這里我們找到中點,也就相當于確定了內容視圖要滑動的范圍了,接下來根據起始方向的枚舉值設置fromPoint和toPoint這里我們默認是從右向左滾動的。這里我們做動畫設置,用到了貝塞爾曲線,我們設置UIBezierPath的起始位置就是fromPoint也就是屏幕右方(我們看不見)self.animationView.center。終止位置是屏幕左方toPoint此時animationView滾動的起始位置的首和終止位置的尾的距離正好是屏幕的寬度。這里我們使用CAKeyframeAnimation關鍵幀動畫,moveAnimation.path = movePath.CGPath; ,moveAnimation.removedOnCompletion = YES;動畫完成后就將動畫移除,不保留最終的狀態。 [self.animationView.layer addAnimation:moveAnimation forKey:@"animationViewPosition"];將動畫添加到animationView.layer上。

(這段是對上面代碼的解釋)

-------------------分割線-------------------

接下來的這個就是代理方法的實現了,當動畫完成后悔調用LGJAutoRunLabelDelegate我們自定義的delegate方法。

-(void)stopAnimation{_stoped=YES;[self.animationView.layerremoveAnimationForKey:@"animationViewPosition"];}-(void)animationDidStop:(CAAnimation*)animfinished:(BOOL)flag{if(self.delegate&&[self.delegaterespondsToSelector:@selector(operateLabel:animationDidStopFinished:)]){[self.delegateoperateLabel:selfanimationDidStopFinished:flag];}if(flag&&!_stoped){[selfstartAnimation];}}

4、在controller中使用方法

主要的方法就是聲明LGJAutoRunLabel實例,將代理設為自身,聲明directionType默認為Left,在runLabel上創建label也就是我們看到的文字。其余方法一目了然了。

//MARK:-CreateAutoRunLabel-(void)createAutoRunLabel{LGJAutoRunLabel*runLabel=[[LGJAutoRunLabelalloc]initWithFrame:CGRectMake(0,100,kWidth,50)];runLabel.delegate=self;runLabel.directionType=LeftType;[self.viewaddSubview:runLabel];[runLabeladdContentView:[selfcreateLabelWithText:@"繁華聲遁入空門折煞了夢偏冷輾轉一生情債又幾如你默認生死枯等枯等一圈又一圈的浮圖塔斷了幾層斷了誰的痛直奔一盞殘燈傾塌的山門容我再等歷史轉身等酒香醇等你彈一曲古箏"textColor:[selfrandomColor]labelFont:[UIFontsystemFontOfSize:14]]];[runLabelstartAnimation];}-(UILabel*)createLabelWithText:(NSString*)texttextColor:(UIColor*)textColorlabelFont:(UIFont*)font{NSString*string=[NSStringstringWithFormat:@"%@",text];CGFloatwidth=[UILabelgetWidthByTitle:stringfont:font];UILabel*label=[[UILabelalloc]initWithFrame:CGRectMake(0,0,width,50)];label.font=font;label.text=string;label.textColor=textColor;returnlabel;}-(UIColor*)randomColor{return[UIColorcolorWithRed:[selfrandomValue]green:[selfrandomValue]blue:[selfrandomValue]alpha:1];}-(CGFloat)randomValue{returnarc4random()%255/255.0f;}

上述內容就是怎么在iOS中實現一個跑馬燈效果,你們學到知識或技能了嗎?如果還想學到更多技能或者豐富自己的知識儲備,歡迎關注本站行業資訊頻道。