前言:

各位同學(xué)大家好 裳食，有段時(shí)間沒(méi)有給大家更新文章了 幕与。 具體多久我也記不清楚了疗琉，春節(jié)放假比較早雁竞，所以就趁著有時(shí)間學(xué)習(xí)了一下iOS開(kāi)發(fā)的基礎(chǔ)知識(shí) 今天講的iOS UITableView 配和block 回調(diào)實(shí)現(xiàn)列表刪除教程 簿寂。那么廢話不多說(shuō) 漾抬，我們正式開(kāi)始。

準(zhǔn)備工作

安裝xcode 這個(gè)大家可以自己去appstore 搜索下載安裝即可

效果圖

QQ20210210-160354-HD[00_00_00--00_00_08].gif

具體實(shí)現(xiàn)

• 列表顯示

@interface ViewController ()<UITableViewDelegate,UITableViewDataSource,GTNotmalTableViewDelegate>
@property(nonatomic,strong,readwrite)UITableView * tableview;
@property(nonatomic,strong,readwrite)NSMutableArray * dataArray;
@end
@implementation ViewController
- (instancetype)init{
    self= [super init];
    if(self){
        _dataArray=@[].mutableCopy;
        for(int i=0; i<20;i++){
            [_dataArray addObject:@(i)];
        } 
    }
    return  self;
}
- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor= [UIColor whiteColor];
    _tableview= [[UITableView alloc]initWithFrame:self.view.bounds];
    _tableview.dataSource=self;
    _tableview.delegate=self;
    [self.view addSubview:_tableview];
}

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
    return 110 ;
}

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
    NSLog(@"%ld", indexPath.row)
    
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    return _dataArray.count;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    
  //UItableview cell 復(fù)用機(jī)制
    GTNormalTableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:@"id"];
    if(!cell){
    cell =[[GTNormalTableViewCell alloc]initWithStyle:UITableViewCellStyleSubtitle
                                reuseIdentifier:@"id"];
        cell.deledate=self;
    }
    [cell layoutTableViewCell];
    return  cell;
}
- (void) tableviewCell:(UITableViewCell *)tabviewCell clickDeleteButton:(UIButton * )deletebutton{
    NSLog(@"clickDeleteButton");
    GTDeleteCellView * deleteview =[[GTDeleteCellView alloc] initWithFrame:self.view.bounds];
    CGRect  rect =[tabviewCell  convertRect:deletebutton.frame  toView:nil];
    __weak typeof(self)wself= self;
    [deleteview showDeleteViewFromPoint:rect.origin clickBlock:^{
        __strong typeof  (self)strongSelf=wself;
        [strongSelf.dataArray removeLastObject];
        NSLog(@"clickBlock  回調(diào)");
        [self.tableview deleteRowsAtIndexPaths:@[[strongSelf.tableview indexPathForCell:tabviewCell]]
                              withRowAnimation:UITableViewRowAnimationAutomatic];
    
    } ];

}
@end

我們這邊調(diào)用系統(tǒng)的 UITableView 組件 實(shí)例化 然后添加自定義的cell 來(lái)實(shí)現(xiàn) 整個(gè)列表的展示

• 添加自定義的cell

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
  //UItableview cell 復(fù)用機(jī)制
    GTNormalTableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:@"id"];
    if(!cell){
    cell =[[GTNormalTableViewCell alloc]initWithStyle:UITableViewCellStyleSubtitle
                                reuseIdentifier:@"id"];
        cell.deledate=self;
    }
    [cell  layoutTableViewCell];
    return  cell;
}

• 自定義 cell 內(nèi)容

//
//  GTNormalTableViewCell.m
//  shop
//
//  Created by xuqing on 2021/1/27.
//  Copyright ? 2021 xuqing. All rights reserved.
//
#import "GTNormalTableViewCell.h"
@interface GTNormalTableViewCell()
@property(nonatomic,strong,readwrite)UILabel * titleLable;
@property(nonatomic,strong,readwrite)UILabel * sourceLable;
@property(nonatomic,strong,readwrite)UILabel * commentLable;
@property(nonatomic,strong,readwrite)UILabel * timeLable;
@property(nonatomic,strong,readwrite)UIImageView *richtimageview;
@property(nonatomic,strong,readwrite)UIButton* deletebutton;
@end

@implementation GTNormalTableViewCell
- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(nullable NSString *)
      reuseIdentifier {
    self=[super initWithStyle:style reuseIdentifier:reuseIdentifier];
    if(self){
        [self.contentView addSubview:({
            self.titleLable=[[UILabel alloc]initWithFrame:CGRectMake(20, 15, 300, 50)];
           // self.titleLable.backgroundColor=[UIColor redColor];
            self.titleLable;
        })];
        [self.contentView addSubview:({
            self.sourceLable=[[UILabel alloc]initWithFrame:CGRectMake(20, 80, 50, 20)];
          //  self.sourceLable.backgroundColor=[UIColor redColor];
            self.sourceLable;


        })];
        [self.contentView addSubview:({
            self.commentLable=[[UILabel alloc]initWithFrame:CGRectMake(100 ,80, 50, 20)];
           // self.commentLable.backgroundColor=[UIColor redColor];
            self.commentLable;
        })];


        [self.contentView addSubview:({
            self.timeLable=[[UILabel alloc]initWithFrame:CGRectMake(150, 80, 50, 20)];
          //  self.timeLable.backgroundColor=[UIColor redColor];
            self.timeLable;
        })];
        
        
        [self.contentView addSubview:({
            self.richtimageview=[[UIImageView alloc]initWithFrame:CGRectMake(330, 15, 70, 70)];
            self.richtimageview.backgroundColor=[UIColor redColor];
            self.richtimageview;
        })];
        
        
        [self.contentView addSubview:({
            self.deletebutton=[[UIButton alloc]initWithFrame:CGRectMake(290, 80, 30,20)];
            self.deletebutton.backgroundColor=[UIColor blueColor];
            [self.deletebutton setTitle:@"X" forState:UIControlStateNormal];
            [self.deletebutton setTitle:@"V" forState:UIControlStateHighlighted];
            [self.deletebutton addTarget:self action:@selector(deletebuttonClick) forControlEvents:UIControlEventTouchUpInside];
            
            self.deletebutton;
        })];
    
    }
    return  self;
}


- (void)layoutTableViewCell{
    self.titleLable.text=@"極客時(shí)間iOS開(kāi)發(fā)";
    self.sourceLable.text=@"極客時(shí)間";
    [self.sourceLable sizeToFit];

    self.commentLable.text=@"1999評(píng)論";
    [self.commentLable sizeToFit];
    self.commentLable.frame= CGRectMake(self.sourceLable.frame.origin.x+self.commentLable.frame.size.width+15,
                                        self.commentLable.frame.origin.y,   self.commentLable.frame.size.width, self.commentLable.frame.size.height);
    self.timeLable.text=@"三分鐘前";
    [self.timeLable sizeToFit];
    self.timeLable.frame= CGRectMake(self.commentLable.frame.origin.x+self.commentLable.frame.size.width+15,
                                     self.timeLable.frame.origin.y,   self.timeLable.frame.size.width, self.timeLable.frame.size.height);
}
- (void)deletebuttonClick{
    NSLog(@"deletebuttonClick");
    if(self.deledate &&[self.deledate respondsToSelector:@selector(tableviewCell:clickDeleteButton:)]){
        [self.deledate tableviewCell:self clickDeleteButton:self.deletebutton];
    }
}
@end

為我們的刪除按鈕添加點(diǎn)擊onClick 事件

[self.deletebutton addTarget:self action:@selector(deletebuttonClick) forControlEvents:UIControlEventTouchUpInside];

• 具體點(diǎn)擊事件

- (void)deletebuttonClick{
    NSLog(@"deletebuttonClick");
    if(self.deledate &&[self.deledate respondsToSelector:@selector(tableviewCell:clickDeleteButton:)]){
        [self.deledate tableviewCell:self clickDeleteButton:self.deletebutton];
    }
}

我們?cè)赾ell子布局里面的刪除按鈕的點(diǎn)擊事件調(diào)用了 clickDeleteButton 方法

@protocol GTNotmalTableViewDelegate <NSObject>
- (void) tableviewCell:(UITableViewCell *)tabviewCell clickDeleteButton:(UIButton * )deletebutton;
@end

然后 我們?cè)赩iewController 中實(shí)現(xiàn)clickDeleteButton 方法

- (void) tableviewCell:(UITableViewCell *)tabviewCell clickDeleteButton:(UIButton * )deletebutton{
    NSLog(@"clickDeleteButton");
    GTDeleteCellView * deleteview =[[GTDeleteCellView alloc] initWithFrame:self.view.bounds];
    CGRect  rect =[tabviewCell  convertRect:deletebutton.frame  toView:nil];
    __weak typeof(self)wself= self;
    [deleteview showDeleteViewFromPoint:rect.origin clickBlock:^{
        __strong typeof  (self)strongSelf=wself;
        [strongSelf.dataArray removeLastObject];
        NSLog(@"clickBlock  回調(diào)");
        [self.tableview deleteRowsAtIndexPaths:@[[strongSelf.tableview indexPathForCell:tabviewCell]]
                              withRowAnimation:UITableViewRowAnimationAutomatic];
    } ];
}

我們?cè)? clickDeleteButton 方法中初始化GTDeleteCellView 并顯示

• 彈出 GTDeleteCellView 具體實(shí)現(xiàn)

- (instancetype) initWithFrame:(CGRect)frame{
    
    self= [super initWithFrame:frame];
    if(self){
        
       [self addSubview:({
           _backgroundView=[[UIView alloc]initWithFrame:self.bounds];
           _backgroundView.backgroundColor=[UIColor blackColor];
           _backgroundView.alpha=0.5;
           [_backgroundView addGestureRecognizer:({
               UITapGestureRecognizer * tapGesture= [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(dismissDeleteView)];
               tapGesture;
           })];
           _backgroundView;
       })];
        [self addSubview:({
            _deleteButton=[[UIButton alloc]initWithFrame:CGRectMake(0, 0, 100, 50)];
            _deleteButton.titleLabel.textColor = [UIColor whiteColor];
            _deleteButton.titleLabel.text=@"刪除";
            [_deleteButton addTarget:self action:@selector(_clickButton) forControlEvents:UIControlEventTouchUpInside];
            _deleteButton.backgroundColor=[UIColor redColor];
           _deleteButton;
        })];
    }
    return  self;
}

GTDeleteCellView 的顯示和關(guān)閉

• 顯示

-(void)showDeleteViewFromPoint:(CGPoint)point  clickBlock:(dispatch_block_t)clickBlock{
    _deleteButton.frame=CGRectMake(point.x, point.y, 0, 0);
    _deleteBlock=[clickBlock copy];
    UIWindow *window =  [[[UIApplication sharedApplication] windows] objectAtIndex:0];
    [window addSubview:self];
  //  [[UIApplication sharedApplication].keyWindow addSubview:self];
//   [UIView animateWithDuration:1.f animations:^{
//       self.deleteButton.frame=CGRectMake((self.bounds.size.width-200)/2 , (self.bounds.size.height-200)/2, 200, 200);
//   }];
//
    [UIView animateWithDuration:1.f delay:0.f usingSpringWithDamping:0.5  initialSpringVelocity:0.5 options:UIViewAnimationCurveEaseInOut
                     animations:^{
     self.deleteButton.frame=CGRectMake((self.bounds.size.width-200)/2 , (self.bounds.size.height-200)/2, 200, 200);
 }completion:^(BOOL finished){
  
     NSLog(@"completion");
   
 }];
  
}

showDeleteViewFromPoint 方法需要外部傳入 CGPoint 和block 的回調(diào)實(shí)現(xiàn) 然后showDeleteViewFromPoint 方法里面我們處理 GTDeleteCellView 彈出的的動(dòng)畫(huà)效果

• 動(dòng)畫(huà)

 [UIView animateWithDuration:1.f delay:0.f usingSpringWithDamping:0.5  initialSpringVelocity:0.5 options:UIViewAnimationCurveEaseInOut
                     animations:^{
     self.deleteButton.frame=CGRectMake((self.bounds.size.width-200)/2 , (self.bounds.size.height-200)/2, 200, 200);
 }completion:^(BOOL finished){
     NSLog(@"completion")常遂；
 }];

實(shí)例化block 和point

    _deleteButton.frame=CGRectMake(point.x, point.y, 0, 0);
    _deleteBlock=[clickBlock copy];
    UIWindow *window =  [[[UIApplication sharedApplication] windows] objectAtIndex:0];
    [window addSubview:self];

• 關(guān)閉

-(void)dismissDeleteView{
    [self removeFromSuperview];
}

這是點(diǎn)空白的地方關(guān)閉
我們給deletebutton 添加點(diǎn)擊事件

  [_deleteButton addTarget:self action:@selector(_clickButton) forControlEvents:UIControlEventTouchUpInside];

我們?cè)邳c(diǎn)擊事件方法實(shí)現(xiàn)里面 調(diào)用 block和 removeFromSuperview

-(void)_clickButton{
 //   _deleteBlock();
    if(_deleteBlock){
        _deleteBlock();
        NSLog(@"block回調(diào)執(zhí)行");
    }
    [self removeFromSuperview];
}

這樣我們的deletebutton點(diǎn)擊就也會(huì)關(guān)閉 GTDeleteCellView
然后我們?cè)? ViewController 中將block 的會(huì)回調(diào)實(shí)現(xiàn) 并且刪除dataArray數(shù)組里面的數(shù)據(jù)更新列表

CGRect  rect =[tabviewCell  convertRect:deletebutton.frame  toView:nil];
    __weak typeof(self)wself= self;
    [deleteview showDeleteViewFromPoint:rect.origin clickBlock:^{
        __strong typeof  (self)strongSelf=wself;
        [strongSelf.dataArray removeLastObject];
        NSLog(@"clickBlock  回調(diào)");
        [self.tableview deleteRowsAtIndexPaths:@[[strongSelf.tableview indexPathForCell:tabviewCell]]
                              withRowAnimation:UITableViewRowAnimationAutomatic];
    
    } ];

我們調(diào)用 GTDeleteCellView 中的showDeleteViewFromPoint 方法傳入我們轉(zhuǎn)換后的point 和block 的實(shí)現(xiàn)
最后我們調(diào)用

 [strongSelf.dataArray removeLastObject];

刪除數(shù)組里面的數(shù)據(jù) 然后調(diào)用 deleteRowsAtIndexPaths刪除并刷新列表

 [self.tableview deleteRowsAtIndexPaths:@[[strongSelf.tableview indexPathForCell:tabviewCell]]
                              withRowAnimation:UITableViewRowAnimationAutomatic];

到此iOS UITableView配合block 回調(diào)實(shí)現(xiàn)列表刪除教程就講完了

最后總結(jié)

在iOS開(kāi)發(fā)中這種列表展示基本都是使用 UITableView 和UICollectionView 我這邊只是加單舉例所以直接就用UITableView 實(shí)現(xiàn)了 我們要注意的是block回調(diào)使用和動(dòng)畫(huà)的處理 以及自定義cell的處理 就差不多了 纳令，我是一名安卓程序員 因?yàn)樾枰蛠?lái)學(xué)習(xí)一下iOS的開(kāi)發(fā), 最近看了一下教程學(xué)習(xí)了IOS里面的一些基礎(chǔ)控件的用法。 就想著做個(gè)筆記 所以就寫(xiě)了這篇文章 克胳，記錄一下 如果有錯(cuò)誤的請(qǐng)大神們指出平绩。 最后希望我的文章能幫助到各位解決問(wèn)題 ，以后我還會(huì)貢獻(xiàn)更多有用的代碼分享給大家漠另。各位同學(xué)如果覺(jué)得文章還不錯(cuò) 捏雌，麻煩給關(guān)注和star，小弟在這里謝過(guò)啦