iOS開發之跑馬燈滾動條的兩種方法與實現

跑馬燈效果的滾動條，一般出現在 iOS 應用的底部。用於顯示動態變化的信息或內容較長的信息，在各類應用中使用廣泛。以下兩種可用的跑馬燈滾動 MarqueeBar 的實現。

1. 直接在 ViewController 中實現對 UIView 的位置定時移動來實現，以下代碼直接加入到 ViewController 中，在 viewWillAppear 中調用 loadView 即可。

- (void)marqueeView
{

CGRect frame = self.vMarqueeContainer.frame;
frame.origin.x = frame.origin.x -2;
if(frame.origin.x < -frame.size.width )
{
    frame.origin.x  = 320;
}
self.vMarqueeContainer.frame = frame;

//延時遞歸調用
\[self performSelector:@selector(marqueeView) withObject:nil afterDelay:0.04\];

}

(void)loadView
{
//marqueenbar 背景，位置高度等控制
UIView *viewMarqueeBar = [[[UIView alloc]initWithFrame(0, 347, 320, 20)]autorelease];
[viewMarqueeBar setBackgroundColor:[UIColor darkGrayColor]];

// 滾動容器，顯示滾動範圍
UIView *viewMarqueeContainer = [[[UIView alloc]initWithFrame(320, 3, 360, 14)]autorelease];
[viewMarqueeContainer setBackgroundColor:[UIColor clearColor]];
[viewMarqueeContainer setClipsToBounds];
[viewMarqueeContainer setOpaque];

// 內容
UILabel *lblContent = [[[UILabel alloc] initWithFrame(0, 0, 50,14)]autorelease];
[lblContent setText:@"這裡是滾動條。。。。。"];
[lblContent setTextColor:[UIColor whiteColor]];
[lblContent setBackgroundColor:[UIColor clearColor]];
[lblContent setFont:[UIFont fontWithName:@"Helvetica" size:12]];
[lblContent setOpaque];

self.view= viewMarqueeBar;
self.vMarqueeContainer = viewMarqueeContainer;

[self.view addSubview];

[self marqueeView];
}

2. 自行定義滾動條控件，讓 view 自己滾動起來，通過不斷的相互方法調用實現循環滾動 UIMarqueeBarView.h 定義

/**
*UIMarqueeBarView.h
*/
@interface UIMarqueeBarView : UIView
{
}

(void)start;
(void)stop;
@end

UIMarqueeBarView.m 實現

/**
*UIMarqueeBarView.m
*/

#import "UIMarqueeBarView.h"

@implementation UIMarqueeBarView

(void)dealloc
{
[super dealloc];
}
(id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame];
if (self) {
// Initialization code
[self setupView];
}
return self;
}

-(id)initWithCoder:(NSCoder *)aDecoder {
if( (self = [super initWithCoder]) ) {
// Initialization code
[self setupView];
}
return self;
}

(void)setupView
{
[self setBackgroundColor:[UIColor lightGrayColor]];
[self setClipsToBounds];
[self setOpaque];

UILabel *lblContent = [[[UILabel alloc] initWithFrame(0, 0, 150 ,16)]autorelease];
[lblContent setText:@"這裡是滾動條。。。。。"];
[lblContent setTextColor:[UIColor whiteColor]];
[lblContent setBackgroundColor:[UIColor clearColor]];
[lblContent setFont:[UIFont fontWithName:@"Helvetica" size:14]];
[lblContent setNumberOfLines:1];
[lblContent setOpaque];

[self addSubview];
}
(void)start
{
if (self.viewContainer == NULL) {
[self setupView];
}

[self startAnimation];
}
(void)stop
{

}

-(void)startAnimation
{
[UIView beginAnimations:@"MarqueeBarAniamation" context];
[UIView setAnimationCurve];
[UIView setAnimationDuration:25];
[UIView setAnimationDelegate];
[UIView setAnimationDidStopSelector:@selector(animationDidStop:finished:context:)];

CGRect viewFrame = self.viewContainer.frame;
viewFrame.origin.x = -320;
\[self.viewContainer setFrame:viewFrame\];

\[UIView commitAnimations\];

}

-(void)animationDidStop:(NSString *)animationID finished:(NSNumber *)finished context:(void *)context
{
CGRect viewFrame = self.viewContainer.frame;
viewFrame.origin.x = 320;
[self.viewContainer setFrame];
[self startAnimation];
}