iOS开发之自定义ActionSheet视图

有时我们需要用到actionSheet来展示，但是但是往往系统的界面显示很丑或者并不符合UI的要求，所以在这里自定义一个，方便以后使用，后续有时间写一下Swift的开发。

自定义ActionSheet的关键点，就是UI的样式修改和设计调整，还有就是点击单元格时进行的后续操作，再一个就是界面显示的平滑度。

首先界面设计：

创建一个半透明的背景视图；

然后一个表格，表格分成两个区，设置标题头、区尾和单元格边角

//背景- (UIView*)maskView {    if (!_maskView) {        _maskView = [[UIView alloc]initWithFrame:[UIScreen mainScreen].bounds];        _maskView.backgroundColor = [UIColor blackColor];        _maskView.alpha = 0.5;        _maskView.userInteractionEnabled = YES;    }    return _maskView;}//表格- (UITableView *)tableView {    if (!_tableView) {        _tableView = [[UITableView alloc]initWithFrame:CGRectZero style:UITableViewStylePlain];        _tableView.delegate = self;        _tableView.dataSource = self;        _tableView.layer.cornerRadius = 10;        _tableView.clipsToBounds = YES;        _tableView.rowHeight = 44.0;        _tableView.bounces = NO;        _tableView.backgroundColor = [UIColor clearColor];        _tableView.tableHeaderView = self.headView;        _tableView.separatorInset = UIEdgeInsetsMake(0, -50, 0, 0);        [_tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:@"OneCell"];    }    return _tableView;}#pragma mark <UITableViewDelegate,UITableViewDataSource>- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {    return 2;}- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {    return (section == 0)?_cellArray.count:1;}- (UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"OneCell"];    if (indexPath.section == 0) {        cell.textLabel.text = _cellArray[indexPath.row];        if (indexPath.row == _cellArray.count - 1) {                        //添加贝塞尔曲线，UIBezierPath与CAShapeLayer设计边角样式            /*             byRoundingCorners即为设置所需处理边角参数,有如下枚举克进行选择：             typedef NS_OPTIONS(NSUInteger, UIRectCorner) {             UIRectCornerTopLeft     = 1 << 0,//左上圆角             UIRectCornerTopRight    = 1 << 1,//右上圆角             UIRectCornerBottomLeft  = 1 << 2,//左下圆角             UIRectCornerBottomRight = 1 << 3,//右下圆角             UIRectCornerAllCorners  = ~0UL   //四角圆角             };             */            UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, Screen_Width - (Space_Line * 2), tableView.rowHeight) byRoundingCorners:UIRectCornerBottomLeft|UIRectCornerBottomRight cornerRadii:CGSizeMake(10, 10)];            CAShapeLayer *maskLayer = [[CAShapeLayer alloc]init];            maskLayer.frame = cell.contentView.bounds;            maskLayer.path = maskPath.CGPath;            cell.layer.mask = maskLayer;        }    } else {        cell.textLabel.text = _cancelTitle;        cell.layer.cornerRadius = 10;    }    cell.textLabel.textAlignment = NSTextAlignmentCenter;    cell.selectionStyle = UITableViewCellSelectionStyleNone;    return cell;}- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {    if (indexPath.section == 0) {        if (self.selectedBlock) {            self.selectedBlock(indexPath.row);        }    } else {        if (self.cancelBlock) {            self.cancelBlock();        }    }    [self dismiss];}- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section {    return Space_Line;}- (UIView*)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section {    UIView *footerView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, tableView.bounds.size.width, Space_Line)];    footerView.backgroundColor = [UIColor clearColor];    return footerView;}

界面设计完成，需要考虑的就是弹出、消失的问题

/滑动弹出- (void)show {    _tableView.frame = CGRectMake(Space_Line, Screen_Height, Screen_Width - (Space_Line * 2), _tableView.rowHeight * (_cellArray.count + 1) + _headView.bounds.size.height + (Space_Line * 2));    [UIView animateWithDuration:.5 animations:^{        CGRect rect = _tableView.frame;        rect.origin.y -= _tableView.bounds.size.height;        _tableView.frame = rect;    }];}//滑动消失- (void)dismiss {    [UIView animateWithDuration:.5 animations:^{        CGRect rect = _tableView.frame;        rect.origin.y += _tableView.bounds.size.height;        _tableView.frame = rect;    } completion:^(BOOL finished) {        [self removeFromSuperview];    }];}#pragma mark ------ 触摸屏幕其他位置弹下- (void)touchesEnded:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event {    [self dismiss];}

最后是对自定义的视图的调用：

//弹出ActionSheet    __weak typeof(self) weakSelf = self;    JasonActionSheetView *jasonSheetView = [[JasonActionSheetView alloc]initWithHeadView:self.headView cellArray:self.dataArr cancelTitle:@"取消" selectedBlock:^(NSInteger index) {        //点击单元格后续操作        if (index == 0) {            weakSelf.view.backgroundColor = [UIColor redColor];        }else if(index == 1){            weakSelf.view.backgroundColor = [UIColor yellowColor];        }else{            weakSelf.view.backgroundColor = [UIColor lightGrayColor];        }    } cancelBlock:^{        NSLog(@"点击了取消........");    }];        [self.view addSubview:jasonSheetView];

效果图：

源码：https://github.com/hbblzjy/OC-JasonActionSheet