山寨“饿了么”应用中添加菜品数量按钮效果

本人视频教程系类  

最终效果：

山寨源头：

源码：（此源码解决了重用问题，可以放心的放在cell中使用）

AddAndDeleteButton.h 与 AddAndDeleteButton.m

////  AddAndDeleteButton.h//  LabelControll////  Created by YouXianMing on 14/12/11.//  Copyright (c) 2014年 YouXianMing. All rights reserved.//#import 
     
      typedef enum : NSUInteger {    CNY, // 人民币    GBP, // 英镑    JPY, // 日元    USD, // 美元} EnumMoneyType;@protocol AddAndDeleteButtonDelegate 
      
       @optional- (void)currentCount:(NSNumber *)count;@end@interface AddAndDeleteButton : UIView@property (nonatomic, weak)    id
       
         delegate;/** *  数目（数目为0就会隐藏） */@property (nonatomic, strong) NSNumber *count;/** *  单价（商品单价） */@property (nonatomic, strong) NSNumber *price;/** *  设置数目 * *  @param count   数目 *  @param animted 时候执行动画 */- (void)setCount:(NSNumber *)count animated:(BOOL)animted;/** *  起始值 * *  @param count 值 */- (void)startValue:(NSNumber *)count;@end
       
      
     

////  AddAndDeleteButton.m//  LabelControll////  Created by YouXianMing on 14/12/11.//  Copyright (c) 2014年 YouXianMing. All rights reserved.//#import "AddAndDeleteButton.h"typedef enum : NSUInteger {    UIBUTTON_ADD = 10,    UIBUTTON_DELETE,} EnumAddAndDeleteButton;// 控件总体的宽度static CGFloat width          = 150;// 控件总体的高度static CGFloat height         = 28;// 添加按钮的宽度static CGFloat addButtonWidth = 60;// 控件之间的间隙static CGFloat gap             = 7;static CGFloat label_10_99       = 5;static CGFloat label_100_999     = 10;// 隐藏位置的frame值(后面要用)static CGRect  hidenRect;  // 0static CGRect  labelRect;  // 1 - 9static CGRect  deleteRect; // 1 - 9static CGRect  labelRect_10_99;  // 10 - 99static CGRect  deleteRect_10_99; // 10 - 99static CGRect  labelRect_100_999;  // 100 - 999static CGRect  deleteRect_100_999; // 100 - 999@interface AddAndDeleteButton ()@property (nonatomic, strong) UIView    *backedView;@property (nonatomic, strong) UIButton  *addButton;    // 添加的按钮@property (nonatomic, strong) UILabel   *countLabel;   // 计数的标签@property (nonatomic, strong) UIButton  *deleteButton; // 删除的按钮@end@implementation AddAndDeleteButton+ (void)initialize {    if (self == [AddAndDeleteButton class]) {        // 0时候的frame值        hidenRect  = CGRectMake(width - height, 0, height, height);                // 1到9的frame值        labelRect  = CGRectMake(width - addButtonWidth - gap - height, 0, height, height);        deleteRect = CGRectMake(width - addButtonWidth - (gap + height)*2, 0, height, height);                // 10到99的frame值        labelRect_10_99 = CGRectMake(width - addButtonWidth - gap - (height + label_10_99), 0,                                     height + label_10_99, height);        deleteRect_10_99 = CGRectMake(width - addButtonWidth - (gap + height) - (gap + height + label_10_99), 0,                                      height, height);                // 100到999的frame值        labelRect_100_999 = CGRectMake(width - addButtonWidth - gap - (height + label_100_999), 0,                                     height + label_100_999, height);        deleteRect_100_999 = CGRectMake(width - addButtonWidth - (gap + height) - (gap + height + label_100_999), 0,                                      height, height);    }}- (instancetype)initWithFrame:(CGRect)frame{    self = [super initWithFrame:frame];    if (self) {                // 添加背景图层        _backedView                   = [[UIView alloc] initWithFrame:CGRectMake(0, 0, width, height)];        [self addSubview:_backedView];                // 计数的标签        _countLabel = [[UILabel alloc] initWithFrame:CGRectMake(width - addButtonWidth - gap - height, 0, height, height)];                _countLabel.backgroundColor     = [UIColor whiteColor];        _countLabel.layer.backgroundColor = [UIColor whiteColor].CGColor;        _countLabel.layer.borderWidth   = 1.f;        _countLabel.layer.cornerRadius  = 4.f;        _countLabel.layer.masksToBounds = YES;        _countLabel.layer.borderColor   = [UIColor colorWithRed:0.898 green:0.898 blue:0.902 alpha:1].CGColor;        _countLabel.text                = @"0";        _countLabel.textAlignment       = NSTextAlignmentCenter;        _countLabel.textColor           = [UIColor colorWithRed:0.945 green:0.102 blue:0.325 alpha:1];        [self addSubview:_countLabel];                // 删除按钮        _deleteButton = [[UIButton alloc] initWithFrame:CGRectMake(width - addButtonWidth - (gap + height)*2, 0, height, height)];        _deleteButton.backgroundColor     = [UIColor colorWithRed:0.792 green:0.796 blue:0.800 alpha:1];        _deleteButton.tag                 = UIBUTTON_DELETE;        [_deleteButton addTarget:self                          action:@selector(buttonsEvent:)                forControlEvents:UIControlEventTouchUpInside];        _deleteButton.layer.cornerRadius  = 4.f;        _deleteButton.layer.masksToBounds = YES;        [self addSubview:_deleteButton];                // 添加按钮        _addButton = [[UIButton alloc] initWithFrame:CGRectMake(width - addButtonWidth, 0, addButtonWidth, height)];        [_addButton setTitle:@"$10.00" forState:UIControlStateNormal];        [_addButton addTarget:self                       action:@selector(buttonsEvent:)             forControlEvents:UIControlEventTouchUpInside];        _addButton.tag = UIBUTTON_ADD;        [_addButton setTitleColor:[UIColor colorWithRed:0.957 green:0.984 blue:0.949 alpha:1]                         forState:UIControlStateNormal];                _addButton.titleLabel.font    = [UIFont systemFontOfSize:16.f];        _addButton.layer.cornerRadius = 4.f;        _addButton.backgroundColor    = [UIColor colorWithRed:0.475 green:0.796 blue:0.329 alpha:1];        [self addSubview:_addButton];    }    return self;}- (void)buttonsEvent:(UIButton *)button {    if (button.tag == UIBUTTON_ADD) {        [self setCount:@(self.count.intValue + 1) animated:YES];    } else if (button.tag == UIBUTTON_DELETE) {        [self setCount:@(self.count.intValue - 1) animated:YES];    }            if (_delegate && [_delegate respondsToSelector:@selector(currentCount:)]) {        [_delegate currentCount:self.count];    }}- (void)startValue:(NSNumber *)count {    if (count.integerValue == 0) {        self.count = count;                _countLabel.frame = hidenRect;        _countLabel.alpha = 0.f;        _countLabel.text  = @"0";        _deleteButton.frame = hidenRect;        _deleteButton.alpha = 0.f;                return;    }        if (count.integerValue >= 1 && count.integerValue <= 9) {        self.count = count;                _countLabel.frame = labelRect;        _countLabel.alpha = 1.f;        _countLabel.text  = count.stringValue;        _deleteButton.frame = deleteRect;        _deleteButton.alpha = 1.f;                return;    }        if (count.integerValue >= 10 && count.integerValue <= 99) {        self.count = count;                _countLabel.frame = labelRect_10_99;        _countLabel.alpha = 1.f;        _countLabel.text  = count.stringValue;        _deleteButton.frame = deleteRect_10_99;        _deleteButton.alpha = 1.f;                return;    }        if (count.integerValue >= 100 && count.integerValue <= 999) {        self.count = count;                _countLabel.frame = labelRect_100_999;        _countLabel.alpha = 1.f;        _countLabel.text  = count.stringValue;        _deleteButton.frame = deleteRect_100_999;        _deleteButton.alpha = 1.f;                return;    }}- (void)setCount:(NSNumber *)count animated:(BOOL)animted {    if (count.intValue == 1000) {        return;    }        _count = count;        // 设置数为0而且标签上的值为1时（从1减到0的情况)   1 --> 0    if (count.intValue == 0 && _countLabel.text.intValue == 1) {        if (animted) {            [UIView animateWithDuration:0.35f animations:^{                _countLabel.frame = hidenRect;                _countLabel.alpha = 0.f;                _countLabel.text  = @"0";                _deleteButton.frame = hidenRect;                _deleteButton.alpha = 0.f;            }];        } else {            _countLabel.frame = hidenRect;            _countLabel.alpha = 0.f;            _countLabel.text  = @"0";            _deleteButton.frame = hidenRect;            _deleteButton.alpha = 0.f;        }                return;    }        // 设置数目为1而且标签上的值为0时（从0加到1的情况） 0 --> 1    if (count.intValue == 1 && _countLabel.text.intValue == 0) {        if (animted) {            [UIView animateWithDuration:0.35f animations:^{                _countLabel.frame   = labelRect;                _countLabel.alpha   = 1.f;                _countLabel.text    = @"1";                _deleteButton.frame = deleteRect;                _deleteButton.alpha = 1.f;            }];        } else {            _countLabel.frame   = labelRect;            _countLabel.alpha   = 1.f;            _countLabel.text    = @"1";            _deleteButton.frame = deleteRect;            _deleteButton.alpha = 1.f;        }                return;    }        // 设置数目从9到10时候的动画   9 --> 10    if (count.intValue == 10 && _countLabel.text.intValue == 9) {        if (animted) {            [UIView animateWithDuration:0.35f animations:^{                _countLabel.frame   = labelRect_10_99;                _countLabel.alpha   = 1.f;                _countLabel.text    = @"10";                _deleteButton.frame = deleteRect_10_99;                _deleteButton.alpha = 1.f;            }];        } else {            _countLabel.frame   = labelRect_10_99;            _countLabel.alpha   = 1.f;            _countLabel.text    = @"10";            _deleteButton.frame = deleteRect_10_99;            _deleteButton.alpha = 1.f;        }                return;    }        // 设置数目从9到10时候的动画  10 --> 9    if (count.intValue == 9 && _countLabel.text.intValue == 10) {        if (animted) {            [UIView animateWithDuration:0.35f animations:^{                _countLabel.frame   = labelRect;                _countLabel.alpha   = 1.f;                _countLabel.text    = @"9";                _deleteButton.frame = deleteRect;                _deleteButton.alpha = 1.f;            }];        } else {            _countLabel.frame   = labelRect;            _countLabel.alpha   = 1.f;            _countLabel.text    = @"9";            _deleteButton.frame = deleteRect;            _deleteButton.alpha = 1.f;        }                return;    }            // 99 --> 100    if (count.intValue == 100 && _countLabel.text.intValue == 99) {        if (animted) {            [UIView animateWithDuration:0.35f animations:^{                _countLabel.frame   = labelRect_100_999;                _countLabel.alpha   = 1.f;                _countLabel.text    = @"100";                _deleteButton.frame = deleteRect_100_999;                _deleteButton.alpha = 1.f;            }];        } else {            _countLabel.frame   = labelRect_100_999;            _countLabel.alpha   = 1.f;            _countLabel.text    = @"100";            _deleteButton.frame = deleteRect_100_999;            _deleteButton.alpha = 1.f;        }                return;    }        // 100 --> 99    if (count.intValue == 99 && _countLabel.text.intValue == 100) {        if (animted) {            [UIView animateWithDuration:0.35f animations:^{                _countLabel.frame   = labelRect_10_99;                _countLabel.alpha   = 1.f;                _countLabel.text    = @"99";                _deleteButton.frame = deleteRect_10_99;                _deleteButton.alpha = 1.f;            }];        } else {            _countLabel.frame   = labelRect_10_99;            _countLabel.alpha   = 1.f;            _countLabel.text    = @"99";            _deleteButton.frame = deleteRect_10_99;            _deleteButton.alpha = 1.f;        }                return;    }            // 11 - 98    if (count.intValue >= 10 && count.intValue <= 99) {        _countLabel.frame   = labelRect_10_99;        _countLabel.text    = count.stringValue;        _deleteButton.frame = deleteRect_10_99;                return;    }        // 2 --> 8    if (count.intValue >= 1 && count.intValue <= 9) {        _countLabel.frame   = labelRect;        _countLabel.text    = count.stringValue;        _deleteButton.frame = deleteRect;                return;    }        if (count.intValue >= 100 && count.intValue <= 999) {        _countLabel.frame   = labelRect_100_999;        _countLabel.text    = count.stringValue;        _deleteButton.frame = deleteRect_100_999;                return;    }}@end

使用源码：

AddAndDeleteButton *button = [[AddAndDeleteButton alloc] initWithFrame:CGRectMake(100, 0, 150, 28)];    [button startValue:@(0)];    button.transform           = CGAffineTransformScale(button.transform, 1.5, 1.5);    button.center              = self.view.center;    [self.view addSubview:button];

控制器源码：

////  ViewController.m//  LabelControll////  Created by YouXianMing on 14/12/11.//  Copyright (c) 2014年 YouXianMing. All rights reserved.//#import "ViewController.h"#import "AddAndDeleteButton.h"#import "YXCell.h"static NSString *test = @"YouXianMing";@interface ViewController ()
     
      @property (nonatomic, strong) UITableView    *tableView;@property (nonatomic, strong) NSMutableArray *dataArray;@end@implementation ViewController- (void)viewDidLoad {    [super viewDidLoad];        _dataArray = [[NSMutableArray alloc] init];    for (int i = 0; i < 20; i++) {        [_dataArray addObject:@(i)];    }        _tableView            = [[UITableView alloc] initWithFrame:self.view.bounds                                              style:UITableViewStylePlain];    _tableView.delegate   = self;    _tableView.dataSource = self;    [self.view addSubview:_tableView];        [_tableView registerClass:[YXCell class] forCellReuseIdentifier:test];}- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {    return 20;}- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {    YXCell *cell = [tableView dequeueReusableCellWithIdentifier:test];    cell.selectionStyle = UITableViewCellSelectionStyleNone;    cell.delegate = self;        [cell.button startValue:_dataArray[indexPath.row]];    return cell;}- (void)currentCount:(NSNumber *)count cell:(YXCell *)cell {    NSIndexPath *path = [_tableView indexPathForCell:cell];    [_dataArray replaceObjectAtIndex:path.row withObject:count];}@end
     

////  YXCell.h//  LabelControll////  Created by YouXianMing on 14/12/11.//  Copyright (c) 2014年 YouXianMing. All rights reserved.//#import 
     
      #import "AddAndDeleteButton.h"@class YXCell;@protocol YXCellDelegate 
      
       @optional- (void)currentCount:(NSNumber *)count cell:(YXCell *)cell;@end@interface YXCell : UITableViewCell@property (nonatomic, weak)    id
       
          delegate;@property (nonatomic, strong)  AddAndDeleteButton *button;@end
       
      
     

////  YXCell.m//  LabelControll////  Created by YouXianMing on 14/12/11.//  Copyright (c) 2014年 YouXianMing. All rights reserved.//#import "YXCell.h"@interface YXCell ()
     
      @end@implementation YXCell- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];    if (self) {        _button = [[AddAndDeleteButton alloc] initWithFrame:CGRectMake(100, 0, 150, 28)];        _button.delegate = self;        [_button startValue:@(0)];        [self addSubview:_button];    }        return self;}- (void)currentCount:(NSNumber *)count {    if (_delegate && [_delegate respondsToSelector:@selector(currentCount:cell:)]) {        [_delegate currentCount:count cell:self];    }}@end