[IOS]今天开始学UI---UISegmentedControl&&UIStepper

最新推荐文章于 2020-04-27 11:33:26 发布

原创最新推荐文章于 2020-04-27 11:33:26 发布 · 788 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#ios #UISegmentControl

ios 专栏收录该内容

25 篇文章

订阅专栏

本文详细介绍了UISegmentControl与UIStepper的基本使用方法、属性与操作，包括如何初始化、配置样式、添加与移除segment，以及与用户交互的事件处理。通过实例代码演示了创建具有特定样式的分段控件与步进器，同时提供了添加与移除segment的功能。

UISegmentControl是分段控件:拥有多个类似Button

UISegmentControlStyle自从 7.0 就已废弃设置也没有任何实际效果

首先看他长什么样

貌似看起来很coooool这个View 简约可以这么形容他

图解分析该View属性:

该View提供的初始化函数为

- (instancetype)initWithItems:(NSArray *)items; // items can be NSStrings or UIImages. control is automatically sized to fit content

items 可以是NSString UIImage

NSArray *arr = @[@"item1",@"item2",@"item3"];
    _segmentControl1 = [[UISegmentedControl alloc] initWithItems:arr];

当然开始不设置后期也可以直接设置某个Segment的title 或者image

</pre><pre name="code" class="objc">

- (void)setTitle:(NSString *)title forSegmentAtIndex:(NSUInteger)segment;  
- (void)setImage:(UIImage *)image forSegmentAtIndex:(NSUInteger)segment;

对于某个Segment 宽度也是可以设置的如果不进行设置则由该View自己进行调整

- (void)setWidth:(CGFloat)width forSegmentAtIndex:(NSUInteger)segment;

要实现上图的样式

实现代码如下

@interface ViewController ()
@property (nonatomic,strong) UISegmentedControl *segmentControl1;
@property (nonatomic,strong) UISegmentedControl *segmentControl2;
@property (nonatomic,strong) UISegmentedControl *segmentControl3;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor whiteColor];
    [self configurationSegment1];
    [self configurationSegment2];
    [self configurationSegment3];
}

-(void)configurationSegment1{
    NSArray *arr = @[@"item1",@"item2",@"item3"];
    _segmentControl1 = [[UISegmentedControl alloc] initWithItems:arr];
    _segmentControl1.frame = CGRectMake(0, 0, 300, 30);
    CGPoint center = self.view.center;
    [_segmentControl1 setEnabled:NO forSegmentAtIndex:2];
    [_segmentControl1 setSelectedSegmentIndex:0];
    _segmentControl1.center = CGPointMake(center.x, center.y-100);
    [self.view addSubview:_segmentControl1];

    UIButton *button = [UIButton buttonWithType:UIButtonTypeSystem];
    button.frame = CGRectMake(0, 0, 80, 30);
    button.center = CGPointMake(center.x-40, center.y-60);
    [button setTitle:@"Remove" forState:UIControlStateNormal];
    [button addTarget:self action:@selector(remove:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:button];

    UIButton *button2 = [UIButton buttonWithType:UIButtonTypeSystem];
    button2.frame = CGRectMake(0, 0, 80, 30);
    button2.center = CGPointMake(center.x+40, center.y-60);
    [button2 setTitle:@"Add" forState:UIControlStateNormal];
    [button2 addTarget:self action:@selector(add:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:button2];
}

-(void)configurationSegment2{
    NSArray *arr = @[@"item1",@"item2",@"item3"];
    _segmentControl2 = [[UISegmentedControl alloc] initWithItems:arr];
    _segmentControl2.frame = CGRectMake(0, 0, 300, 30);
    CGPoint center = self.view.center;
    _segmentControl2.center = CGPointMake(center.x, center.y);
    _segmentControl2.tintColor = [UIColor redColor];
    [self.view addSubview:_segmentControl2];
}

-(void)configurationSegment3{
    NSArray *arr = @[[UIImage imageNamed:@"checkmark_icon.png"],[UIImage imageNamed:@"tools_icon.png"],[UIImage imageNamed:@"search_icon.png"]];
    _segmentControl3 = [[UISegmentedControl alloc] initWithItems:arr];
    _segmentControl3.frame = CGRectMake(0, 0, 300, 30);
    CGPoint center = self.view.center;
    _segmentControl3.center = CGPointMake(center.x, center.y+100);
    [self.view addSubview:_segmentControl3];
    [_segmentControl3 setBackgroundImage:[UIImage imageNamed:@"stepper_and_segment_background.png"] forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
    [_segmentControl3 setDividerImage:[UIImage imageNamed:@"stepper_and_segment_segment_divider.png"] forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
}


- (void)remove:(UIButton *)sender{
    [_segmentControl1 removeSegmentAtIndex:_segmentControl1.selectedSegmentIndex animated:YES];
    [_segmentControl1 setSelectedSegmentIndex:0];
}

- (void)add:(UIButton *)sender{
    [_segmentControl1 insertSegmentWithTitle:@"added" atIndex:_segmentControl1.numberOfSegments>0?_segmentControl1.numberOfSegments-1:0 animated:YES];
}
@end

移除某个或者全部segment用

- (void)removeSegmentAtIndex:(NSUInteger)segment animated:(BOOL)animated;
- (void)removeAllSegments;

添加一个segment用

- (void)insertSegmentWithTitle:(NSString *)title atIndex:(NSUInteger)segment animated:(BOOL)animated; // insert before segment number. 0..#segments. value pinned
- (void)insertSegmentWithImage:(UIImage *)image  atIndex:(NSUInteger)segment animated:(BOOL)animated;

如果这里给的index值越界则会报错

如果需要设置选中某个segment 直接设置selectedSegmentIndex该属性的值就可
某个segment处于不可选中状态

- (void)setEnabled:(BOOL)enabled forSegmentAtIndex:(NSUInteger)segment;

这里附上以上的四张图片

checkmark_icon.png

search_icon.png

tools_icon.png

stepper_and_segment_background.png

stepper_and_segment_segment_divider.png

<=====其实就在这里只是看不到注意左上缺角

UIStepper完全可以看成简化过的UISegmentControl

属性也几乎可以照搬除了默认只有两个按钮外

that's all

thx

Everything you see on Screen is UIView.