码迷,mamicode.com
首页 > 移动开发 > 详细

仿一号店APP商品分类效果开发(Android和IOS)

时间:2015-01-13 10:39:37      阅读:146      评论:0      收藏:0      [点我收藏+]

标签:一号店   商品分类   ios   

       好久没写博客了,一方面这段时间公司的事情项目比较多,另一方面自己也有准备成立自己的个人工作室,所以一直没顾得上去总结写一下技术博客,今天正好有点时间就来一篇吧。

       这段时间一直在进行开发商城的APP(Android和IOS),也研究一下国内绝大多数的电商APP(例如:淘宝,京东,天猫,苏宁易购,顺丰优选等等),他们的商品分类其实大多数属于常见格调:列表-点击二级列表-具体三级分类列表。唯有看了一号店IOS端的APP,感觉还不错。一级格子分布,点击item,中间显示二级分类。然后我们团队决定仿照该效果实现我们的APP。今天的文章打算分为两部分来写1.IOS端效果模拟。2.Android端效果模拟。

        首先我们看一下一号店IOS APP以及初步模拟的界面效果(当然现在是属于初版,很多细节问题还有待需改)

       技术分享技术分享

       下面来稍微讲解一下模拟实现这样效果的具体思路:

        ①:首先一级商品目录,我这边使用计算画出每一个View,可以说是九宫格,其实这边我们有12主商品分类,可以算是12宫格吧。

        ②:然后在点击每一个一级商品分类的时候,动态去判断添加已经删除二级分类view。

        ③:二级分类view,动态的放入了相应的商品分类button。

        ④:然后在进行切换显示二级分类View的时候,加入显示动画以及隐藏的view。

        好了基本的方法思路就是这么多功能啦。好了接下来是具体实现的主要代码,因为代码中还有很多冗余的地方,里面还有很多的问题,还没有具体的进行整理。希望大家不要喷我哦~后面会进一部优化的,然后会给出相对完善的代码。

        

       具体功能代码如下:

       (一):一级分类以及点击显示二级分类效果主要功能代码 ContentScrollView.h

<span style="font-family:SimSun;font-size:18px;">//
//  ContentScrollView.h
//  zttmall
//
//  Created by hmjiangqq on 15/1/7.
//  Copyright (c) 2015年 江清清<<a>http://www.chinaztt.com/</a>中天科技软件技术有限公司>. All rights reserved.
//

#import <UIKit/UIKit.h>
#import "SubCategoryView.h"
#define COLUMN_SIZE 4   //这边暂定为4行view

@interface ContentScrollView : UIScrollView
{
    UIScrollView *_classifyScrollView;
    NSMutableArray *_lineViewArray;  //每行view数组
    UITapGestureRecognizer *_tap;
    
    BOOL _toggle; //二级商品分类 页面打开以及关闭开关
    NSUInteger _transHeight; //平移的距离
    NSUInteger _preIndex;  //前一次点击的item 索引
    NSUInteger _preColumn;  //前一次点击的行号
    
    float mTopMark[COLUMN_SIZE];  //定义每一行的view的高度
    
    //二级商品分类view
    SubCategoryView *_subCategoryView;
    NSArray *_categoryData;
    
}
@property(nonatomic,retain)NSArray *data;

- (id)initWithFrame:(CGRect)frame;

@end
</span>
        ContentScrollView.m

<span style="font-family:SimSun;font-size:18px;">//
//  ContentScrollView.m
//  zttmall
//
//  Created by hmjiangqq on 15/1/7.
//  Copyright (c) 2015年 江清清<<a>http://www.chinaztt.com/</a>中天科技软件技术有限公司>. All rights reserved.
//

#import "ContentScrollView.h"
#import "FirstCategoryItemModel.h"
#import "UIImageView+WebCache.h"
#import "RTLabel.h"

#define COLUMN_NUMBER 3
#define TRANS_SPEED 0.4

//定义标志当前item是点在第一行,还是最后一行,以及中间位置,三种情况的界面的处理效果不一样
//点击位置枚举
enum{
    ClassifyClickLocationBegin,
    ClassifyClickLocationCenter,
    ClassifyClickLocationEnd
} ENUM_LineClickOnLocation;

//定义标志前后两次点击的是否为同一个  old:表示前后两次点击item一样,new:表示前后两次点击item不一样,还有就是不同行
enum{
    CLassifyItemClickOld,
    CLassifyItemClickNew,
    ClassifyItemClickNoSameColumn
} ENUM_LineItemClickMark;

@implementation ContentScrollView

-(id)initWithFrame:(CGRect)frame{
    self=[super initWithFrame:frame];
    if(self){
        //初始化scrollView
        _classifyScrollView = [[UIScrollView alloc]initWithFrame:frame];
        _classifyScrollView.directionalLockEnabled = YES;//锁定滑动的方向
        _classifyScrollView.pagingEnabled = YES;//滑到subview的边界
        _classifyScrollView.bounces=NO;
        _classifyScrollView.bouncesZoom=NO;
        _classifyScrollView.alwaysBounceVertical=NO;
        _classifyScrollView.alwaysBounceHorizontal=NO;
        _classifyScrollView.showsVerticalScrollIndicator = NO; //不显示垂直滚动条
        _classifyScrollView.showsHorizontalScrollIndicator = NO;//不显示水平滚动条
        [self addSubview:_classifyScrollView];
        
        //设置默认的item点击平台开关以及平移的距离
        _toggle=NO;
        
        //设置默认的item前后两次点击效果不一样的为new
        ENUM_LineItemClickMark=CLassifyItemClickNew;
        
        //设置默认的前一次点击的索引为-1
        _preIndex=-1;
        
        //设置默认的前一次点击的行号索引为-1
        _preColumn=-1;
    }
    return self;
}

/**
 *  进行一级分类数据设置
 *  1.以及分类中 每一个小方块为106x106  还要加上右边以及下边的1px细线  那就为107x107
 *
 *  @param data
 */
-(void)setData:(NSArray *)data{
    if(_data!=data){
        [_data release];
        _data=[data retain];
    }
    NSUInteger count=data.count/COLUMN_NUMBER;
    _lineViewArray=[[NSMutableArray arrayWithCapacity:count]retain];
    CGSize newSize = CGSizeMake(ScreenWidth,  107*count); //设置scrollview的大小
    [self setContentSize:newSize];
    for(int i=0;i<count;i++){
        UIView *_lineView=[[UIView alloc]initWithFrame:CGRectMake(0, i*107, ScreenWidth, 107)];
        //每行中的每列分类(每行有三列以及两条垂直细线)
        for(int j=0;j<5;j++){
            if(j==0){
                int index=3*i+j;
                FirstCategoryItemModel *firstItemModel=[data objectAtIndex:index];
                //第一个方格
                UIImageView *_oneItem=[[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 106, 106)];
                _oneItem.userInteractionEnabled=YES;
                _oneItem.tag=index;
                
                _tap=[[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(_classifyItemClick:)];
                [_oneItem addGestureRecognizer:_tap];
                [_tap release];
                
                [self _addClassifyIcon:firstItemModel.icon withInView:_oneItem];
                [self _addClassifyTitle:firstItemModel.title withInView:_oneItem];
                [_lineView addSubview:_oneItem];
                [_oneItem release];
            }else if (j==1){
                //第一条细线
                UIImageView *_oneLine=[[UIImageView alloc]initWithImage:[UIImage imageNamed:@"line_shu.png"]];
                _oneLine.frame=CGRectMake(106, 0, 1, 107);
                [_lineView addSubview:_oneLine];
                [_oneLine release];
            }else if (j==2){
                //第二个方格
                int index=3*i+j-1;
                FirstCategoryItemModel *firstItemModel=[data objectAtIndex:index];
                UIImageView *_towItem=[[UIImageView alloc]initWithFrame:CGRectMake(107, 0, 106, 106)];
                _towItem.userInteractionEnabled=YES;
                _towItem.tag=index;
                
                _tap=[[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(_classifyItemClick:)];
                [_towItem addGestureRecognizer:_tap];
                [_tap release];
                
                [self _addClassifyIcon:firstItemModel.icon withInView:_towItem];
                [self _addClassifyTitle:firstItemModel.title withInView:_towItem];
                [_lineView addSubview:_towItem];
                [_towItem release];
            }else if (j==3){
                //第二条细线
                UIImageView *_twoLine=[[UIImageView alloc]initWithImage:[UIImage imageNamed:@"line_shu.png"]];
                _twoLine.frame=CGRectMake(106+107, 0, 1, 107);
                [_lineView addSubview:_twoLine];
                [_twoLine release];
                
            }else if (j==4){
                //第三个方格
                int index=3*i+j-2;
                FirstCategoryItemModel *firstItemModel=[data objectAtIndex:index];
                UIImageView *_threeItem=[[UIImageView alloc]initWithFrame:CGRectMake(214, 0, 106, 106)];
                _threeItem.userInteractionEnabled=YES;
                _threeItem.tag=index;
                
                _tap=[[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(_classifyItemClick:)];
                [_threeItem addGestureRecognizer:_tap];
                [_tap release];
                
                [self _addClassifyIcon:firstItemModel.icon withInView:_threeItem];
                [self _addClassifyTitle:firstItemModel.title withInView:_threeItem];
                [_lineView addSubview:_threeItem];
                [_threeItem release];
            }
        }
        //每行底部的细线
        UIImageView *_bottomImage=[[UIImageView alloc]initWithImage:[UIImage imageNamed:@"line_read_option.png"]];
        _bottomImage.frame=CGRectMake(0, 106, ScreenWidth, 1);
        [_lineView addSubview:_bottomImage];
        [_bottomImage release];
        [self addSubview:_lineView];
        
        //没一行分类view加入到数组进行保存起来,以便接下来点击切换View
        [_lineViewArray addObject:_lineView];
        //记录每一行的位置
        mTopMark[i]=_lineView.top;
        [_lineView release];
    }

}
/**
 *  使用商品一级分类的图标以及要添加上上的view 构造UIImageView
 *
 *  @param icon   以及分类的图标地址
 *  @param inView
 */
-(void)_addClassifyIcon:(NSString *)icon withInView:(UIImageView *)inView{
    UIImageView *_item=[[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 70, 70)];
    [_item setImageWithURL:[NSURL URLWithString:icon] placeholderImage:[UIImage imageNamed:@"ic_classify_default.png"]];
    _item.top=8;
    _item.left=(106-70)/2;
    [inView addSubview:_item];
    [_item release];
}
/**
 *  使用商品分类名称以及要添加在上面的view 构造UILable
 *
 *  @param title  商品分类名称
 *  @param inView 被添加在上面的view
 */
-(void)_addClassifyTitle:(NSString *)title withInView:(UIImageView *)inView{
    RTLabel *_itemLable=[[RTLabel alloc]initWithFrame:CGRectMake(0, 88, 100, 15)];
    [_itemLable setText:title];
    [_itemLable setTextColor:[UIColor blackColor]];
    _itemLable.font=[UIFont systemFontOfSize:12.0f];
    [_itemLable sizeToFit];
    _itemLable.top=85;
    _itemLable.left=(106-_itemLable.optimumSize.width)/2;
    [inView addSubview:_itemLable];
    [_itemLable release];
}


/**
 *  一级分类 item点击效果
 *
 *  @param tap 传入的手势
 */
-(void)_classifyItemClick:(UITapGestureRecognizer *)pTap{
    
    UIImageView *_itemView=(UIImageView *)pTap.view;
    //根据点击的item的索引来判断是第几行view,然后进行移动其他的行view
    NSUInteger index=_itemView.tag;
    NSUInteger column=index/3;
    NSUInteger count= [_lineViewArray count];
    [self _JudgeMark:index];
    //进行设置二级分类数据界面效果以及相对应的数据传入
    FirstCategoryItemModel *_firstModel=[self.data objectAtIndex:index];
    _transHeight =[self _getSubViewHeigth:_firstModel.sub_category];
    
    [self _addSubContentView:index withFirstData:_firstModel withHeigth:_transHeight];
    
    if(ENUM_LineClickOnLocation==ClassifyClickLocationBegin){
        if(ENUM_LineItemClickMark==CLassifyItemClickOld){
            [self _animationTransBegin:_transHeight withColumn:column withCount:count withLineViews:_lineViewArray];
        }else if (ENUM_LineItemClickMark==CLassifyItemClickNew){
            
            [self _animationTransBackSuit:_lineViewArray];
            [self _animationTransBegin:_transHeight withColumn:column withCount:count withLineViews:_lineViewArray];
            [self _addSubContentView:index withFirstData:_firstModel withHeigth:_transHeight];

        }else if (ENUM_LineItemClickMark==ClassifyItemClickNoSameColumn){
             //点击不同行
             //1.首先把原来的行view全部回归原位
             //2.然后进行平移相关的行view
             [self _animationTransBackSuit:_lineViewArray];
             [self _animationTransBegin:_transHeight withColumn:column withCount:count withLineViews:_lineViewArray];
             [self _addSubContentView:index withFirstData:_firstModel withHeigth:_transHeight];

        }
    }else if (ENUM_LineClickOnLocation==ClassifyClickLocationCenter){
        if(ENUM_LineItemClickMark==CLassifyItemClickOld){
            
             [self _animationTransCenter:_transHeight withColumn:column withCount:count withLineViews:_lineViewArray];
        }else if (ENUM_LineItemClickMark==CLassifyItemClickNew){
            
             [self _animationTransBackSuit:_lineViewArray];
             [self _animationTransCenter:_transHeight withColumn:column withCount:count withLineViews:_lineViewArray];
             [self _addSubContentView:index withFirstData:_firstModel withHeigth:_transHeight];

        }else if (ENUM_LineItemClickMark==ClassifyItemClickNoSameColumn){
             //点击不同行
            
             [self _animationTransBackSuit:_lineViewArray];
             [self _animationTransCenter:_transHeight withColumn:column withCount:count withLineViews:_lineViewArray];
             [self _addSubContentView:index withFirstData:_firstModel withHeigth:_transHeight];

        }
    }else if (ENUM_LineClickOnLocation==ClassifyClickLocationEnd){
        if(ENUM_LineItemClickMark==CLassifyItemClickOld){
            
             [self _animationTransEnd:_transHeight withColumn:column withLineViews:_lineViewArray];
        }else if (ENUM_LineItemClickMark==CLassifyItemClickNew){
            
             [self _animationTransBackSuit:_lineViewArray];
             [self _animationTransEnd:_transHeight withColumn:column withLineViews:_lineViewArray];
             [self _addSubContentView:index withFirstData:_firstModel withHeigth:_transHeight];

        }else if (ENUM_LineItemClickMark==ClassifyItemClickNoSameColumn){
             //点击不同行
             [self _animationTransBackSuit:_lineViewArray];
             [self _animationTransEnd:_transHeight withColumn:column withLineViews:_lineViewArray];
            [self _addSubContentView:index withFirstData:_firstModel withHeigth:_transHeight];

        }
    }
}

/**
 *  根据点击的索引 来进行计算一些枚举值效果
 *
 *  @param index  点击item的效果
 */
-(void)_JudgeMark:(NSUInteger)index {
    //设置当前的点击的行号
    NSUInteger mTemp=index/3;
    if(_preColumn!=mTemp){
         ENUM_LineItemClickMark=ClassifyItemClickNoSameColumn; //点击不同行
    }else{
     if(_preIndex==index){
        //表示两次点击同一个item
        ENUM_LineItemClickMark=CLassifyItemClickOld;
      }else{
        //表示两次不同一个item
        ENUM_LineItemClickMark=CLassifyItemClickNew;
      }
    }
    //记录下当前点击的item索引以及点击行的行号
    _preIndex=index;
    _preColumn=mTemp;
    
    //判断点击的位置    第一行,最后一行,中间行
    if(index<3){
        ENUM_LineClickOnLocation=ClassifyClickLocationBegin;
    }else if (index<9){
        ENUM_LineClickOnLocation=ClassifyClickLocationCenter;
    }else{
        ENUM_LineClickOnLocation=ClassifyClickLocationEnd;
    }
    
}

/**
 *  点击第一行 view平移的动画效果
 *
 *  @param pTransHeight 平移的距离
 *  @param pColumn  当前点击的item 在行的索引
 *  @param pCount  所有行数
 */
-(void)_animationTransBegin:(NSInteger) pTransHeight withColumn:(NSInteger) pColumn withCount:(NSUInteger)pCount withLineViews:(NSArray *)pLineViews{
    if(_toggle){
//        //进行关闭
//        for(int i=pColumn+1;i<pCount;i++){
//            UIView *_lineItemView=[_lineViewArray objectAtIndex:i];
//            [UIView animateWithDuration:TRANS_SPEED animations:^{
//                _lineItemView.top=_lineItemView.top-pTransHeight;
//            } completion:^(BOOL finished) {
//                
//            }];
//        }
        [self _animationTransBackSuit:pLineViews];
        _toggle=false;
    }else{
        //进行打开
        for(NSUInteger i=pColumn+1;i<pCount;i++){
            UIView *_lineItemView=[_lineViewArray objectAtIndex:i];
            [UIView animateWithDuration:TRANS_SPEED animations:^{
                _lineItemView.bottom=_lineItemView.bottom+pTransHeight;
            } completion:^(BOOL finished) {
                
            }];
        }
        _toggle=true;
    }
}
/**
 *  点击中间 view平移的动画效果
 *
 *  @param pTransHeight 平移的距离
 *  @param pColumn  当前点击的item 在行的索引
 *  @param pCount  所有行数
 */
-(void)_animationTransCenter:(NSInteger) pTransHeight withColumn:(NSInteger) pColumn withCount:(NSUInteger)pCount withLineViews:(NSArray *)pLineViews{
    if(_toggle){
        //进行关闭
//        for(int i=pColumn+1;i<pCount;i++){
//            UIView *_lineItemView=[_lineViewArray objectAtIndex:i];
//            [UIView animateWithDuration:TRANS_SPEED animations:^{
//                _lineItemView.top=_lineItemView.top-pTransHeight;
//            } completion:^(BOOL finished) {
//                
//            }];
//        }
         [self _animationTransBackSuit:pLineViews];
        _toggle=false;
    }else{
        //进行打开
        for(int i=pColumn+1;i<pCount;i++){
            UIView *_lineItemView=[_lineViewArray objectAtIndex:i];
            [UIView animateWithDuration:TRANS_SPEED animations:^{
                _lineItemView.bottom=_lineItemView.bottom+pTransHeight;
            } completion:^(BOOL finished) {
                
            }];
        }
        _toggle=true;
    }
}
/**
 *  点击最后一行 view平移的动画效果
 *
 *  @param pTransHeight 平移的距离
 *  @param pColumn  当前点击的item 在行的索引
 *  @param pCount  所有行数
 */
-(void)_animationTransEnd:(NSInteger) pTransHeight withColumn:(NSInteger) pColumn withLineViews:(NSArray *)pLineViews{
    if(_toggle){
        //进行关闭
//        for(int i=0;i<pColumn+1;i++){
//            UIView *_lineItemView=[_lineViewArray objectAtIndex:i];
//            [UIView animateWithDuration:TRANS_SPEED animations:^{
//                _lineItemView.top=_lineItemView.top+pTransHeight;
//            } completion:^(BOOL finished) {
//                
//            }];
//        }
         [self _animationTransBackSuit:pLineViews];
        _toggle=false;
    }else{
        //进行打开
        for(int i=0;i<pColumn+1;i++){
            UIView *_lineItemView=[_lineViewArray objectAtIndex:i];
            [UIView animateWithDuration:TRANS_SPEED animations:^{
                _lineItemView.top=_lineItemView.top-pTransHeight;
            } completion:^(BOOL finished) {
                
            }];
        }
        _toggle=true;
    }
}

/**
 *  进行所有行回归原位
 *
 *  @param _pLineViews 所有行view的数组
 */
-(void)_animationTransBackSuit:(NSArray *)_pLineViews{
    if(_toggle){
    int count=_pLineViews.count;
    for(int i=0;i<count;i++){
        UIView *_lineItemView=[_pLineViews objectAtIndex:i];
        [UIView animateWithDuration:TRANS_SPEED animations:^{
            _lineItemView.top=mTopMark[i];
        } completion:^(BOOL finished) {
            
        }];
      }
    [self _removeSubCategoryView];
        _toggle=false;
    }
    
}

/**
 *   清除二级目录视图
 */
-(void)_removeSubCategoryView{
    
    if([_subCategoryView superview]!=nil){
        [_subCategoryView removeFromSuperview];
    }
}
/**
 *  进行添加二级分类数据view
 *
 *  @param pClickItem 点击一级分类的item索引
 */
-(void)_addSubContentView:(NSUInteger)pClickItem  withFirstData:(FirstCategoryItemModel *)pFirstModel withHeigth:(NSUInteger) height{
          if([_subCategoryView superview]!=nil){
              [_subCategoryView removeFromSuperview];
            }
           _subCategoryView=[[SubCategoryView alloc]initWithFrame:CGRectMake(0, (pClickItem/3+1)*106+5, ScreenWidth, height)];
           [_subCategoryView setSub_category:pFirstModel.sub_category];
           [self addSubview:_subCategoryView];
           //[_subCategoryView release];
    
}

/**
 *  计算二级分类商品view的高度
 *
 *  @param pSubCategory 二级商品
 *
 *  @return
 */
-(int)_getSubViewHeigth:(NSArray *)pSubCategory{
    if(pSubCategory!=nil&&pSubCategory.count>0){
        int count=pSubCategory.count/3;
        return 20+count*10+(count+1)*30;
    }else{
        return 0;
    }
}

-(void)dealloc{
    [_tap release];
    [_lineViewArray release];
    [super dealloc];
}
@end
</span>
      (二):二级分类效果view  SubCategoryView.h

<span style="font-family:SimSun;font-size:18px;">//
//  SubCategoryView.h
//  zttmall
//  二级分类数据显示view
//  Created by hmjiangqq on 15/1/8.
//  Copyright (c) 2015年 江清清<<a>http://www.chinaztt.com/</a>中天科技软件技术有限公司>. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface SubCategoryView : UIView
- (id)initWithFrame:(CGRect)frame;

@property(nonatomic,retain)NSArray *sub_category; //二级分类数据

@end
</span>
        SubCategoryView.m

<span style="font-family:SimSun;font-size:18px;">//
//  SubCategoryView.m
//  zttmall
//
//  Created by hmjiangqq on 15/1/8.
//  Copyright (c) 2015年 江清清<<a>http://www.chinaztt.com/</a>中天科技软件技术有限公司>. All rights reserved.
//

#import "SubCategoryView.h"
#import "SubCategoryItemModel.h"
@implementation SubCategoryView

-(id)initWithFrame:(CGRect)frame{
    self=[super initWithFrame:frame];
    if(self){
        [self _initView];
    }
    return self;
}
/**
 *  进行显示二级商品分类view
 */
-(void)_initView{
    [self setBackgroundColor:Color(240, 240, 240, 1)];
}
/**
 *  进行把二级商品分类数据 添加在view中
 *
 *  @param sub_category 二级商品分类的数据集合
 */
-(void)setSub_category:(NSArray *)sub_category{
    if(_sub_category!=sub_category){
        [_sub_category release];
        _sub_category=[sub_category retain];
    }
    NSUInteger count=sub_category.count;
    for(NSUInteger i=0;i<count;i++){
        SubCategoryItemModel *subModel=[sub_category objectAtIndex:i];
        UIButton *_itemButton=[UIButton buttonWithType:UIButtonTypeCustom];
        _itemButton.frame=CGRectMake(107*(i%3)+10, 40*(i/3)+10, 87, 30);
        [_itemButton setBackgroundColor:[UIColor redColor]];
        [_itemButton setTitle:subModel.title forState:UIControlStateNormal];
        _itemButton.font=[UIFont systemFontOfSize:12.0f];
        [_itemButton addTarget:self action:@selector(_itemClick:) forControlEvents:UIControlEventTouchUpInside];
        [self addSubview:_itemButton];
    }
}
/**
 *  二级分类item 点击处理事件
 *
 *  @param button
 */
-(void)_itemClick:(UIButton *)button{
    NSLog(@"_itemClick...");
}
@end
</span>
     (三):使用方法:只要在外部需要使用该控件地方声明,初始化,传入分类数据就可以了。

<span style="font-family:SimSun;font-size:18px;">ContentScrollView *_contentScrollView=[[ContentScrollView alloc]initWithFrame:CGRectMake(0, 44, ScreenWidth, ScreenHeight-44)];
    [self.view addSubview:_contentScrollView];
 ShowCategoryModel *showModel=[CategoryDataParse parseCategoryData:dic];
        [_contentScrollView setData:showModel.data];
</span>
    (四):我这边使用是我自己模拟的数据,所以下面是解析的工具类方法(JSON)   

<span style="font-family:SimSun;font-size:18px;">//
//  CategoryDataParse.m
//  zttmall
//
//  Created by hmjiangqq on 15/1/6.
//  Copyright (c) 2015年 江清清<<a>http://www.chinaztt.com/</a>中天科技软件技术有限公司>. All rights reserved.
//

#import "CategoryDataParse.h"
#import "FirstCategoryItemModel.h"
#import "SubCategoryItemModel.h"
#import "CategoryItemModel.h"
#import "BrandItemModel.h"
@implementation CategoryDataParse

+(ShowCategoryModel *)parseCategoryData:(NSDictionary *)dic{
    //分类商品总数据
    ShowCategoryModel *mShowCategoryModel=[[ShowCategoryModel alloc]init];
    mShowCategoryModel.api=[dic objectForKey:@"api"];
    mShowCategoryModel.v=[dic objectForKey:@"v"];
    mShowCategoryModel.code=[dic objectForKey:@"code"];
    mShowCategoryModel.msg=[dic objectForKey:@"msg"];
    
    //一级分类数据
    NSDictionary *datalist=[dic objectForKey:@"data"];
    NSMutableArray *data=[NSMutableArray array];
    id value;
    NSEnumerator *enumerator= [datalist objectEnumerator];
    while((value =[enumerator nextObject])!=nil){
        FirstCategoryItemModel *firstModel=[[FirstCategoryItemModel alloc]init];
        firstModel.cid=[value objectForKey:@"cid"];
        firstModel.title=[value objectForKey:@"title"];
        firstModel.desc=[value objectForKey:@"desc"];
        firstModel.icon=[value objectForKey:@"icon"];
        firstModel.linker=[value objectForKey:@"linker"];
        firstModel.category=[value objectForKey:@"category"];
        
        //二级分类数据
        NSDictionary *subCategoryList=[value objectForKey:@"sub_category"];
        NSMutableArray *subCategoryData=[NSMutableArray array];
        id pValue;
        NSEnumerator *pEnumerator= [subCategoryList objectEnumerator];
        while((pValue =[pEnumerator nextObject])!=nil){
            SubCategoryItemModel *mSubCategoryModel=[[SubCategoryItemModel alloc]init];
            mSubCategoryModel.cid=[pValue objectForKey:@"cid"];
            mSubCategoryModel.title=[pValue objectForKey:@"title"];
            mSubCategoryModel.desc=[pValue objectForKey:@"desc"];
            mSubCategoryModel.icon=[pValue objectForKey:@"icon"];
            mSubCategoryModel.linker=[pValue objectForKey:@"linker"];
            mSubCategoryModel.category=[pValue objectForKey:@"category"];
            
            //三级分类数据
            NSDictionary *threeCategoryList=[pValue objectForKey:@"three_category"];
            NSMutableArray *threeCategoryData=[NSMutableArray array];
            id tValue;
            NSEnumerator *tEnumerator= [threeCategoryList objectEnumerator];
            while((tValue =[tEnumerator nextObject])!=nil){
                CategoryItemModel *threeCategoryItemModel=[[CategoryItemModel alloc]init];
                threeCategoryItemModel.cid=[tValue objectForKey:@"cid"];
                threeCategoryItemModel.title=[tValue objectForKey:@"title"];
                threeCategoryItemModel.desc=[tValue objectForKey:@"desc"];
                threeCategoryItemModel.icon=[tValue objectForKey:@"icon"];
                threeCategoryItemModel.linker=[tValue objectForKey:@"linker"];
                threeCategoryItemModel.category=[tValue objectForKey:@"category"];
                [threeCategoryData addObject:threeCategoryItemModel];
                [threeCategoryItemModel release];
            }
            
            mSubCategoryModel.three_category=threeCategoryData;
            [subCategoryData addObject:mSubCategoryModel];
            [mSubCategoryModel release];
        }
        firstModel.sub_category=subCategoryData;
        
        //品牌数据
        NSDictionary *brandDic=[value objectForKey:@"brand"];
        NSMutableArray *brandData=[NSMutableArray array];
        id bdValue;
        NSEnumerator *bdEnumerator= [brandDic objectEnumerator];
        while((bdValue =[bdEnumerator nextObject])!=nil){
            BrandItemModel *brand=[[BrandItemModel alloc]init];
            brand.brandId=[bdValue objectForKey:@"brandId"];
            brand.brandTitle=[bdValue objectForKey:@"brandTitle"];
            brand.brandDesc=[bdValue objectForKey:@"brandDesc"];
            brand.brandIcon=[bdValue objectForKey:@"brandIcon"];
            brand.brandType=[bdValue objectForKey:@"brandType"];
            brand.brandLinker=[bdValue objectForKey:@"brandLinker"];
            [brandData addObject:brand];
            [brand release];
        }
        firstModel.brand=brandData;
        [data addObject:firstModel];
        [firstModel release];
        
    }
    mShowCategoryModel.data=data;
    return [mShowCategoryModel autorelease];
}
@end
</span>
 相应的信息实体类(Model)就不贴了,直接看数据解析工具类,相信大家就能猜出来了。

下面给一下测试的地址:http://img2.xxh.cc:8080/SalesWebTest/CategoryList

好了IOS版本的基本模拟的讲解就到此,下一篇我会进行讲解Android版本的。


仿一号店APP商品分类效果开发(Android和IOS)

标签:一号店   商品分类   ios   

原文地址:http://blog.csdn.net/developer_jiangqq/article/details/42671835

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!