iOS开发随笔

UIButton单选或者多选效果实现

2017-09-12  本文已影响19人  西贝人立口

项目中有个效果如下图:


UI.png
第一组单选:
image.png
第二组多选
image.png

以上代码实现了效果图。

下面是UIbutton点击事件:

image.png
代码如下:
NSArray *titleArr = @[@"否",@"是"];
    CGFloat itemHeight = 30.f;// 控件高度
    CGFloat margin = 5.f;// 控件间隔
    for (int i = 0; i < titleArr.count; i++) {
        UIButton *selectBtn = [UIButton buttonWithType:UIButtonTypeCustom];
        selectBtn.frame = CGRectMake(40, (lineView1.bottom+1 + (itemHeight+margin)*i), 30, 30);
        [selectBtn setImage:[UIImage imageNamed:@"未选中"] forState:UIControlStateNormal];
        [selectBtn setImage:[UIImage imageNamed:@"选中"] forState:UIControlStateSelected];
        [selectBtn setTitle:titleArr[i] forState:UIControlStateNormal];
        [selectBtn setTitleColor:RGB(98, 98, 98) forState:UIControlStateNormal];
        selectBtn.imageEdgeInsets = UIEdgeInsetsMake(0, -5, 0, 5);
        selectBtn.titleLabel.font = [UIFont systemFontOfSize:14.0];
        selectBtn.tag = 1000+i;
        [selectBtn addTarget:self action:@selector(selectBtnClick:) forControlEvents:UIControlEventTouchUpInside];
        [self.view addSubview:selectBtn];
        
        lineView2 = [[UIView alloc] initWithFrame:FRAME(10, selectBtn.bottom+1, SCREEN_WIDTH, 1)];
        lineView2.backgroundColor = RGB(231, 231, 231);
        [self.view addSubview:lineView2];

    }
    

    NSArray *multi_SelectTitleArr = @[@"消炎药",@"止疼药",@"抗生素",@"其他药物"];
    for (int j = 0; j < multi_SelectTitleArr.count; j++) {
        UIButton *multi_SelectBtn = [UIButton buttonWithType:UIButtonTypeCustom];
        multi_SelectBtn.frame = CGRectMake(55, (lineView2.bottom+1 + (itemHeight+margin)*j), 100, 30);
        [multi_SelectBtn setImage:[UIImage imageNamed:@"未选中"] forState:UIControlStateNormal];
        [multi_SelectBtn setImage:[UIImage imageNamed:@"选中"] forState:UIControlStateSelected];
        [multi_SelectBtn setTitle:multi_SelectTitleArr[j] forState:UIControlStateNormal];
        [multi_SelectBtn setTitleColor:RGB(98, 98, 98) forState:UIControlStateNormal];
        multi_SelectBtn.imageEdgeInsets = UIEdgeInsetsMake(0, -5, 0, 5);
        multi_SelectBtn.titleLabel.font = [UIFont systemFontOfSize:14.0];
        multi_SelectBtn.tag = 1100+j;
        [multi_SelectBtn setContentHorizontalAlignment:UIControlContentHorizontalAlignmentLeft];
        [multi_SelectBtn addTarget:self action:@selector(multi_SelectBtnClick:) forControlEvents:UIControlEventTouchUpInside];
        [self.view addSubview:multi_SelectBtn];
        
        UIView* lineView3 = [[UIView alloc] initWithFrame:FRAME(50, multi_SelectBtn.bottom+1, SCREEN_WIDTH, 1)];
        lineView3.backgroundColor = RGB(231, 231, 231);
        [self.view addSubview:lineView3];
    }
//多选点击事件
-(void)multi_SelectBtnClick:(UIButton *)btn{
    btn.selected = !(btn.selected);
}

//单选点击事件
-(void)selectBtnClick:(UIButton *)send{
    if (!send.isSelected) {
        preBtn.selected = !preBtn.selected;
        send.selected = !send.selected;
        preBtn = send;
    }
}

可能还有更好的实现方法,比如用UItableview的section设置折叠效果。有好的思路可以交流下。

上一篇 下一篇

猜你喜欢

热点阅读