//
//  MyTableViewCell.h
//  仿百度外卖-点餐效果
//
//  Created by Amydom on 16/12/5.
//  Copyright © 2016年 Amydom. All rights reserved.
//#import <UIKit/UIKit.h>
//block 用于响应 cell 上 button 点击方法
typedef void (^btnPulsBlock)(NSInteger count , BOOL animated);@interface MyTableViewCell : UITableViewCell@property (nonatomic, strong) UIImageView *foodImage;   // cyan
@property (nonatomic, strong) UILabel *nameLabel;       // orange
@property (nonatomic, strong) UILabel *priceLabel;      // gray
@property (nonatomic, strong) UIButton *btnMinus;       // black
@property (nonatomic, strong) UIButton *btnPlus;        // black
@property (nonatomic, strong) UILabel *orderCount;      // red
@property (nonatomic, copy)   btnPulsBlock block;       // block
@property (nonatomic, strong) UIImageView *animateView; // 购物车图标
@property (nonatomic, assign) NSInteger numCount;       // 计数器@end

//
//  MyTableViewCell.m
//  仿百度外卖-点餐效果
//
//  Created by Amydom on 16/12/5.
//  Copyright © 2016年 Amydom. All rights reserved.
//#import "MyTableViewCell.h"
#import "Masonry.h"@implementation MyTableViewCell- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier{self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];if (self) {[self createSubviews];}return self;
}- (void)createSubviews
{//因为采用懒加载,所以用 self 走控件的 getter 方法[self.contentView addSubview:self.foodImage];[self.contentView addSubview:self.nameLabel];[self.contentView addSubview:self.priceLabel];[self.contentView addSubview:self.btnMinus];[self.contentView addSubview:self.btnPlus];[self.contentView addSubview:self.orderCount];
}
//懒加载
- (UIImageView *)foodImage
{if (!_foodImage) {_foodImage = [[UIImageView alloc] init];}return _foodImage;
}
- (UILabel *)nameLabel
{if (!_nameLabel) {_nameLabel = [[UILabel alloc] init];}return _nameLabel;
}
- (UILabel *)priceLabel
{if (!_priceLabel) {_priceLabel = [[UILabel alloc] init];}return _priceLabel;
}
- (UIButton *)btnMinus
{if (!_btnMinus) {_btnMinus = [UIButton buttonWithType:UIButtonTypeCustom];}return _btnMinus;
}
- (UIButton *)btnPlus
{if (!_btnPlus) {_btnPlus = [UIButton buttonWithType:UIButtonTypeCustom];}return _btnPlus;
}
- (UILabel *)orderCount
{if (!_orderCount) {_orderCount = [[UILabel alloc] init];}return _orderCount;
}//进行布局(由于animate 会使控件发生变化,所以在layoutSubviews里进行正式的布局)
- (void)layoutSubviews{[super layoutSubviews];[self.foodImage mas_makeConstraints:^(MASConstraintMaker *make) {//上make.top.equalTo(self.contentView.mas_top).with.offset(5.0);//左make.left.equalTo(self.contentView.mas_left).with.offset(5.0);//宽make.width.equalTo(@88.0);//高make.height.equalTo(@88.0);}];self.foodImage.backgroundColor = [UIColor cyanColor];[self.nameLabel mas_makeConstraints:^(MASConstraintMaker *make) {//左距离 foodimage 右的距离make.left.equalTo(_foodImage.mas_right).with.offset(5.0);make.top.equalTo(self.contentView.mas_top).with.offset(5.0);make.right.equalTo(self.contentView.mas_right).with.offset(-5.0);make.height.equalTo(@30);}];self.nameLabel.backgroundColor = [UIColor orangeColor];[self.priceLabel mas_makeConstraints:^(MASConstraintMaker *make) {//左,与_nameLabel一样make.left.equalTo(_nameLabel);make.width.equalTo(@50);make.height.equalTo(@30);//下make.bottom.equalTo(self.contentView.mas_bottom).with.offset(-5);}];self.priceLabel.backgroundColor = [UIColor lightGrayColor];[self.btnMinus mas_makeConstraints:^(MASConstraintMaker *make) {//x轴中心make.centerX.equalTo(_nameLabel);//y 轴中新make.centerY.equalTo(self.contentView);//长 宽make.width.height.mas_equalTo(CGSizeMake(25, 25));}];self.btnMinus.backgroundColor = [UIColor blackColor];[self.orderCount mas_makeConstraints:^(MASConstraintMaker *make) {make.left.equalTo(_btnMinus.mas_right).with.offset(10);make.centerY.equalTo(self.contentView);make.width.height.mas_equalTo(CGSizeMake(35, 25));}];self.orderCount.backgroundColor = [UIColor redColor];[self.btnPlus mas_makeConstraints:^(MASConstraintMaker *make) {make.left.equalTo(_orderCount.mas_right).with.offset(10);make.centerY.equalTo(self.contentView);make.width.height.mas_equalTo(CGSizeMake(25, 25));}];self.btnPlus.backgroundColor = [UIColor blackColor];[_btnMinus setTitle:@"减" forState:UIControlStateNormal];[_btnMinus addTarget:self action:@selector(clickMin:) forControlEvents:UIControlEventTouchUpInside];[_btnPlus setTitle:@"加" forState:UIControlStateNormal];[_btnPlus addTarget:self action:@selector(clickPuls:) forControlEvents:UIControlEventTouchUpInside];}//btn 点击方法(加)
- (void)clickPuls:(UIButton *)btn{self.numCount += 1;self.block(self.numCount , YES);[self showOrderNums:self.numCount];}
//btn 点击方法(减)
- (void)clickMin:(UIButton *)btn
{self.numCount -= 1;self.block(self.numCount, NO);[self showOrderNums:self.numCount];
}//显示数量
-  (void)showOrderNums : (NSInteger)numCount{self.orderCount.text = [NSString stringWithFormat:@"%ld",(long)numCount];}- (void)awakeFromNib {[super awakeFromNib];// Initialization code
}- (void)setSelected:(BOOL)selected animated:(BOOL)animated {[super setSelected:selected animated:animated];// Configure the view for the selected state
}@end

//
//  ViewController.h
//  仿百度外卖-点餐效果
//
//  Created by Amydom on 16/12/5.
//  Copyright © 2016年 Amydom. All rights reserved.
//#import <UIKit/UIKit.h>@interface ViewController : UIViewController@end

//
//  ViewController.m
//  仿百度外卖-点餐效果
//
//  Created by Amydom on 16/12/5.
//  Copyright © 2016年 Amydom. All rights reserved.
//#import "ViewController.h"
#import "MyTableViewCell.h"
#import "shopCartView.h"@interface ViewController ()<CAAnimationDelegate , UITableViewDelegate , UITableViewDataSource>{CGFloat _endPoint_x;CGFloat _endPoint_y;UIBezierPath *_path;CALayer *_dotLayer;}@property (nonatomic , strong)shopCartView *shopCartView;@end@implementation ViewController- (void)viewDidLoad {[super viewDidLoad];self.view.backgroundColor = [UIColor whiteColor];UITableView *tableView = [[UITableView alloc]initWithFrame:self.view.bounds style:UITableViewStylePlain];tableView.delegate = self;tableView.dataSource = self;[tableView registerClass:[MyTableViewCell class] forCellReuseIdentifier:@"MyTableViewCell"];[self.view addSubview:tableView];_shopCartView = [[shopCartView alloc]initWithFrame:CGRectMake(0, self.view.frame.size.height - 100 , self.view.frame.size.width, 100)];_shopCartView.backgroundColor = [UIColor lightGrayColor];[self.view addSubview:_shopCartView];}- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{return 10;}- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{static NSString *indetifier = @"MyTableViewCell";MyTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:indetifier];//block 回调__weak __typeof(& *cell) weakCell = cell;//防止循环引用cell.block = ^(NSInteger nCount , BOOL boo){CGRect parentRect = [weakCell convertRect:weakCell.btnPlus.frame toView:self.view];if (boo) {// 这里是动画开始的方法[self JoinCartAnimationWithRect:parentRect];}else{}};return cell;}- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{return 100;}#pragma mark - animated
//加入购物车动画
-(void) JoinCartAnimationWithRect:(CGRect)rect{//紫色小方块结束点_endPoint_x = 35;_endPoint_y = self.view.frame.size.height - 35;//紫色小方块开始点CGFloat startX = rect.origin.x;CGFloat startY = rect.origin.y;//绘制贝塞尔曲线_path = [UIBezierPath bezierPath];[_path moveToPoint:CGPointMake(startX, startY)];//三点曲线--既让紫色小方块的下滑线路[_path addCurveToPoint:CGPointMake(_endPoint_x, _endPoint_y) controlPoint1:CGPointMake(startX, startY) controlPoint2:CGPointMake(startX - 180, startY - 200)];//下滑时的紫色小方块_dotLayer = [CALayer layer];_dotLayer.backgroundColor = [UIColor purpleColor].CGColor;_dotLayer.frame = CGRectMake(0, 0, 20, 20);_dotLayer.cornerRadius = 5;[self.view.layer addSublayer:_dotLayer];[self groupAnimation];
}#pragma mark - 组合动画
-(void)groupAnimation{CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];animation.path = _path.CGPath;animation.rotationMode = kCAAnimationRotateAuto;CABasicAnimation *alphaAnimation = [CABasicAnimation animationWithKeyPath:@"alpha"];alphaAnimation.duration = 0.5f;alphaAnimation.fromValue = [NSNumber numberWithFloat:1.0];alphaAnimation.toValue = [NSNumber numberWithFloat:0.1];alphaAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];CAAnimationGroup *groups = [CAAnimationGroup animation];groups.animations = @[animation,alphaAnimation];groups.duration = 0.8f;groups.removedOnCompletion = NO;groups.fillMode = kCAFillModeForwards;groups.delegate = self;[groups setValue:@"groupsAnimation" forKey:@"animationName"];[_dotLayer addAnimation:groups forKey:nil];[self performSelector:@selector(removeFromLayer:) withObject:_dotLayer afterDelay:0.8f];
}- (void)animationDidStop:(CAAnimation *)anim finished:(BOOL)flag
{if ([[anim valueForKey:@"animationName"]isEqualToString:@"groupsAnimation"]) {CABasicAnimation *shakeAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];shakeAnimation.duration = 0.25f;shakeAnimation.fromValue = [NSNumber numberWithFloat:0.9];shakeAnimation.toValue = [NSNumber numberWithFloat:1];shakeAnimation.autoreverses = YES;// 这里是下方的自定义View上面 放的btn.[_shopCartView.btnBackImg.layer addAnimation:shakeAnimation forKey:nil];}
}
//移除layer动画
- (void)removeFromLayer:(CALayer *)layerAnimation{[layerAnimation removeFromSuperlayer];
}- (void)didReceiveMemoryWarning {[super didReceiveMemoryWarning];// Dispose of any resources that can be recreated.
}@end

注:

_shopCartView 这个里面 其实就是放了一个 button 别的什么都没写,可以根据自己的需要用自定义 view 或者直接在 Controller 里随便写一个就行