进度条 和 滑条

进度条 和 滑条_第1张图片

我们要实现上面图片的效果,在滑动条滑动改变的同时,进度条也跟随着改变。

在 ViewController.h里面声明:

#import@interface ViewController : UIViewController{

//进度条对象

//一般用来表示下载或视频播放的进度

UIProgressView *_progressView;

//滑动条的定义

//一般用来进行调整音乐的音量等

UISlider *_slider;

}

//定义一个进度条属性

@property(retain,nonatomic) UIProgressView * pView;

//定义滑动条属性

@property(retain,nonatomic) UISlider * slider;

@end

在ViewController.m里面去实现:


#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

@synthesize slider=_slider;

@synthesize pView=_progressView;

- (void)viewDidLoad {

[super viewDidLoad];

// Do any additional setup after loading the view, typically from a nib.

//进度条的创建

_progressView =[[UIProgressView alloc]init];

//进度条的位置大小设置

//进度条的高度是不可以变化的,这里的40是不起任何作用的系统默认

_progressView.frame=CGRectMake(10, 100, 300, 140);

//甚至进度条的风格颜色值,默认是蓝色的

_progressView.progressTintColor=[UIColor redColor];

//表示进度条未完成的,剩余的轨迹颜色,默认是灰色

_progressView.trackTintColor =[UIColor blueColor];

//设置进度条的进度值

//范围从0~1,最小值为0,最大值为1.

//0.8-->进度的80%

_progressView.progress=0.3;

//设置进度条的风格特征

//    _progressView.progressViewStyle=UIProgressViewStyleBar;

_progressView.progressViewStyle=UIProgressViewStyleDefault;

[self.view addSubview:_progressView];

//创建滑动条对象

_slider = [[UISlider alloc]init];

//位置设置,高度不可变更,40写的不起作用,系统默认

_slider.frame =CGRectMake(10, 200, 300, 40);

//设置滑动条最大值

_slider.maximumValue=100;

//设置滑动条的最小值,可以为负值

_slider.minimumValue=0;

//设置滑动条的滑块位置float值

_slider.value=30;

//左侧滑条背景颜色

_slider.minimumTrackTintColor=[UIColor redColor];

//右侧滑条背景颜色

_slider.maximumTrackTintColor=[UIColor blueColor];

//设置滑块的颜色

_slider.thumbTintColor=[UIColor blackColor];

//对滑动条添加事件函数

[_slider addTarget:self action:@selector(pressSlider) forControlEvents:UIControlEventValueChanged];

[self.view addSubview:_slider];

}

- (void) pressSlider{

NSLog(@"value=%f",_slider.value);

_progressView.progress=(_slider.value-_slider.minimumValue)/(_slider.maximumValue-

_slider.minimumValue);

}

- (void)didReceiveMemoryWarning {

[super didReceiveMemoryWarning];

// Dispose of any resources that can be recreated.

}

@end


//  关于改变UIProgressView的宽、高以及两端弧度


1.self.progressView = [[UIProgressView alloc] initWithProgressViewStyle:UIProgressViewStyleDefault];//这里是设定progressView的模式为默认模式

2.self.progressView.frame = CGRectMake(16, CGRectGetMaxY(label1.frame) + 15, SCREEN_WIDTH - 32 - image3.size.width - 25, 8);

3. self.progressView.progressTintColor=COLOR_THEME;//设定progressView的显示颜色

4. CGAffineTransform transform = CGAffineTransformMakeScale(1.0f, 2.0f);

5.self.progressView.transform = transform;//设定宽高

6.self.progressView.trackImage = image4;

7. self.progressView.contentMode = UIViewContentModeScaleAspectFill;

//设定两端弧度

8.self.progressView.layer.cornerRadius = 1.0;

9.self.progressView.layer.masksToBounds = YES;

//设定progressView的现实进度(一般情况下可以从后台获取到这个数字)

10. [self.progressView setProgress:0.70 animated:YES];

11.[self.view addSubview:self.progressView];

你可能感兴趣的:(进度条 和 滑条)