您的位置:首页 > 产品设计 > UI/UE

UISlider

2015-09-15 19:50 585 查看
UISlider 是UI中可以滑动控件,代表着一系列连续的值
一般用来控制 音量
进度 等等
在使用上
和其他UI控件一样

//1.创建对象
UISlider *slider = [[UISlider alloc] initWithFrame:CGRectMake(50, 400, 275, 30)];

//2.配置属性
//(1)设置滑块滑块划过区域颜色
slider.minimumTrackTintColor = [UIColor purpleColor];
//(2)设置滑块未划过区域的颜色
slider.maximumTrackTintColor = [UIColor lightGrayColor];
//(3)添加点击事件
[slider addTarget:self action:@selector(sliderAction:) forControlEvents:UIControlEventValueChanged];
//设置最大值 和 最小值
slider.minimumValue = 0.5;
slider.maximumValue = 2;
//当前值
slider.value = 1;
<span style="color: rgb(1, 1, 1); font-family: 宋体, tahoma, Srial, helvetica, sans-serif; font-size: 14px; line-height: 25px; background-color: rgb(245, 248, 253);">        float value = slider.value;  </span><span style="color: rgb(1, 1, 1); font-family: 宋体, tahoma, Srial, helvetica, sans-serif; font-size: 14px; line-height: 25px; background-color: rgb(245, 248, 253);"> </span><span style="color: rgb(1, 1, 1); font-family: 宋体, tahoma, Srial, helvetica, sans-serif; font-size: 14px; line-height: 25px; background-color: rgb(245, 248, 253);">//</span><span style="color: rgb(1, 1, 1); font-family: 宋体, tahoma, Srial, helvetica, sans-serif; font-size: 14px; line-height: 25px; background-color: rgb(245, 248, 253);"> </span><span style="color: rgb(1, 1, 1); font-family: 宋体, tahoma, Srial, helvetica, sans-serif; font-size: 14px; line-height: 25px; background-color: rgb(245, 248, 253);">得到</span><span style="color: rgb(1, 1, 1); font-family: 宋体, tahoma, Srial, helvetica, sans-serif; font-size: 14px; line-height: 25px; background-color: rgb(245, 248, 253);"> </span><span style="color: rgb(1, 1, 1); font-family: 宋体, tahoma, Srial, helvetica, sans-serif; font-size: 14px; line-height: 25px; background-color: rgb(245, 248, 253);">slider</span><span style="color: rgb(1, 1, 1); font-family: 宋体, tahoma, Srial, helvetica, sans-serif; font-size: 14px; line-height: 25px; background-color: rgb(245, 248, 253);"> </span><span style="color: rgb(1, 1, 1); font-family: 宋体, tahoma, Srial, helvetica, sans-serif; font-size: 14px; line-height: 25px; background-color: rgb(245, 248, 253);">的值</span>
<span style="color: rgb(1, 1, 1); font-family: 宋体, tahoma, Srial, helvetica, sans-serif; font-size: 14px; line-height: 25px; background-color: rgb(245, 248, 253);"></span><p style="border: medium none; margin: 15px auto 0px; padding-top: 0px; padding-bottom: 0px; line-height: 25px; color: rgb(1, 1, 1); font-family: 宋体, tahoma, Srial, helvetica, sans-serif; font-size: 14px; background-color: rgb(245, 248, 253);"><strong>       </strong>slider.continuous = YES;  </p><p style="border: medium none; margin: 15px auto 0px; padding-top: 0px; padding-bottom: 0px; line-height: 25px; color: rgb(1, 1, 1); font-family: 宋体, tahoma, Srial, helvetica, sans-serif; font-size: 14px; background-color: rgb(245, 248, 253);">       // 默认值为 YES 设置为 YES 只要滑轮滚动就会触发 change 方法 设置为 NO 只有当滑轮停止移动时才会触发 change 方法</p>


-(void)sliderAction:(UISlider *)slider
{
NSLog(@"%.2f",slider.value);

//使用slider 控制视图播放时间
_imageView.animationDuration = slider.value;
//重新开始 动画
[_imageView startAnimating];
//控制背景色
//self.view.backgroundColor = [UIColor colorWithRed:slider.value green:0 blue:0 alpha:1];
}


//布局imageView
-(void)layoutImageView
{
//创建image对象
self.imageView = [[UIImageView alloc]initWithFrame:CGRectMake(50, 100, 275, 230)];
//设置一个图片
self.imageView.image = [UIImage imageNamed:@"$IY$6Q6LFJKAM28NR}HDRLK-1(被拖移).tiff"];

//创建图片数组
NSMutableArray *images = [NSMutableArray array];
for (int i = 1; i < 19; i++) {
NSString *imageName = [NSString stringWithFormat:@"$IY$6Q6LFJKAM28NR}HDRLK-%d(被拖移).tiff",i];
UIImage *image = [UIImage imageNamed:imageName];
//将图片对象 添加到数组
[images addObject:image];
}

//添加动画数组
_imageView.animationImages = images;
//设置播放时间(一组)
_imageView.animationDuration = 1;
//设置重复次数
_imageView.animationRepeatCount = 1000;
//提交动画
[_imageView startAnimating];

[self.view addSubview:_imageView];
[_imageView release];
}


改变 UISlider 的外观

slider.minimumValueImage = [UIImage imageNamed:@" 设置 slider 左边的图片"];

slider.maximumValueImage = [UIImage imageNamed:@" 设置 slider 右边的图片"];

// 设置了会减小滚动区域的宽度,但整个 slider 的宽度不变

[slider setMinimumTrackImage:[UIImage imageNamed:@" 设置滑轮左边的图片,最好宽度和 slider 一样 "] forState:UIControlStateNormal];

[slider currentMinimumTrackImage]; // 得到当前滑轮左边的图片 如果有的话

[slider setMaximumTrackImage:[UIImage imageNamed:@" 设置滑轮左边的图片,最好宽度和 slider 一样 "] forState:UIControlStateNormal];

[slider currentMaximumTrackImage]; // 得到当前滑轮右边的图片 如果有的话

把蓝色的设置为 MinimumTrackImage

把灰色的设置为 MaximumTrackImage

可以加一个label用于显示value,在UISlider的行为的change方法里改变label.text属性

slider.minimumTrackTintColor = [UIColor redColor]; // 滑轮左边颜色 如果设置了左边的图片就不会显示

slider.maximumTrackTintColor = [UIColor redColor]; // 滑轮右边颜色 如果设置了右边的图片就不会显示

[slider thumbImageForState:UIControlStateNormal];

[slider setThumbImage:[UIImage imageNamed:@" 设置滑轮样子的图片 "] forState:UIControlStateHighlighted]; // 设置了普通状态和高亮状态的滑轮样式

slider.thumbTintColor = [UIColor redColor]; // 设置了滑轮的颜色 如果设置了 滑轮的样式图片就不会显示
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: