iOS仿淘宝购物车

作者: SwordDevil | 来源:发表于2017-02-24 09:49 被阅读966次

iOS仿淘宝购物车
Android仿淘宝购物车
仿淘宝购物车
iOS-购物车动画
MultiTypeAdapter（仿淘宝购物车）
vlayout
iOS高仿QQ侧滑控件、下载框架、动画效果、扫一扫、颜色变化、K
iOS源码博文集锦3
[vue]仿淘宝app购物车实现
仿写天猫淘宝购物车

很多做电商的朋友，总会被购物车所烦恼，因为不知道怎么去选择商品，或者是带商店的商品。这里我就简单的介绍下我的思路

1.将商店或者商品的选择状态保存到model里面，这样可以避免每次滚动的时候 cell重用

/**商品是否被选中*/
@property (nonatomic, assign, getter=isSelected) BOOL selected;
/**商店是否被选中*/ // 选中商店下边的所有商品
@property (nonatomic, assign, getter=isAllSelect) BOOL allSelect;

/**商品标题*/
@property (nonatomic, copy) NSString *name;
/**商品图标*/
@property (nonatomic, copy) NSString *icon;
/**商品单价*/
@property (nonatomic, copy) NSString *price;
/**购买数量*/
@property (nonatomic, assign) int buyCount;

@property (nonatomic, copy) NSMutableArray *numArray; // 存放商品个数

2.我这里是分商品对应的商店的，以商店的数量作为section，商品的数量作为row 每个section上都加一个代表商店的cell

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    
    if (indexPath.row == 0) {
        static NSString *ID = @"shopCell1";
        JPShopHeaderCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
        if (!cell) {
            cell = [[NSBundle mainBundle]loadNibNamed:@"JPShopHeaderCell" owner:nil options:nil].lastObject;
        }

        JPCarModel *product = self.dataArray[indexPath.section];
        cell.model = product;
        return cell;
    }else
    {
        static NSString *ID = @"shopCell2";
        JPShopCarCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
        if (cell==nil) {
            cell = [[NSBundle mainBundle] loadNibNamed:@"JPShopCarCell" owner:nil options:nil].lastObject;
        }
        JPCarModel *product = self.dataArray[indexPath.section];
        JPCarModel *pro = product.numArray[indexPath.row - 1];
        cell.delegate = self;
        cell.model = pro;
        return cell;
    }
}

3.我这里是通过点击cell 的形式来确保点击按钮

-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
[tableView deselectRowAtIndexPath:indexPath animated:YES];
    if (indexPath.row == 0) {
        // 选中商店 全选商店对应的商品
        // 拿到点击行的数据模型
        JPCarModel *product = self.dataArray[indexPath.section];
        // 设置选中状态
        product.allSelect = !product.isAllSelect;
//        product.selected = product.allSelect;
        [product.numArray enumerateObjectsUsingBlock:^(JPCarModel *pro, NSUInteger idx, BOOL * _Nonnull stop) {
            pro.selected = product.allSelect;
        }];
        [self.tableView reloadData];
    } else
    {
        // 单独选中商品
        // 拿到点击行的数据模型
        JPCarModel *product = self.dataArray[indexPath.section];
        JPCarModel *pro = product.numArray[indexPath.row - 1];
        // 设置选中状态
        pro.selected = !pro.isSelected;
        // 刷新所选行
        [tableView reloadRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationNone];
    }
    // 计算显示总价格
    [self countingTotalPrice];
}

4.这里简单的写了一个cell的简单动画

// 复用队列
-(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
    cell.layer.transform = CATransform3DMakeScale(1.5, 1.5, 0);
    cell.alpha = 0.0;
    [UIView animateWithDuration:1 animations:^{
        cell.layer.transform = CATransform3DIdentity;
        cell.alpha = 1.0;
    }];
}

最终效果