Home > 移动互联, 语言编程 > iOS开发之跑马灯滚动条的两种方法与实现

iOS开发之跑马灯滚动条的两种方法与实现

跑马灯效果的滚动条,一般出现在ios应用的底部。用于显示动态变化的信息或内容较长的信息,在个类应用中使用广泛
以下两种可用的跑马灯滚动MarqueeBar的实现。

1.直接在ViewController中实现对UIView的位置定时移动来实现,以下代码直接加入到ViewController中,在viewWillAppear中调用loadView即可。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
- (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:CGRectMake(0, 347, 320, 20)]autorelease];
    [viewMarqueeBar setBackgroundColor:[UIColor darkGrayColor]];
 
    //滚动容器,显示滚动范围
    UIView *viewMarqueeContainer = [[[UIView alloc]initWithFrame:CGRectMake(320, 3, 360, 14)]autorelease];
    [viewMarqueeContainer setBackgroundColor:[UIColor clearColor]];
    [viewMarqueeContainer setClipsToBounds:YES];
    [viewMarqueeContainer setOpaque:YES];
 
    //内容
    UILabel *lblContent = [[[UILabel alloc] initWithFrame:CGRectMake(0, 0, 50,14)]autorelease];
    [lblContent setText:@"这里是滚动条。。。。。"];
    [lblContent setTextColor:[UIColor whiteColor]];
    [lblContent setBackgroundColor:[UIColor clearColor]];
    [lblContent setFont:[UIFont fontWithName:@"Helvetica" size:12]];
    [lblContent setOpaque:YES];
 
    self.view= viewMarqueeBar;
    self.vMarqueeContainer = viewMarqueeContainer;
 
    [self.view addSubview:viewMarqueeContainer];
 
    [self marqueeView];
}

2.自行定义滚动条控件,让view自己滚动起来,通过不断的相互方法调用实现循环滚动
UIMarqueeBarView.h定义

1
2
3
4
5
6
7
8
9
10
/**
 *UIMarqueeBarView.h
 */
@interface UIMarqueeBarView : UIView
{
}
 
- (void)start;
- (void)stop;
@end

UIMarqueeBarView.m实现

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
/**
 *UIMarqueeBarView.m
 */
 
#import "UIMarqueeBarView.h"
 
@implementation UIMarqueeBarView
 
- (void)dealloc
{
    [super dealloc];
}
 
- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        // Initialization code
		[self setupView];
    }
    return self;
}
 
-(id)initWithCoder:(NSCoder *)aDecoder {
	if( (self = [super initWithCoder:aDecoder]) ) {
		// Initialization code
		[self setupView];
	}
	return self;
}
 
- (void)setupView
{
    [self setBackgroundColor:[UIColor lightGrayColor]];
    [self setClipsToBounds:YES];
    [self setOpaque:YES];
 
    UILabel *lblContent = [[[UILabel alloc] initWithFrame:CGRectMake(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:YES];
 
    [self addSubview:lblContent];
}
 
- (void)start
{
    if (self.viewContainer == NULL) {
        [self setupView];
    }
 
    [self startAnimation];
}
- (void)stop
{
 
}
 
-(void)startAnimation
{
    [UIView beginAnimations:@"MarqueeBarAniamation" context:nil];
    [UIView setAnimationCurve:UIViewAnimationCurveLinear];
    [UIView setAnimationDuration:25];
    [UIView setAnimationDelegate:self];
    [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:viewFrame];
	[self startAnimation];
}
Categories: 移动互联, 语言编程 Tags:
  1. November 18th, 2012 at 17:00 | #1

    很实用。收藏了!

  1. No trackbacks yet.