详解iOS-按钮单选与多选逻辑处理

我们经常会有多行多列按钮的页面, 这个时候我们通常会选择循环创建按钮, 然后进行按钮单选或者多选的操作!

一. 单选逻辑处理

1. 创建按钮控件数组及标签数组, 并升级当前选中按钮为属性,方便使用

#define ZLUnselectedColor [UIColor colorWithRed:(241)/255.0 green:(242)/255.0 blue:(243)/255.0 alpha:1.0]
#define ZLSelectedColor [UIColor colorWithRed:(108)/255.0 green:(187)/255.0 blue:(82)/255.0 alpha:1.0]

@interface ZLRadioViewController ()

// 标签数组(按钮文字)
@property (nonatomic, strong) NSArray *markArray;

// 按钮数组
@property (nonatomic, strong) NSMutableArray *btnArray;

// 选中按钮
@property (nonatomic, strong) UIButton *selectedBtn;

@end
#pragma mark - 懒加载

- (NSArray *)markArray {
  if (!_markArray) {
    NSArray *array = [NSArray array];
    array = @[@"14", @"15", @"16", @"17", @"18"];
    _markArray = array;
  }
  return _markArray;
}

- (NSMutableArray *)btnArray {
  if (!_btnArray) {
    NSMutableArray *array = [NSMutableArray array];
    _btnArray = array;

  }
  return _btnArray;
}

2. 创建单选视图, 循环创建按钮, 并回显上次选中值

- (void)setupRadioBtnView {

  CGFloat UI_View_Width = [UIScreen mainScreen].bounds.size.width;
  CGFloat marginX = 15;
  CGFloat top = 100;
  CGFloat btnH = 30;
  CGFloat width = (250 - marginX * 4) / 3;

  // 按钮背景
  UIView *btnsBgView = [[UIView alloc] initWithFrame:CGRectMake((UI_View_Width - 250) * 0.5, 50, 250, 300)];
  btnsBgView.backgroundColor = [UIColor whiteColor];
  [self.view addSubview:btnsBgView];

  // 循环创建按钮
  NSInteger maxCol = 3;
  for (NSInteger i = 0; i < 5; i++) {

    UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
    btn.backgroundColor = ZLUnselectedColor;
    btn.layer.cornerRadius = 3.0; // 按钮的边框弧度
    btn.clipsToBounds = YES;
    btn.titleLabel.font = [UIFont boldSystemFontOfSize:12];
    [btn setTitleColor:[UIColor colorWithRed:(102)/255.0 green:(102)/255.0 blue:(102)/255.0 alpha:1.0] forState:UIControlStateNormal];
    [btn setTitleColor:[UIColor whiteColor] forState:UIControlStateSelected];
    [btn addTarget:self action:@selector(chooseMark:) forControlEvents:UIControlEventTouchUpInside];
    NSInteger col = i % maxCol; //列
    btn.x = marginX + col * (width + marginX);
    NSInteger row = i / maxCol; //行
    btn.y = top + row * (btnH + marginX);
    btn.width = width;
    btn.height = btnH;
    [btn setTitle:self.markArray[i] forState:UIControlStateNormal];
    [btnsBgView addSubview:btn];
    btn.tag = i;
    [self.btnArray addObject:btn];
  }

  // 创建完btn后再判断是否能选择(之前是已经选取过的)
  // 假数据:之前已经上传16时,则回显16
  for (UIButton *btn in btnsBgView.subviews) {
    if ([@"16" isEqualToString:btn.titleLabel.text]) {
      btn.selected = YES;
      btn.backgroundColor = ZLSelectedColor;
      break;
    }
  }
}

3. 数字按钮单选处理, 根据tag值去判断是否是当前选中按钮

- (void)chooseMark:(UIButton *)sender {
  NSLog(@"点击了%@", sender.titleLabel.text);

  self.selectedBtn = sender;

  sender.selected = !sender.selected;

  for (NSInteger j = 0; j < [self.btnArray count]; j++) {
    UIButton *btn = self.btnArray[j] ;
    if (sender.tag == j) {
      btn.selected = sender.selected;
    } else {
      btn.selected = NO;
    }
    btn.backgroundColor = ZLUnselectedColor;
  }

  UIButton *btn = self.btnArray[sender.tag];
  if (btn.selected) {
    btn.backgroundColor = ZLSelectedColor;
  } else {
    btn.backgroundColor = ZLUnselectedColor;
  }
}

二. 多选逻辑处理

1. 创建按钮控件数组和标签字典, 及选中标签数组(数字)和选中标签数组(文字字符串), 为了展示及上传按钮数据使用

#define ZLUnselectedColor [UIColor colorWithRed:(241)/255.0 green:(242)/255.0 blue:(243)/255.0 alpha:1.0]
#define ZLSelectedColor [UIColor colorWithRed:(128)/255.0 green:(177)/255.0 blue:(34)/255.0 alpha:1.0]

@interface ZLMultiselectController ()

// 标签数组
@property (nonatomic, strong) NSArray *markArray;

// 标签字典
@property (nonatomic, strong) NSDictionary *markDict;

// 选中标签数组(数字)
@property (nonatomic, strong) NSMutableArray *selectedMarkArray;

// 选中标签数组(文字字符串)
@property (nonatomic, strong) NSMutableArray *selectedMarkStrArray;

@end
#pragma mark - 懒加载

- (NSArray *)markArray {
  if (!_markArray) {
    NSArray *array = [NSArray array];
    array = @[@"导购", @"客服", @"家教", @"礼仪", @"主持"];
    _markArray = array;
  }
  return _markArray;
}

// 上传通过文字key取数字value发送数字
- (NSDictionary *)markDict {
  if (!_markDict) {
    NSDictionary *dict = [NSDictionary dictionary];
    dict = @{
         @"导购" : @"3" ,
         @"客服" : @"7",
         @"家教" : @"9",
         @"礼仪" : @"10",
         @"主持" : @"11",
         };
    _markDict = dict;
  }
  return _markDict;
}

- (NSMutableArray *)selectedMarkArray {
  if (!_selectedMarkArray) {
    _selectedMarkArray = [NSMutableArray array];
  }
  return _selectedMarkArray;
}

- (NSMutableArray *)selectedMarkStrArray {
  if (!_selectedMarkStrArray) {
    _selectedMarkStrArray = [NSMutableArray array];
  }
  return _selectedMarkStrArray;
}

2.循环创建按钮视图, 循环创建按钮

- (void)setupMultiselectView {

  CGFloat UI_View_Width = [UIScreen mainScreen].bounds.size.width;
  CGFloat marginX = 15;
  CGFloat top = 19;
  CGFloat btnH = 35;
  CGFloat marginH = 40;
  CGFloat height = 130;
  CGFloat width = (UI_View_Width - marginX * 4) / 3;

  // 按钮背景
  UIView *btnsBgView = [[UIView alloc] initWithFrame:CGRectMake(0, 100, UI_View_Width, height)];
  btnsBgView.backgroundColor = [UIColor whiteColor];
  [self.view addSubview:btnsBgView];

  // 循环创建按钮
  NSInteger maxCol = 3;
  for (NSInteger i = 0; i < 5; i++) {

    UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
    btn.backgroundColor = ZLUnselectedColor;
    btn.layer.cornerRadius = 3.0; // 按钮的边框弧度
    btn.clipsToBounds = YES;
    btn.titleLabel.font = [UIFont boldSystemFontOfSize:14];
    [btn setTitleColor:[UIColor colorWithRed:(102)/255.0 green:(102)/255.0 blue:(102)/255.0 alpha:1.0] forState:UIControlStateNormal];
    [btn setTitleColor:[UIColor whiteColor] forState:UIControlStateSelected];
    [btn addTarget:self action:@selector(chooseMark:) forControlEvents:UIControlEventTouchUpInside];
    NSInteger col = i % maxCol; //列
    btn.x = marginX + col * (width + marginX);
    NSInteger row = i / maxCol; //行
    btn.y = top + row * (btnH + marginX);
    btn.width = width;
    btn.height = btnH;
    [btn setTitle:self.markArray[i] forState:UIControlStateNormal];
    [btnsBgView addSubview:btn];
  }

  // 确定按钮
  UIButton *surebtn = [UIButton buttonWithType:UIButtonTypeCustom];
  [surebtn setTitle:@"确定" forState:UIControlStateNormal];
  surebtn.frame = CGRectMake(marginX * 2, CGRectGetMaxY(btnsBgView.frame) + marginH, UI_View_Width - marginX * 4, 40);
  surebtn.titleLabel.font = [UIFont boldSystemFontOfSize:16];
  [surebtn addTarget:self action:@selector(sureBtnClick) forControlEvents:UIControlEventTouchUpInside];
  surebtn.backgroundColor = [UIColor orangeColor];
  surebtn.layer.cornerRadius = 3.0;
  surebtn.clipsToBounds = YES;
  [self.view addSubview:surebtn];
}

3. 按钮多选逻辑处理, 并上传数据请求处理

/**
 * 按钮多选处理
 */
- (void)chooseMark:(UIButton *)btn {

  btn.selected = !btn.selected;

  if (btn.isSelected) {
    btn.backgroundColor = ZLSelectedColor;
    [self.selectedMarkArray addObject:self.markDict[btn.titleLabel.text]];
    [self.selectedMarkStrArray addObject:btn.titleLabel.text];
  } else {
    btn.backgroundColor = ZLUnselectedColor;
    [self.selectedMarkArray removeObject:self.markDict[btn.titleLabel.text]];
    [self.selectedMarkStrArray removeObject:btn.titleLabel.text];
  }
}

/**
 * 确认接口请求处理
 */
- (void)sureBtnClick {
  // 用户选择标签后就把值上传, 也要传给服务器下次直接请求回来
  // 按钮数字标识字符串
  NSString *numStr = [self.selectedMarkArray componentsJoinedByString:@","];
  // 按钮文字字符串
  NSString *str = [self.selectedMarkStrArray componentsJoinedByString:@","];

  // 测试:拼接请求参数
  NSLog(@"按钮数字标识字符串:%@", numStr);
  NSLog(@"按钮文字字符串:%@", str);
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

时间: 2017-03-27

IOS开发相册图片多选和删除的功能

照例先上效果图 本次用的第三方框架做这个,但是需要考虑的地方也比较多,怎么把拍照和相册选取结合.删除照片后添加新照片时候的相册状态等等,所有的改变都是在操作数组.还需考虑图片的压缩上传. 本次用的第三方框架为:QBImagePickerController 按照惯例,上代码,本次代码较多 第一个控制器 .h里没啥代码 #import "RRZShowEditViewController.h" #import "RRZSendShowTextCell.h" #impo

iOS 多选删除功能附tableViewTips及单选删除

一.前言 这次分享并记录一下tableView的多选删除,并额外记录一下单选删除及tableView的设置小技巧. 二.想要实现的效果图如下: 1.先上原图 2.然后编辑图如下: 3.编辑步骤: 点击右上角按钮编辑,界面呈现编辑状态底部删除按钮弹出 选择删除cell项,点击右下角删除可删除 点击右上角,退出编辑状态,底部删除按钮退出界面 三.多选删除核心代码 1.设置允许tableView编辑状态下允许多选 _mainTableView.allowsMultipleSelectionDuring

java IO实现电脑搜索、删除功能的实例

一.递归方法 1.递归就是自己调用本身的方法,前提是有方法. 2.递归使用 找出递归的规律 递归要有出口条件,也就是结束条件 3.注意事项 递归次数不能太多,否则会出现堆栈溢出现象 递归不能嵌套使用,否则出现死递归 二.IO介绍 1. i为Input输入,O为Output输出,API单独把输入和输出流封装成一个类,提供大量的方法供我们使用. 2. IO技术可以把数据写入到持久化设备(包括硬盘.光盘.U盘等),集合.数组虽然可以存储读取,但是仅仅暂存在内存中,当重新启动程序就不存在了. 3. 相对

使用vue.js实现checkbox的全选和多个的删除功能

template代码: <template> <div class="hello"> <ul> <li v-for="(item, index) in proData"> <label for=""> <input type="checkbox" :value="index" v-model="selectArr">

Angularjs+bootstrap+table多选(全选)支持单击行选中实现编辑、删除功能

最终实现效果: index.html <!DOCTYPE html> <html> <head> <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.js"></script> <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular-animat

iOS开发之tableView实现左滑删除功能

前言 这几天要实现左划删除的功能,发现网上很多帖子大多出自一人之手,然后都是 copy 的文章,其实都没有那么复杂,只实现一个代理方法就可以了 方法如下 - (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath { if (editingStyle == UITa

Android中ListView绑定CheckBox实现全选增加和删除功能(DEMO)

ListView控件还是挺复杂的,也是项目中应该算是比较常用的了,所以写了一个小Demo来讲讲,主要是自定义adapter的用法,加了很多的判断等等等等-.我们先来看看实现的效果吧! 好的,我们新建一个项目LvCheckBox 我们事先先把这两个布局写好吧,一个是主布局,还有一个listview的item.xml,相信不用多说 activity_main.xml <LinearLayout xmlns:android="http://schemas.android.com/apk/res/

iOS 通过collectionView实现照片删除功能

一,效果图. 二,工程图. 三,代码. ViewController.h #import <UIKit/UIKit.h> @interface ViewController : UIViewController <UICollectionViewDataSource,UICollectionViewDelegate,UICollectionViewDelegateFlowLayout,UIAlertViewDelegate,UIActionSheetDelegate,UIImagePic

Bootstrap Table中的多选框删除功能

先上代码,后面再进行详细解释: //删除按钮事件 $("#remove").on("click", function () { // $("#table").bootstrapTable('getSelections');为bootstrapTable自带的,所以说一定要使用bootstrapTable显示表格,#table:为table的id var rows = $("#table").bootstrapTable('ge

iOS自定义UITableView实现不同系统下的左滑删除功能详解

前言 在我们的app开发当中,经常会用到UITableView 的左滑删除的功能,通常的话效果如下 但有时候系统现有的功能并不能完全满足我们的开发需求,这样就需要我们在其现有的功能基础上自定义我们所需要的功能了.下图是在项目中自定义的按钮(只是修改了按钮的frame而已). 然后我就总结了一下根据不同的需求自定义不同的按钮. 一.系统默认左滑删除按钮 如果你对左滑删除按钮的要求不高,仅仅只是实现UITableView上cell的左滑删除功能,那在UITableView的代理方法中添加以下两种方法

java实现多选批量删除功能

本文为大家分享了java实现多选批量删除的具体代码,帮助大家更好的理解批量删除功能的实现过程,供大家参考,具体内容如下 本文用到的框架是:springmvc+mybatis 实现思路:多选复选框多个删除,点击全选全部选中,再次点击全部取消,为了保证操作的安全,应该提示框进行提升,用户再次点击确认删除进行删除,把选中的多个复选框的值传到后端进行循环删除,最后刷新数据,公司中为了保证数据安全一般不会真正删除而是把数据修改状态进行隐藏,也就是修改,这边以完全删除为例 部分效果截图(页面简陋) 点击全选