iOS 常见分组标签视图

开发中常遇到根据服务器返回的数据去创建很多可点击的小标签。如下面这种样式的


image.png

一般这种样式的数据格式都是数组中放模型,模型类中的一个属性还是个数组,数组中存放的是另一个模型类对象。
遇到这种样式,因为外层数组个数不固定,所以分区数也不固定,一般思路是用tableView的group样式去创建,但也可以用UIScrollView去遍历两层数组创建,我这里是用for循环遍历数组创建标签到UIScrollView上。
先在创建页面控件的方法里创建UIScrollView对象mainScr,设置好相关属性和frame,等服务器返回的数据解析成模型类以后,再调用下面的子视图创建的方法,遍历两层模型数组,创建标签,添加到mainScr上面
我这里用自己模拟的一些数据创建的视图,模拟数据格式如下,写的不怎么规范,凑合看吧:

image.png
  int View_Top = 10;  //分区视图的y顶点
  int View_Gap = 15; // 每个分区视图之间的间距
   int left_gap = 10; //分区视图左侧距离父视图mainScr的距离
    for(int i=0;i subView.width) { 
                btn_left = 10;
                btn_top = btn_top + btn_gap + btn_height;
            }
            
            UIButton *btn = [[UIButton alloc] initWithFrame:CGRectMake(btn_left, btn_top, w, btn_height)];
            [btn setTitle:dic[@"tagStr"] forState:UIControlStateNormal];
            [btn setTitleColor:[UIColor blueColor] forState:UIControlStateNormal];
            btn.layer.borderColor = [UIColor blueColor].CGColor;
            btn.layer.borderWidth = 1;
            btn.clipsToBounds = YES;
            btn.selected = NO;
            btn.layer.cornerRadius = btn_height/2;
            btn.titleLabel.font = [UIFont systemFontOfSize:13];
            [btn addTarget:self action:@selector(clickTag:) forControlEvents:UIControlEventTouchUpInside];
            [subView addSubview:btn];

            //改变标签的左顶点位置
            btn_left = btn_left + btn_gap + w;  
            //改变标签视图的高度 
            subView.height = btn_top + btn_height + btn_gap;
            
            [btnArr addObject:btn];
        }

       //根据分类项目的id将标签存储到对应的数组,以便后续处理标签的单选多选逻辑
        if([Dic[@"cate_id"] isEqualToString:@"0"]) {
            sexArray = btnArr; 
        }else if([Dic[@"cate_id"] isEqualToString:@"1"]) {
            ageArray = btnArr;
        }else if([Dic[@"cate_id"] isEqualToString:@"2"]) {
            drugArray = btnArr;
        }else if([Dic[@"cate_id"] isEqualToString:@"3"]) {
            getArray = btnArr;
        }
       //分区视图的顶部放titleL和imageV的间距
        int subView_top = 10+20+10;
        //根据标签视图的高度,计算分区背景视图的高度
        backView.height = subView_top + subView.height + View_Gap;
        //改变一下分区视图的y顶点值
        View_Top = backView.bottom+10;
    }
    //当所有子视图都创建完成,改变mainScr的contentSize
    mainScr.contentSize = CGSizeMake(ScreenWith, View_Top);

UIScrollView创建标签视图的好处是代码简洁,不用处理很多代理方法,记性不好,常用功能记录一下。
代码如有处理不当之处,烦请看这篇文章的小可爱们指正一下~

你可能感兴趣的:(iOS 常见分组标签视图)