详细阐述UISwitch, UISlider, UISegmentedControl, UIPageControl基本的使用

这篇博客主要是阐述四个继承于UIControl的视图控制器

首先介绍的是UISwitch, 人们习惯叫它开关.

如下图所示, 它就是UISwitch


  • 创建一个开关, 注意其中frame的Width和height对switch不起作用, 它默认使用系统默认的大小
    UISwitch *swi = [[UISwitch alloc] initWithFrame:CGRectMake(180, 400, 20, 20)];
    [self.view addSubview:swi];
  • 设置UISwitch的一些属性
  • 开关开启后的背景颜色
    swi.onTintColor = [UIColor orangeColor];
  • 开关关闭状态下的边框颜色及开关切换时的颜色(null_resettable)
    swi.tintColor = [UIColor redColor];
  • 开关的按钮颜色
    swi.thumbTintColor = [UIColor cyanColor];
  • 开关开启/关闭时的图片(iOS7之后失效)
    swi.onImage = [UIImage imageNamed:@"4"];
    swi.offImage = [UIImage imageNamed:@"4"];
  • 这个属性用来判断switchControl的开闭状态(YES为开启, NO为关闭)
  • 可以通过setter方法, 改变UISwitch的初始状态
  • 设置开关的初始状态, 如果setOn:后接YES, 则初始状态为开启, 反之也是.
    [swi setOn:NO animated:YES];
  • 给UISwitch添加事件
    // 为UISwitch绑定事件
    [swi addTarget:self action:@selector(switchAction:) forControlEvents:UIControlEventValueChanged];
    // 实现绑定事件(判断条件为swi.on, 这个属性是用来判断开关的开闭的)
    - (void)switchAction:(UISwitch *)swi {
    if (swi.on == YES) {
    NSLog(@"开");
    } else {
    NSLog(@"关");
    }
    }

下面介绍的是UISlider(俗称滑块), 它的作用是用于调节视频播放进度, 和音量的大小.

  • UISlider继承于UIControl, 它提供了一系列连续的值, 滑块停在不同的地方, 所返回的值也不同

  • UISlider


    调节音量的UISlider

    调节电影播放进度的UISlider
  • 创建一个UISlider
    UISlider *slider = [[UISlider alloc] initWithFrame:CGRectMake(20, 500, 374, 20)];
    [self.view addSubview:slider];

  • 设置UISlider的属性

  • 设置当前的slider的值
    slider.value = 0.5;

  • slider的最小值
    slider.minimumValue = 0.0;

  • slider的最大值
    slider.maximumValue = 1.0;

  • 以上最大和最小可以根据情况调节

  • 添加(最小值的那边)左边的图片
    slider.minimumValueImage = [UIImage imageNamed:@"Unknown-2.png"];

  • 添加(最大值的那边)右边的图片
    slider.maximumValueImage = [UIImage imageNamed:@"Unknown-5.png"];

  • 当为YES时, 滑块在滑动过程中每时每刻都在输出Value的值, 当为NO时, 滑块在滑动过程中不输出value的值, 只有松手的时候才输出value值
    slider.continuous = NO;

  • 设置未划过的区域的颜色
    slider.maximumTrackTintColor = [UIColor lightGrayColor];

  • 设置已划过的区域的颜色
    slider.minimumTrackTintColor = [UIColor redColor];

  • 设置滑块按钮的颜色
    slider.thumbTintColor = [UIColor cyanColor];

  • 设置进度条滑块右边的图片
    [slider setMaximumTrackImage:[UIImage imageNamed:@"player_slider_playback_right.png"] forState:UIControlStateNormal];

  • 设置进度条滑块左边的图片
    [slider setMinimumTrackImage:[UIImage imageNamed:@"player_slider_playback_left.png"] forState:UIControlStateNormal];

  • 设置进度条滑块的图片
    [slider setThumbImage:[UIImage imageNamed:@"player_slider_playback_thumb.png"] forState:UIControlStateNormal];

  • slider的绑定事件
    // 绑定事件
    [slider addTarget:self action:@selector(sliderAction:) forControlEvents:UIControlEventValueChanged];
    // 实现slider的绑定事件
    - (void)sliderAction:(UISlider *)slider {
    NSLog(@"%0.2f", slider.value);
    }

下面介绍UISegmentedControl的使用

  • UISegmentedControl是一个分段控制器, 每一个item都能被点击, 它相当于一排UIButton
  • UISegmentedControl的显示效果如下图


  • UISegmentedControl(分段控制器)
  • UISegmentedControl的创建
    UISegmentedControl *segMent = [[UISegmentedControl alloc] initWithItems:@[@"first", @"second", @"last"]];
  • segment不给frame, 系统会自动计算大小
    // 打印当前segment的frame
    NSLog(@"segment的frame大小 = %@", NSStringFromCGRect(segMent.frame));
    // 设置segment的frame
    segMent.frame = CGRectMake(20, 50, 374, 40);
    [self.view addSubview:segMent];
  • 设置segMent的点击效果, 默认是NO, 当为YES时, 点击效果为变换背景色闪烁一下然后恢复原样, 为NO时, 只是变换背景色, 不闪烁.
    segMent.momentary = NO;
  • 分段控制器的items的个数
    NSInteger number = segMent.numberOfSegments;
  • 在segment中的指定下标下插入一个标题或者图片作为segment的item
    [segMent insertSegmentWithImage:[UIImage imageNamed:@"Unknow.png"] atIndex:0 animated:YES];
    [segMent insertSegmentWithTitle:@"插入一个标题" atIndex:0 animated:YES];
  • 移除指定下标对应的segment的item
    [segMent removeSegmentAtIndex:0 animated:YES];
  • 移除全部的segment的item
    [segMent removeAllSegments];
  • 给segMent的边框和选中后的背景颜色, 字体颜色赋予一个颜色
    segMent.tintColor = [UIColor orangeColor];
  • selectedSegmentIndex表示segment当前选中的下标
    segMent.selectedSegmentIndex = 1;
  • 修改segMent指定下标对应的标题
    [segMent setTitle:@"lala" forSegmentAtIndex:0];
  • 设置对应下标下的segment的item的图片
    [segMent setImage:[UIImage imageNamed:@"UnKonw.png"] forSegmentAtIndex:0];
  • 给某个下标下的标题重新设置宽度
    [segMent setWidth:0 forSegmentAtIndex:0];
  • 设置对应下标内容的偏移
    [segMent setContentOffset:CGSizeMake(0, 0) forSegmentAtIndex:0];
  • segMent对应下标是否能选中(YES能, NO不能)
    [segMent setEnabled:YES forSegmentAtIndex:0];
  • 如果分段控制器的段宽为0时, 并且该属性为YES, 系统会自动计算内容的宽度, 并调整segment每一个item的宽度
    segMent.apportionsSegmentWidthsByContent = YES;
  • 给segMent添加事件
    [segMent addTarget:self action:@selector(segMentAction:) forControlEvents:UIControlEventValueChanged];
  • 实现segMen的绑定事件
    - (void)segMentAction:(UISegmentedControl *)segMent {
    switch (segMent.numberOfSegments) {
    case 1:
    NSLog(@"第一个");
    break;
    case 2:
    NSLog(@"第二个");
    break;
    case 3:
    NSLog(@"第三个");
    break;
    default:
    break;
    }
    }

下面介绍UIPageControl

  • UIPageControl类提供一行点来指示当前显示的是多页面视图的哪一页, 当用户界面需要按页面显示时, 使用UIPageControl控件将要显示的用户界面内容分页进行显示会使编程工作变得更加方便快捷.
  • 显示效果如图


  • UIPageControl (分页控制器)
  • 创建UIPageControl
    UIPageControl *pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake(50, 250, 300, 50)];
    [self.view addSubview:pageControl];
  • 设置分页控制器的页数(默认为0)
    pageControl.numberOfPages = 10;
  • 分页控制器的当前页(默认为0)
    pageControl.currentPage = 0;
  • 设置分页控制器点的颜色
    pageControl.pageIndicatorTintColor = [UIColor greenColor];
  • 当分页控制器只有一页的时候(YES, 隐藏分页控制器)默认是NO(不隐藏)
    pageControl.hidesForSinglePage = YES;
  • 关闭系统事件page的切换显示效果(YES的时候), 并且直到调用updateCurrentPageDisplay这个方法, 才会显示
    pageControl.defersCurrentPageDisplay = YES;
  • 获取点的大小
    CGSize size = [pageControl sizeForNumberOfPages:0];
    NSLog(@"%@", NSStringFromCGSize(size));
  • 当前页的点的颜色
    pageControl.currentPageIndicatorTintColor = [UIColor redColor];
  • 给pageControl绑定事件
    [pageControl addTarget:self action:@selector(pageControlChange:) forControlEvents:UIControlEventValueChanged];
    }
  • 实现pageControl的绑定事件()
    - (void)pageControlChange:(UIPageControl *)pageControl {
    NSLog(@"点了");
    // 更新当前页码
    [pageControl updateCurrentPageDisplay];
    }
    以上内容就是四个控件的基础使用方法, 希望对大家有帮助!
    友情提示: 不要胡乱的粘贴代码, 因为有一些属性之间是有冲突的, 希望愿意看的童鞋们一行一行的去敲!

如果有错误或者不足的地方, 希望大家指出, 以后还会相应的写一些类似的博客, 谢谢大家!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,839评论 6 482
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,543评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 153,116评论 0 344
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,371评论 1 279
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,384评论 5 374
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,111评论 1 285
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,416评论 3 400
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,053评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,558评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,007评论 2 325
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,117评论 1 334
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,756评论 4 324
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,324评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,315评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,539评论 1 262
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,578评论 2 355
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,877评论 2 345

推荐阅读更多精彩内容

  • { 11、核心动画 需要签协议,但是系统帮签好 一、CABasicAnimation 1、创建基础动画对象 CAB...
    CYC666阅读 1,530评论 2 4
  • UIControl UIControl:有控制功能的视图的父类 只要跟控制有关的类都是继承自该类,同时我们通常不会...
    隔壁王叔不在家阅读 701评论 0 0
  • 首先不得不说 UIButton的父类就是UIControl今天主要介绍UIControl的四种控件 UISwitc...
    9bf19a4010ab阅读 358评论 0 0
  • 汇总 滑动条控件.步进控件.开关控件.选项卡控件 UISlider 滑动条 //1.UISlider滑块控件UIS...
    nothing_c阅读 257评论 0 0
  • 迷离 各种戏里排徊 几度阴晴 海旺树的叶子黄了又青 彩虹伞的上方 水墨烟云 翻涌飞腾 雨下够了 风刮完了 海旺树滴...
    三月品阅读 142评论 0 0