随意细解:UI -- UISegmentedControl、UISlider

原创 2015年11月17日 21:06:45

UISegmentedControl

分段按钮:
每个分段按钮控制一个界面,每个界面是一个控制器来控制,并且可以切换界面。
注:如果选用图片初始化,必须选用镂空图

这里写图片描述

常用方法

  • initWithItems:
    UISegmentedControl独有的初始化⽅法,⽤来创建多个分段

  • setTitle: forSegmentAtIndex:
    为指定下标的分段设置title

  • selectedSegmentAtIndex
    被选中的segment下标
  • tintColor
    segmentedControl条的颜⾊(含每个segment的颜⾊)
  • addTarget: action: forControlEvents:
    给UISegmentedControl添加事件,controlEvent为UIControlEventValueChanged。

代码演示

UISegmentedControl *segmentControl = [[UISegmentedControl alloc]initWithItems:itemArr];
segmentControl.backgroundColor = [UIColor yellowColor];
segmentControl.frame = CGRectMake(20, 50, 300, 50);
// 设置默认选中(索引从0开始)
segmentControl.selectedSegmentIndex = 0;
// 修改选中的颜色
segmentControl.tintColor = [UIColor grayColor];
// 修改中间段的宽度
[segmentControl setWidth:200 forSegmentAtIndex:1];
[self.view addSubview:segmentControl];
[segmentControl release];

UISlider

滑块控件,通常⽤于控制视频播放进度,控制⾳量等。滑块提供了⼀系列连续的值,滑块停在不同的位置,获取到滑块上的值也不同。

这里写图片描述

常用属性

  • minimumValue

    设置滑块的最⼩值

  • maximumValue

    设置滑块的最⼤值

  • value

    设置滑块的当前值

  • minimumTrackTinkColor

    定义划过区域的颜⾊

  • addTarget: action: forControlEvents:

    给UISlider添加事件,controlEvent为UIControlEventValueChanged。

代码演示

UISlider *slider = [[UISlider alloc]initWithFrame:CGRectMake(30, 100, 300, 30)];
    slider.backgroundColor = [UIColor yellowColor];
    [self.view addSubview:slider];
    // 设置轨迹颜色
    slider.minimumTrackTintColor = [UIColor greenColor];
    slider.maximumTrackTintColor = [UIColor cyanColor];
    // 设置滑动按钮颜色
    slider.thumbTintColor = [UIColor yellowColor];
    // 02-redo\01-refresh\03-loopback均为图片名
    [slider setThumbImage:[UIImage imageNamed:@"02-redo"] forState:(UIControlStateNormal)];
    [slider setThumbImage:[UIImage imageNamed:@"01-refresh"] forState:(UIControlStateHighlighted)];
    [slider setThumbImage:[UIImage imageNamed:@"03-loopback"] forState:(UIControlStateSelected)];
    slider.minimumValueImage = [UIImage imageNamed:@"01-refresh"];
    slider.maximumValueImage = [UIImage imageNamed:@"03-loopback"];
    // 设置滑块的初值、最大值、最小值
    // 如果想设置初始位置,需要先把最大最小值设置上,再给初值,才会发生变化
    slider.minimumValue = 0;
    slider.maximumValue = 10;
    slider.value = 1;
    // 添加滑动事件
    [slider addTarget:self action:@selector(sliderAction:) forControlEvents:(UIControlEventValueChanged)];

    [slider release];

UIImageView

动画

这里写图片描述

常用属性

  • image

    设置图片

  • animationImages

    设置⼀组动态图⽚

  • animationDuration

    设置播放⼀次⼀组动态图⽚的时间

  • animationRepeatCount

    设置重复次数

  • startAnimating

    开始动画

  • stopAnimating

    结束动画

代码演示

用UIImageView创建一个动画(跑图),slider控制 动画播放的事件间隔,并且 slider滑动到最大值,停止动画。

在viewDidLoad方法中:

// imageView动画(跑图)
    self.imageView = [[UIImageView alloc]initWithFrame:CGRectMake(30, 200, 300, 200)];
    self.imageView.backgroundColor = [UIColor greenColor];
    [self.view addSubview:self.imageView];
    [self.imageView release];


    // 构建一个图片数组
    NSMutableArray *imageArr = [NSMutableArray array];
    for (int i = 1; i < 10; i++) {
        // 把图片名字拼接出来
        NSString *name = [NSString stringWithFormat:@"%d",i];
        UIImage *image = [UIImage imageNamed:name];
        [imageArr addObject:image];
    }

    // 设置imageView播放动画的数组
    self.imageView.animationImages = imageArr;
    // 设置时间间隔 (播放完整一次10秒)
    self.imageView.animationDuration = 10;
    // 设置重复次数( 0 代表无限次)
    self.imageView.animationRepeatCount = 0;
    // 让动画开始
    [self.imageView startAnimating];

添加点击事件:

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

    if (slider.value == slider.maximumValue) {
        [self.imageView stopAnimating];
        // 为了美观,停止的时候添加一张占位图
        self.imageView.image = [UIImage imageNamed:@"005.jpg"];
    }else{
        self.imageView.animationDuration = 10 - slider.value;
        [self.imageView startAnimating];
    }
}
版权声明:本文为博主原创文章,未经博主允许不得转载。

【学习ios之路:UI系列】ios中常见的几种控件.(UISlider,UISwitch,UIStepper,UISegmentedControl)

一.滑块控件(UISlider)  效果如下 注:系统原来效果如下 具体功能运用: ①创建滑块控件(UISlider),设置控件大小,并添加到window视图上,后释放 UISlid...
  • ZFX5130
  • ZFX5130
  • 2015年01月16日 17:56
  • 1228

【IOS 开发】基本 UI 控件详解 (UISegmentedControl | UIImageView | UIProgressView | UISlider | UIAlertView )

.一. 分段控件 (UISegmentedControl)控件展示 : 1. UISegmentedControl 控件属性(1) Style 属性Style 属性 :      -- Plain :...

UI - UISegmentedControl、UISlider、UIImageView、UISwitch

// UIControl的子类(8个): // UITextField // UIPageControl // UISlider // UIButton // UI...

UI基础之-UIImage,UIImageView, UISegmentedControl,UISlider

一  UIImageView和 UIImage 1.  UIImage 继承自 NSObject,是用来保存图片资源的 UIImageView继承自 UIView, 用来显示图片的控件,相当于一个相框...

随意细解:UI -- 数据库

数据库
  • M_MU_U
  • M_MU_U
  • 2015年12月10日 23:14
  • 573

随意细解:UI -- 集合视图

集合视图UICollectionView
  • M_MU_U
  • M_MU_U
  • 2015年12月11日 14:38
  • 314

随意细解:UI -- 事件处理

事件事件、触摸、晃动、响应者链
  • M_MU_U
  • M_MU_U
  • 2015年11月14日 15:30
  • 282

随意细解:UI -- UIScrollView、UIPageControl

UIScrollView、UIPageControl
  • M_MU_U
  • M_MU_U
  • 2015年11月18日 22:49
  • 384

随意细解:UI -- 网络编程

网络编程--GET请求方式(同步、异步)、POST请求方式(同步、异步)及区别
  • M_MU_U
  • M_MU_U
  • 2015年12月03日 22:46
  • 212

随意细解:UI -- 标签视图控制器

UITabBarController标签视图控制器、Block高级--回调传值
  • M_MU_U
  • M_MU_U
  • 2015年11月28日 19:55
  • 378
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:随意细解:UI -- UISegmentedControl、UISlider
举报原因:
原因补充:

(最多只允许输入30个字)