文章: 阅读:

UISegmentedControl 选择控件

iOSUIKit

前言

  • Objective-C

    1
    NS_CLASS_AVAILABLE_IOS(2_0) @interface UISegmentedControl : UIControl <NSCoding>

  • Swift

    1
    @available(iOS 2.0, *) public class UISegmentedControl : UIControl, NSCoding

  • UISegmentedControl 的 Items 有两种样式，一种是字符串设置的标题样式，一种是图片设置的样式。

  • 图片设置的样式需要处理图片的渲染模式，以原图显示。处理阴影，如果直接设置 image 出现阴影，这时候需要设置图片的渲染模式以原样显示。

    • Objective-C

      1
      2
      UIImage *image = [UIImage imageNamed:@"hehe.png”];
      image = [image imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];

1、UISegmentedControl 的创建

  • Objective-C

    1
    2
    3
    4
    5
    // 不设置 frame 时为系统默认大小
    UISegmentedControl *segmentedControl = [[UISegmentedControl alloc] initWithItems: @[@"大娃", @"二娃", @"三娃", @"四娃"]];
       
    // 将 segmentedControl 添加到 view
    [self.view addSubview:segmentedControl];

  • Swift

    1
    2
    3
    4
    5
    // 不设置 frame 时为系统默认大小
    let segmentedControl: UISegmentedControl = UISegmentedControl(items: ["大娃", "二娃", "三娃", "四娃"])

    // 将 segmentedControl 添加到 view
    self.view.addSubview(segmentedControl)

2、UISegmentedControl 的设置

  • Objective-C

    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
    // 设置 frame
    segmentedControl.frame = CGRectMake(10, 30, 300, 50);
        
    // 设置位置
    segmentedControl.center = self.view.center;
        
    // 设置背景颜色
    segmentedControl.backgroundColor = [UIColor lightGrayColor];
        
    // 设置 标题文字、边框、选中项 的颜色
    segmentedControl.tintColor = [UIColor redColor];
        
    // 设置标题文字的 颜色、字体 等属性
    [segmentedControl setTitleTextAttributes:@{NSForegroundColorAttributeName: [UIColor blueColor], 
                                                          NSFontAttributeName: [UIFont boldSystemFontOfSize:20]}
                                    forState: UIControlStateNormal];
        
    // 设置分段标题
    [segmentedControl setTitle:@"123" forSegmentAtIndex:2];
        
    // 设置分段的图片
    [segmentedControl setImage:[[UIImage imageNamed:@"hehe"]
                                     imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal] 
             forSegmentAtIndex:0];
        
    // 设置分段标题的偏移量
    [segmentedControl setContentOffset:CGSizeMake(10, 7) forSegmentAtIndex:1];
        
    // 设置默认选中值
    segmentedControl.selectedSegmentIndex = 1;
        
    // 获取选中的分段的索引号
    NSInteger selectIndex = [segmentedControl selectedSegmentIndex];
      
    // 获取选中的分段的标题
    NSString *selectTitle = [segmentedControl titleForSegmentAtIndex:[segmentedControl selectedSegmentIndex]];
       
    // 获取分段个数
    NSUInteger numberOfSegments = segmentedControl.numberOfSegments;
       
    // 插入新分段

        // 插入标题文字
        [segmentedControl insertSegmentWithTitle:@"蛇精" atIndex:1 animated:YES];

        // 插入图片
        [segmentedControl insertSegmentWithImage:[[UIImage imageNamed:@"hihi"] 
                          imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal] 
                                         atIndex:4 
                                        animated:YES];

    // 删除分段

        // 删除指定分段
        [segmentedControl removeSegmentAtIndex:0 animated:YES];
        
        // 删除全部分段
        [segmentedControl removeAllSegments];
        
    // 添加点击触发事件
    [segmentedControl addTarget:self 
                         action:@selector(segmentedControlClick:) 
               forControlEvents:UIControlEventValueChanged];

  • Swift

    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
    // 设置 frame
    segmentedControl.frame = CGRectMake(10, 30, 300, 50)
        
    // 设置位置
    segmentedControl.center = self.view.center
        
    // 设置背景颜色
    segmentedControl.backgroundColor = UIColor.lightGrayColor()
        
    // 设置 标题文字、边框、选中项 的颜色
    segmentedControl.tintColor = UIColor.redColor()
        
    // 设置标题文字的 颜色、字体 等属性
    segmentedControl.setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.blueColor(), 
                                                        NSFontAttributeName: UIFont.boldSystemFontOfSize(20)], 
                                    forState: UIControlState.Normal)
        
    // 设置分段标题
    segmentedControl.setTitle("123", forSegmentAtIndex: 2)
        
    // 设置分段的图片
    segmentedControl.setImage(UIImage(named: "hehe")?.imageWithRenderingMode(.AlwaysOriginal), 
                     forSegmentAtIndex: 0)
        
    // 设置分段标题的偏移量
    segmentedControl.setContentOffset(CGSizeMake(10, 7), forSegmentAtIndex: 1)
        
    // 设置默认选中值
    segmentedControl.selectedSegmentIndex = 1
        
    // 获取选中的分段的索引号
    let selectIndex: NSInteger = segmentedControl.selectedSegmentIndex
       
    // 获取选中的分段的标题
    let selectTitle: String? = segmentedControl.titleForSegmentAtIndex(segmentedControl.selectedSegmentIndex)
       
    // 获取分段个数
    let numberOfSegments: Int = segmentedControl.numberOfSegments
      
    // 插入新分段

        // 插入标题文字
        segmentedControl.insertSegmentWithTitle("蛇精", atIndex: 1, animated: true)

        // 插入图片
        segmentedControl.insertSegmentWithImage(UIImage(named: "hihi")!
                        .imageWithRenderingMode(.AlwaysOriginal), 
                                           atIndex: 4, 
                                          animated: true)
        
    // 删除分段
    segmentedControl.removeSegmentAtIndex(0, animated: true)   // 删除指定分段
    segmentedControl.removeAllSegments()                       // 删除全部分段
        
    // 添加点击触发事件
    segmentedControl.addTarget( self, 
                        action: #selector(UiSegmentedControl.segmentedControlClick(_:)), 
              forControlEvents: .ValueChanged)

3、Storyboard 中设置

  • 在 Storyboard 场景中设置

3.1 Segmented Control 设置

Segment1

Style 类型
State Momentary 状态
Segments 分段数
Segment 选择分段
Title 分段标题文字
Image 分段图片
Behavior
– Enable 可用
– Selected 选中
Content Offset 文字偏移量

3.2 Control 设置

Segment2

Alignment 文字对齐方式
Content
– Selected 选中
– Enable 可用
– Highlighted 高亮

如果您觉得阅读本文对您有帮助，请用微信、支付宝 or QQ 扫码赞助，您的支持是我写作最大的动力！欢迎各位转载，但是未经作者本人同意，转载文章之后必须在文章页面明显位置给出作者和原文链接，否则保留追究法律责任的权利。

Qian Chia

Posted @ 2016-08-20 06:20


评论


文章目录
  1. 1. 前言
  2. 2. 1、UISegmentedControl 的创建
  3. 3. 2、UISegmentedControl 的设置
  4. 4. 3、Storyboard 中设置
    1. 4.1. 3.1 Segmented Control 设置
    2. 4.2. 3.2 Control 设置
隐藏目录