仿一号店APP商品分类效果开发(Android和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版本的。

时间: 2024-08-26 09:24:46

仿一号店APP商品分类效果开发(Android和IOS)的相关文章

仿一号店APP商品分类效果开发Android版本

昨天我们一起学习了一下一号店(IOS版本)(仿一号店APP商品分类效果开发IOS)商品分类效果编写今天我们一起来看一下Android版本上面的实现.其实我们的实现的具体思路差不多.总体先搞定一级分类,然后二级我们这边使用GridView布局.然后点击一级分类的每一项的时候,动态显示以及隐藏相关的二级分类数据.现在我们来看一下实现的效果. 然后这边还有一点需要介绍的是ViewGrounp的一个动画android:animateLayoutchanges属性.这个属性设置这样就自动地按照默认方式来对

Xamarin For Visual Studio 3.0.54.0 完整离线破解版(C# 开发Android、IOS工具 吾乐吧软件站分享)

Xamarin For Visual Studio就是原本的Xamarin For Android 以及 Xamarin For iOS,最新版的已经把两个独立的插件合并为一个exe安装包了.为了区分以前的帖子,所以吾乐吧软件站新建一个帖子,用来介绍这款软件.本次发布主要更新了Android SDK,破解方法,以及破解补丁,希望对各位有用吧! Xamarin Mono For Android 常见问题解决方法/工具/教程大全:http://www.wuleba.com/tag/Mono Xama

APICloud 手机APP制作先选Android还是iOS,为什么?

  APICloud 手机APP制作先选Android还是iOS,为什么?   创业团队总是面临一穷二白的境况,开发制作一款APP都要想一想,先做Android呢还是iOS呢? 移动应用专家APICloud告诉你,这件事不是2选1,而是从0到1的突破过程,首先把这个思维摆正,后面就好说了.相信创业团队为了这个问题,看了很多资料,问了很多人,但总还是有一些错误的想法存在. 错误想法一:Android市场份额占70%,所以先做Android? 对于初创团队来说,哪个平台用户多,其实是没有任何意义的.

Xamarin Mono 环境搭建(使用Visual Studio 2013 开发android 和 ios )

本文主要介绍Xamarin结合VS2013来开发Android应用程序,主要会介绍Mono和Xamarin的关系,以及整个搭建环境的过程. 一.Mono和Xamarin介绍 1.Mono简介 Mono 是一个由Novell 公司主持的项目.该项目的目标是创建一系列符合ECMA 标准(Ecma-334 和Ecma-335)的.NET 工具,包括C# 编译器和共通语言执行平台.与微软的.NET Framework 不同,Mono 项目不仅可以运行于Windows 系统上,还可以运行于Linux,Fr

使用Html5开发Android和iOS应用:HBuilder、Html5Plus、MUI

活动主题:五一巨献,问答有礼,105QB送给IT互联网界的劳动人民活动时间:4月30日晚上10点~5月2日晚上10点网址: http://ask.jiutianniao.com  2014年的时候,就初步学习了下HTML5进行移动开发.主要考虑是,Android只算入门,iOS完全不会,重新学习太费时间了.如果用HTML5可以搞定的话,入门特别简单,也可以一次性搞定2个平台,节省大量的精力和成本. HBuilder是个IDE,就像Eclipse.Html5Plus是个标准,对HTML5的风准,就

配置试用NativeScript开发Android、iOS原生应用

第一次了解NativeScript为阅读CSDN文章<原生体验挡不住!Javascript开源跨平台框架NativeScript>. 介绍 NativeScript是一款使用JavaScript语言来构建跨平台原生移动应用的开源框架,支持iOS.Android和Windows Phone.且NativeScript的使用没有过多繁杂的要求,只需使用自己已经掌握的JavaScript和CSS技能就能开发出真正具有原生用户体验的移动应用. 作为免费开源项目的NativeScript,它的源码已经托

ComponentOne Xuni助力Xamarin开发者突破百万,快速开发Android、IOS Apps

在微软Build 2015上,随着VS 2015的预览版发布,Xamrine免费版已经作为VS 2015跨平台移动解决方案的核心.与此同时,Xamarin官方也宣布其用户量达到百万之多.2011年7月,Xamarin 开始使用C#开发IOS和Android app,截止2015月4月29日,用户量到达了百万,下面我们就新功能做一些分享: Xamarin.Forms for Windows Xamarin.Forms for Windows 8.1 and Windows Phone 8.1 今年

ComponentOne Xuni助力Xamarin开发者突破百万,快速开发Android、IOS

在微软Build 2015上,随着VS 2015的预览版发布,Xamrine免费版已经作为VS 2015跨平台移动解决方案的核心.与此同时,Xamarin官方也宣布其用户量达到百万之多.2011年7月,Xamarin 开始使用C#开发IOS和Android app,截止2015月4月29日,用户量到达了百万,下面我们就新功能做一些分享: Xamarin.Forms for Windows Xamarin.Forms for Windows 8.1 and Windows Phone 8.1 今年

APP One Link ,android and ios qrcode merge as One QRCode and one short link

Adroid and ios qrcode merge as One QRCode and one short link is publish , the web site is www.apponelink.com