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);

    }];

效果图:

时间: 2024-08-26 03:28:54

ios 团购分类页面(9宫格)的相关文章

【iOS开发-62】自定义cell制作团购页面、顶部图片轮播、底部模拟加载更多功能,核心是练习代理模式

(1)效果 (2)案例源代码免费下载 团购页面+iOS源代码+头部广告轮播+底部加载更多 (3)补充 在源代码中,有一处瑕疵:就是因为是单线程,所以在上下拖动页面的时候,上面的图片轮播会停止.所以我们需要兼顾,解决方案,把定时器加到当前的runLoop中. 即在WPTgHeaderView.m的playOn方法中添加一行代码: -(void)playOn{ timer=[NSTimer scheduledTimerWithTimeInterval:2.0 target:self selector

iOS开发UI篇—使用xib自定义UItableviewcell实现一个简单的团购应用界面布局

iOS开发UI篇—使用xib自定义UItableviewcell实现一个简单的团购应用界面布局 一.项目文件结构和plist文件 二.实现效果 三.代码示例 1.没有使用配套的类,而是直接使用xib文件控件tag值操作 数据模型部分: YYtg.h文件 // // YYtg.h // 01-团购数据显示(没有配套的类) // // Created by apple on 14-5-29. // Copyright (c) 2014年 itcase. All rights reserved. //

团购页面web开发

一.页面板块设计 页面整体分为上下两部分,分别用box1,box2,来划分.上半部分主要是:团购网站,切换图标,内容展示.其中网站用<h2>标记,切图用<ul>,<li>构建结构.下部分包括文字说明,和价格以及超链接跳转.大体由<p>和<a>标记构成. 二.页面实现 1.主体基本结构: 1 <body > 2 <div class="big-box"> 3 <h2><a href=&q

iOS开发:一个高仿美团的团购ipad客户端的设计和实现(功能:根据拼音进行检索并展示数据,离线缓存团购数据,浏览记录与收藏记录的批量删除等)

大致花了一个月时间,利用各种空闲时间,将这个客户端实现了,在这里主要是想记录下,设计的大体思路以及实现过程中遇到的坑...... 这个项目的github地址:https://github.com/wzpziyi1/GroupPurchase 主要实现的功能,用UICollectionViewController展示团购数据,根据拼音进行检索并展示数据,离线缓存团购数据,浏览记录与收藏记录的批量删除,友盟分享的集成,利用UIView+AutoLayout写布局,实现地图定位.自定义大头针等 整个项

一个iOS图片选择器的DEMO(实现图片添加,宫格排列,图片长按删除,以及图片替换等功能)

在开发中,经常用到选择多张图片进行上传或作其他处理等等,以下DEMO满足了此功能中的大部分功能,可直接使用到项目中. 主要功能如下: 1,图片九宫格排列(可自动设置) 2,图片长按抖动(仿苹果软件删除时,图标抖动效果),可进入删除状态,再次单击进入普通状态 3,图片设置最大上限,加号按钮自动隐藏 4,已选图片可单击进行重新选择 5,无需代理,直接调用对应属性就可获取所有图片,并与显示顺序保持一致 效果图如下: 1 // 2 // SZAddImage.h 3 // addImage 4 // 5

HTML六宫格转盘抽奖页面设计,选项区块为自定义文字

本文演示一个六宫格抽奖的事例,网上也有很多模板,不过背景都是一整张图片,无法自定义内容,本文就给出可以自定义文字内容的的抽奖页面. <!DOCTYPE html> <html slick-uniqueid="4"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <style> .g-c

[iOS基础控件 - 6.6.1] 展示团购数据代码[iOS基础控件 - 6.7] 微博展示 使用代码自定义TableCell(动态尺寸)

A.需求 1.类似于微博内容的展示 2.头像 3.名字 4.会员标志 5.内容 6.分割线 7.配图(可选,可有可无) B.思路.步骤 1.Controller:UITableViewController 改变控制器继承自UITableViewController,storyboard中也同时使用新的TableViewController,其TableView作为启动入口. 2.View:代码自定义cell 使用代码组装每个cell,动态改变控件的位置.尺寸 cell含有一个WeiboFrame

iOS UI基础-9.1 UITableView 团购

概述 接下来,我们要做的是团购界面的设计,最张要实现的效果图及项目结构图      团购数据的展示 思路: 系统自带的tableCell不能展示三个文本,不能满足条件,自定义tableCell 每一个tableCell样式固定不变,使用xib来实现. 数据来源通过加载plist文件 定义展示数据模型 Tuangou.h // // Tuangou.h // 9.1团购 // // Created by jiangys on 15/9/16. // Copyright (c) 2015年 uxia

[iOS基础控件 - 6.6.1] 展示团购数据代码

1.主控制器: 1 // 2 // ViewController.m 3 // GroupPurchase 4 // 5 // Created by hellovoidworld on 14/12/3. 6 // Copyright (c) 2014年 hellovoidworld. All rights reserved. 7 // 8 9 #import "ViewController.h" 10 #import "GroupPurchase.h" 11 #im