本文将带你了解IOS开发入门iOS纯Autolayout实现UITableView的二级分类下拉菜单展开动画,Autolayout真的快的飞起，希望本文对大家学IOS有所帮助。

最近在做项目，也遇到了各种奇奇怪怪的需求，有个需求一开始看起来有点难搞，但是在大神的指导下，既然做不到那种气泡，那我们就用魔术般切换Cell不就好了么，我用的是纯Autolayout，直观暴力，用习惯了真的强，把效果贴出来还蛮不错的，花了一

小时写出了Demo给大家分享下。

先看需求

Demo效果

哇噻，福利还不错哦，不能让写Demo变得很无聊嘛

1.首先我用的tableView实现的

2.我用了两套cell切换 第二套cell内嵌了collectionView

3.最关键的是由于用的tableView实现，点击每个image的时候回调进行了一些逻辑处理

4.高度计算和模型解析用了FDTemplateLayout和MJExtension 想用的请进传送！！

第一步

上面也提到了我用了两套cell，而且我用的也不是代码布局UI，那么直接点，贴几个图

你们自行感受下

普通状态下

下拉状态下

熟练用IB的应该很容易能看明白，三个ImageView三等分屏幕，高度是宽度的0.8倍，

这里的collectionView高度固定给的200，内容小于200缩短，大于200滚动

无需繁琐的代码，这布局几分钟就写完了，啦啦啦啦

第二步

还是贴一段解析本地数据的用法，我用的MJExtension，好用啊，也是非常迅速

快到不能呼吸，貌似我另一篇文章也有介绍，这里不多说了

- (void)requestCategoryInfo:(requestHelperBlock)block

{

    NSString *path = [[NSBundle mainBundle] pathForResource:@"Category" ofType:@"json"];

    NSString *categoryStr = [NSString stringWithContentsOfFile:path usedEncoding:nil error:nil];

    NSArray *categoryArr = [categoryStr mj_JSONObject];

    // 直接给数组里面的字典进行模型赋值

    [CategoryInfomation mj_setupReplacedKeyFromPropertyName:^NSDictionary *{

        return @{@"categoryID":@"id",

                 @"categoryPic":@"pic",

                 @"categoryName":@"group",

                 @"secondClassificationLists":@"list"

                 };

    }];

    [CategoryInfomation mj_setupObjectClassInArray:^NSDictionary *{

        return @{@"secondClassificationLists":@"SecondCategoryInfomation"};

    }];

    // 子模型

    [SecondCategoryInfomation mj_setupReplacedKeyFromPropertyName:^NSDictionary *{

        return @{@"secondCategoryID":@"id",

                 @"secondCategoryName":@"name"

                 };

    }];

    // 通过数组加载数组模型，这里的类TWTBuyerMarket就是模型数组里面的小集合

    NSMutableArray *dataLists = [CategoryInfomation mj_objectArrayWithKeyValuesArray:categoryArr];

    // 把对应的每个分组的一级分组加入到二级分组里面去

    for (CategoryInfomation *category in dataLists)

    {

        NSMutableArray *secondLists = category.secondClassificationLists;

        SecondCategoryInfomation *secondNewModel = [[SecondCategoryInfomation alloc] init];

        secondNewModel.secondCategoryID = category.categoryID;

        secondNewModel.secondCategoryName = category.categoryName;

        [secondLists insertObject:secondNewModel atIndex:0];

    }

    if (block)

    {

        block(dataLists,nil);

    }

}

第三步

tableView的布局就不介绍了，高度计算简单提下

// 给CollectionView加载对应的数据  selectedIndex传的是具体的 0 1 2哪一个被点击了 同时拿出collectionView的高度

    NSInteger idx = indexpath.row * 3 + selectedIndex;

    CategoryInfomation *category = self.categoryLists[idx];

    cell.secondClassificationLists = category.secondClassificationLists;

    cell.collectionView.width = SCREEN_WIDTH;

    [cell.collectionView reloadData];

    cell.selectedHeightConstraint.constant = cell.collectionView.collectionViewLayout.collectionViewContentSize.height > 200 ? 200 : cell.collectionView.collectionViewLayout.collectionViewContentSize.height;

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath

{

    CGFloat singleWidth = (SCREEN_WIDTH - 6) / 3;

    __weak typeof(self)weakSelf = self;

    // 能被整除，那么肯定都展示三个

    if (self.canDivisible)

    {

        CategoryInfomation *category = self.categoryLists[indexPath.row * 3 + 0];

        CategoryInfomation *category1 = self.categoryLists[indexPath.row * 3 + 1];

        CategoryInfomation *category2 = self.categoryLists[indexPath.row * 3 + 2];

        // 三个钟有一个是需要打开的，那么就加载选择状态下的cell

        if (category.needShowSecondClassification || category1.needShowSecondClassification || category2.needShowSecondClassification)

        {

            NSInteger selectedIndex;

            if (category.needShowSecondClassification)

            {

                selectedIndex = 0;

            }

            else if (category1.needShowSecondClassification)

            {

                selectedIndex = 1;

            }

            else

            {

                selectedIndex = 2;

            }

            return [tableView fd_heightForCellWithIdentifier:selectedIdentify cacheByIndexPath:indexPath configuration:^(CategoryNormalTableViewCell *cell)

                    {

                        [weakSelf configSelectedCell:cell indexpath:indexPath selectedIndex:selectedIndex];

                    }];

        }

        else

        {

            return 0.8 * singleWidth + 3;

        }

    }

    return 0;

}

第四步 （主要逻辑就在这里）

点击事件切换cell，实现Demo的效果，直接看代码来的实在

#pragma mark - 点击图片的代理回调

- (void)clickImageViewCallBack:(CategoryNormalTableViewCell *)cell imageIndex:(NSInteger)idx

{

    // 获取到那个Indexpath

    NSIndexPath *indexpath = [self.tableView indexPathForCell:cell];

    // 获取到数组里面的第几个

    NSInteger index = indexpath.row * 3 + idx;

    // 获取对象

    CategoryInfomation *category = self.categoryLists[index];

    // 修改字段

    // 点击同一个

    if (self.tempCategoryInfomation == category)

    {

        <code clas    

本文由职坐标整理并发布，希望对同学们有所帮助。了解更多详情请关注职坐标移动开发之IOS频道！