iOS UITableView左滑操作功能的實(shí)現(xiàn)（iOS8-11）

該文同時(shí)發(fā)表在騰訊WeTest公眾號(hào)：iOS UITableView左滑操作功能的實(shí)現(xiàn)（iOS8-11） 歡迎點(diǎn)擊閱讀

本文主要是介紹下iOS 11系統(tǒng)及iOS 11之前的系統(tǒng)在實(shí)現(xiàn)左滑操作功能上的區(qū)別，及如何自定義左滑的標(biāo)題顏色、字體

1、左滑操作功能實(shí)現(xiàn)

1.1 如果左滑的時(shí)候只有一個(gè)操作按鈕，可以使用如下三個(gè)delegate方法來(lái)實(shí)現(xiàn)：

//editing style
- (UITableViewCellEditingStyle)tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath {
    return UITableViewCellEditingStyleDelete;
}
//設(shè)置滑動(dòng)cell出現(xiàn)的button標(biāo)題，默認(rèn)是"delete"
- (NSString *)tableView:(UITableView *)tableView titleForDeleteConfirmationButtonForRowAtIndexPath:(NSIndexPath *)indexPath {
    return @"刪除";//or @"置頂"
}
- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath {
 //點(diǎn)擊按鈕后的操作
}

1.2 如果左滑有一個(gè)或多個(gè)操作按鈕，iOS8-10 可使用如下兩個(gè)delegate方法：

//如果tableView中的每一行都可以進(jìn)行左滑操作，該方法可不實(shí)現(xiàn)
//If not implemented, all editable cells will have UITableViewCellEditingStyleDelete
- (UITableViewCellEditingStyle)tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath
{
    if (indexPath.section == FMMineCollectionSection_AlbumItems) {
        return UITableViewCellEditingStyleDelete;
    }
    return UITableViewCellEditingStyleNone;
}

// 必須寫的方法（否則iOS 8無(wú)法刪除，iOS 9及其以上不寫沒(méi)問(wèn)題），和editActionsForRowAtIndexPath配對(duì)使用，里面什么不寫也行
- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath {

}

//從iOS11開(kāi)始該方法被廢棄
- (NSArray<UITableViewRowAction *> *)tableView:(UITableView *)tableView editActionsForRowAtIndexPath:(NSIndexPath *)indexPath
{
   UITableViewRowAction *topRowAction = [UITableViewRowAction rowActionWithStyle:UITableViewRowActionStyleNormal title:@"置頂" handler:^(UITableViewRowAction * _Nonnull action, NSIndexPath * _Nonnull indexPath) {
        //操作按鈕點(diǎn)擊的操作    
       }];
   topRowAction.backgroundColor = KE_COLOR(@"BT3");
   topRowAction.title = @"置頂";
  
    UITableViewRowAction *deleteRowAction = [UITableViewRowAction rowActionWithStyle:UITableViewRowActionStyleDefault title:@"刪除" handler:^(UITableViewRowAction * _Nonnull action, NSIndexPath * _Nonnull indexPath) {
    NSLog(@"點(diǎn)擊了刪除");
}];
   return @[topRowAction, deleteRowAction];
  }
}

1.3 iOS 11之后，tableView的delegate增加了兩個(gè)方法，用來(lái)取代editActionsForRowAtIndexPath方法，如下：

// Swipe actions
// These methods supersede -editActionsForRowAtIndexPath: if implemented
// return nil to get the default swipe actions
- ( UISwipeActionsConfiguration *)tableView:(UITableView *)tableView trailingSwipeActionsConfigurationForRowAtIndexPath:(NSIndexPath *)indexPath {

    UIContextualAction *topRowAction = [UIContextualAction contextualActionWithStyle:UIContextualActionStyleNormal title:@"置頂" handler:^(UIContextualAction * _Nonnull action, __kindof UIView * _Nonnull sourceView, void (^ _Nonnull completionHandler)(BOOL)) {
    NSLog(@"點(diǎn)擊了置頂");
}];

    UIContextualAction *deleteRowAction = [UIContextualAction contextualActionWithStyle:UIContextualActionStyleDestructive title:@"delete" handler:^(UIContextualAction * _Nonnull action, __kindof UIView * _Nonnull sourceView, void (^ _Nonnull completionHandler)(BOOL)) {
    NSLog(@"點(diǎn)擊了刪除");
}];

    UISwipeActionsConfiguration *config = [UISwipeActionsConfiguration configurationWithActions:@[topRowAction,deleteRowAction]];
    return config;
}

在1.2和1.3中，如果是需要適配iOS 11之前的版本，以上三個(gè)方法都需要實(shí)現(xiàn)。

1.4 上面1.2和1.3中實(shí)現(xiàn)的方法的區(qū)別

體驗(yàn)上的不同就是當(dāng)左滑只有一個(gè)button時(shí)，iOS 11中可以一直左滑，滑到一定程度時(shí)，會(huì)執(zhí)行點(diǎn)擊按鈕的操作，iOS 11之前的不會(huì)。

iOS 11之前如果想增大button區(qū)域，可通過(guò)在標(biāo)題前后加空格的方式，但iOS 11不行，加空格無(wú)效，button大小固定，超過(guò)4個(gè)字時(shí)換行顯示。

2、左滑操作自定義標(biāo)題顏色、字體

因?yàn)橄到y(tǒng)對(duì)左滑出的按鈕只提供了3個(gè)可設(shè)置的屬性：title、backgroundColor、image，如果使用自定義的titleColor和font，就需要自己來(lái)實(shí)現(xiàn)了。實(shí)現(xiàn)的思想是hook系統(tǒng)實(shí)現(xiàn)，但鑒于UITableView的view層級(jí)結(jié)構(gòu)在iOS 11中有所改變，所以iOS8-10和iOS11的實(shí)現(xiàn)有所不同，以下分別給出。

考慮到代碼的可復(fù)用性，自定義左滑操作的字體大小和顏色的代碼不寫在viewController中，而是寫在UITableView和UITableViewCell的Category中，對(duì)外提供editActionTitleColor和editActionTitleFont屬性來(lái)設(shè)置顏色和大小，需要使用自定義顏色和字體時(shí)只需要設(shè)置一下這兩個(gè)屬性即可。

2.1 iOS 8-10 設(shè)置標(biāo)題顏色和字體

左滑操作后，UITableView的層級(jí)結(jié)構(gòu)如下圖：

iOS8-10層級(jí)結(jié)構(gòu).png

由上圖可知，左滑的操作按鈕是在UITableViewCell的子view，所以我們可以在UITableViewCell的category中hook掉layoutSubviews方法，找到UITableViewCellDeleteConfirmationView的子view button，設(shè)置字體顏色和大小。

代碼如下：

- (void)applyEditActionButtonStyle
{
    if (self.editActionTitleColor) {//設(shè)置editActionTitleFont同理
        UIButton *btn = [self __findSwipActionButton];
        [btn setTitleColor:self.editActionTitleColor forState:UIControlStateNormal];
    }
}

- (UIButton *)__findSwipActionButton{
    if (![Common iOS11]) {
        UIView *extView = (UIView *)[self findSubviewOfTest:@"UITableViewCellDeleteConfirmationView" resursion:YES];
        for (UIButton *btn in extView.subviews) {
            if ([btn isKindOfClass:[UIButton class]]) {
             return btn;
            }
        }
    }
    return nil;
}

2.2 iOS 11 設(shè)置標(biāo)題顏色和字體

左滑操作后，UITableView的層級(jí)結(jié)構(gòu)如下圖：
iOS11 View的層級(jí)結(jié)構(gòu).png

由上圖可知，左滑的操作按鈕是在UITableView的子view，所以我們可以在UITableView的category中hook掉layoutSubviews方法，找到UISwipeActionPullView的子view button，設(shè)置字體顏色和大小。

代碼如下：

- (void)applyEditActionButtonStyle
{
    if (self.editActionTitleColor) {//設(shè)置editActionTitleFont同理
        NSArray *btns = [self __findSwipActionButtons];
        for (UIButton *btn in btns) {
            [btn setTitleColor:self.editActionTitleColor forState:UIControlStateNormal];
        }
    }
}

- (NSArray<UIButton *> *)__findSwipActionButtons{
    if ([Common iOS11]) {
        NSMutableArray *buttons = [NSMutableArray array];
        for (UIView *extView in self.subviews) {
            if ([NSStringFromClass(extView.class) isEqualToString:@"UISwipeActionPullView"]) {
                for (UIButton *btn in extView.subviews) {
                    if ([btn isKindOfClass:[UIButton class]]) {
                        [buttons addObject:btn];//要返回所有的左滑出的button
                    }
                }
            }
        }
        return [buttons copy];
    }
    return nil;
}

3、遇到的問(wèn)題及原因分析

3.1 問(wèn)題是iOS 11上設(shè)置顏色有延遲，顏色有一個(gè)明顯的跳變，從系統(tǒng)默認(rèn)色跳轉(zhuǎn)到我設(shè)置的顏色

有問(wèn)題的代碼如下：

- (void)applyEditActionButtonStyle
{
    if (self.editActionTitleColor) {
        UIButton *btn = [self __findSwipActionButton];
        [btn setTitleColor:self.editActionTitleColor forState:UIControlStateNormal];
    }
}

- (UIButton *)__findSwipActionButton{
if ([Common iOS11]) {
    for (UIView *extView in self.subviews) {
        if ([NSStringFromClass(extView.class) isEqualToString:@"UISwipeActionPullView"]) {
            for (UIButton *btn in extView.subviews) {
                if ([btn isKindOfClass:[UIButton class]]) {
                        return btn;
                    }
                }
            }
        }
    }
    return nil;
}

3.2 問(wèn)題原因分析

當(dāng)左滑一個(gè)cell后，直接操作左滑另一個(gè)cell，這個(gè)時(shí)候tableView上會(huì)有兩個(gè)UISwipeActionPullView，此時(shí)tableView的部分view層級(jí)如下圖所示：

two_swipeActionView.png

而上面的代碼，在__findSwipActionButton方法中，找到其中一個(gè)UISwipeActionPullView上面的button就直接返回了，沒(méi)有設(shè)置第二個(gè)UISwipeActionPullView的button的顏色，導(dǎo)致顯示了系統(tǒng)默認(rèn)色。

3.3 解決方法

將以上有問(wèn)題的代碼修改為以下代碼：找出所有的UISwipeActionPullView，返回UISwipeActionPullView的button數(shù)組，對(duì)button數(shù)組進(jìn)行設(shè)置字體顏色和大小，這個(gè)數(shù)組最多有兩個(gè)元素，因?yàn)樽蠡鱿乱粋€(gè)cell時(shí)，上一個(gè)cell會(huì)逐漸消失，當(dāng)此cell左滑操作完成時(shí)，上一個(gè)左滑的cell也會(huì)完成消失。

解決后的代碼如2.2的示例代碼。

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 發(fā)現(xiàn) 關(guān)注 消息 iOS 第三方庫(kù)、插件、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關(guān)注 2017.06.26 09:4...
    肇東周閱讀 15,315評(píng)論 4贊 61
  • 我一直相信書是有生命的。寫作的人把自己的氣息、思想、神情融匯成一段段的話并編寫出的一個(gè)個(gè)的字后賜予了書靈魂。一篇文...
    千千千晚星閱讀 410評(píng)論 4贊 1
  • 我說(shuō)她幼稚，她卻覺(jué)得委屈 原創(chuàng)文 | 林子 （清風(fēng)浪港手寫鋪原創(chuàng)文，未經(jīng)授權(quán)請(qǐng)勿轉(zhuǎn)載） 三年前，我的閨蜜跟她男朋友...
    清風(fēng)浪港手寫鋪閱讀 270評(píng)論 0贊 0

友情鏈接更多精彩內(nèi)容