ios 团购分类页面（9宫格）

=-= 命名有些错误，但功能实现，以后注意下命名规范

WJViewGroup.h

#import <UIKit/UIKit.h>

@interface WJViewGroup : UIView {
    NSInteger _width;
    NSInteger _height;
}

@property (nonatomic,assign)NSInteger widthNum; //横排多少个
@property (nonatomic,assign)NSInteger heightNum; //竖排多少个

@property (copy, nonatomic) void(^itemBlock)(NSInteger index);//按钮点击回调
@property (nonatomic,assign)BOOL isLine;
@property (nonatomic,strong)NSMutableArray *array;

/**
 *  添加item
 *
 *  @param widthItem  高数量
 *  @param heightItem 宽数量
 *  @param num        item数量
 */
- (void)addItem:(NSInteger)widthItem widthItem:(NSInteger)heightItem num:(NSArray *)num;
/**
 *  改变item的文字
 *
 *  @param array 文字数组
 */
- (void)item:(NSArray *)array;
@end

WJViewGroup.m

#import "WJViewGroup.h"

@implementation WJViewGroup

- (instancetype)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];
    if (self) {
        _width = frame.size.width;
        self.backgroundColor = [UIColor whiteColor];
        _height = frame.size.height;
        self.layer.borderWidth = 1;
        self.clipsToBounds = YES;
        self.layer.cornerRadius = 5;
        _widthNum = 3;
        _heightNum = 3;
        _array = [[NSMutableArray alloc]init];
    }
    return self;
}

#pragma mark - 添加item 3行－－－－－－－－－

- (void)addItem:(NSInteger)widthItem widthItem:(NSInteger)heightItem num:(NSArray *)num{
    NSInteger index = 0;
    NSInteger indeNume = 0;
    for (NSInteger i = 0; i < widthItem; i ++) {
         NSInteger index_Y = 0;
        for (NSInteger j = 0; j < heightItem; j++) {
         
            if (indeNume < num.count) {
                UIButton *button = [[UIButton alloc]initWithFrame:CGRectMake(_width/_widthNum*index_Y, _height/_heightNum * index, _width/_widthNum, _height/_heightNum)];
                [button setTitle:num[indeNume] forState:UIControlStateNormal];
                button.tag = indeNume;
                button.titleLabel.font = [UIFont systemFontOfSize:14];
                [button setTitleColor:[UIColor grayColor] forState:UIControlStateNormal];
                [button addTarget:self action:@selector(buttonPressed:) forControlEvents:UIControlEventTouchUpInside];
                [self addSubview:button];
                [_array addObject:button];
                if (_isLine && index_Y < 2) {
                    UIView *lineVertical  = [[UIView alloc]initWithFrame:CGRectMake(CGRectGetMaxX(button.frame), CGRectGetMinY(button.frame) + _height/_heightNum *0.2, 0.5, _height/_heightNum *0.6)];
                    lineVertical.backgroundColor = [UIColor lightGrayColor];
                    [self addSubview:lineVertical];
                }
                
            }
            indeNume ++;
            index_Y++;
        }
       
            index++;
    }
    if (_isLine) {
        [self addCrossLine:0];
    }
 
}

- (void)item:(NSArray *)array {
    NSInteger index = 0;
    for (UIButton *button in _array) {
        if (index < array.count) {
             [button setTitle:array[index] forState:UIControlStateNormal];
        }
        index++;
    }
}

#pragma mark - 添加横竖线

- (void)addCrossLine:(NSInteger)index {
    if (index == 0) {
        for (int i = 0; i < 3; i ++) {
            if (i > 0) {
                UIView *crossLine = [[UIView alloc]initWithFrame:CGRectMake(_width *0.05, _height/_heightNum*i, _width *0.9, 0.5)];
                crossLine.backgroundColor = [UIColor lightGrayColor];
                [self addSubview:crossLine];
            }
 
        }
    }else {
        for (int i = 0; i < 3; i ++) {
            if (i > 0) {
                UIView *crossLine = [[UIView alloc]initWithFrame:CGRectMake(0, _height/_heightNum*i, _width, 0.5)];
                crossLine.backgroundColor = [UIColor lightGrayColor];
                [self addSubview:crossLine];
            }
        }
    }
}

- (void)addVerticalLine {
    for (int i = 0; i < 3; i ++) {
        if (i < 2) {
            UIView *verticalLine = [[UIView alloc]initWithFrame:CGRectMake(_width/_widthNum * (i+1),0, _width, 0.5)];
            verticalLine.backgroundColor = [UIColor grayColor];
            [self addSubview:verticalLine];
        }
    }
}

#pragma mark - 事件监听

- (void)buttonPressed:(UIButton *)sender {
    if (sender.titleLabel.text.length > 0) {
        if (_itemBlock) {
            _itemBlock(sender.tag);
        }

    }
}

@end

使用：

1.直接使用

  WJViewGroup *group = [[WJViewGroup alloc]initWithFrame:CGRectMake(ScreenWidth*0.05, 20, ScreenWidth*0.9, 120)];
    group.isLine = YES;

    group.layer.borderColor = [UIColor colorWithHexString:@"d3d1d1"].CGColor;
    [group addItem:3 widthItem:3 num:@[@"美食",@"电影",@"KTV",@"龙虾",@"甜品",@"海鲜",@"火锅",@"自助餐",@"蔬菜"]];
    [group setItemBlock:^(NSInteger index) {
        NSLog(@"%ld",index);
        
    }];
    [self.view addSubview:group];

效果图：

2.cell中使用

自定义初始化cell

- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier cellHeight:(NSInteger)cellHeight; 

      _group = [[WJViewGroup alloc]initWithFrame:CGRectMake(ScreenWidth*0.05, CGRectGetHeight(viewBG.frame) +5, ScreenWidth*0.9, cellHeight)];
        _group.isLine = YES;
        if (cellHeight == 80) {
            _group.heightNum = 2;
        }
        _group.layer.borderColor = [UIColor colorWithHexString:@"d3d1d1"].CGColor;
        [_group addItem:3 widthItem:3 num:@[@"",@"",@"",@"",@"",@"",@"",@"",@""]];
        [self.contentView addSubview:_group];

懒加载：

- (NSArray *)arrayContext {
    if (!_arrayContext) {
        _arrayContext = [[NSArray alloc]initWithObjects:
  @[@"火锅",@"蛋糕甜点",@"西餐",@"自助餐",@"小吃快餐",@"香锅烤鱼",@"聚餐宴请",@"烧烤烤肉",@"日韩料理"],
  @[@"经济型酒店",@"豪华酒店",@"主题酒店",@"公寓型酒店",@"客栈",@"青年旅社"],
  @[@"美发",@"美甲",@"美容美体",@"瑜伽/舞蹈"],
  @[@"温泉",@"海洋馆",@"展览馆",@"动植物园",@"主题公园",@"水上乐园"],
  @[@"演出赛事",@"桌游/电玩",@"运动健身",@"足疗按摩",@"洗浴/汗蒸",@"4D/5D电影",],
                         nil];
    }
    return _arrayContext;
}

代理方法中：

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath 

    [cell.group item:self.arrayContext[indexPath.row]];
    [cell.group setItemBlock:^(NSInteger index) {
        NSLog(@"%ld",index);
        
    }];

效果图：