人一切的痛苦,本質(zhì)上都是對自己的無能的憤怒。
** 上篇文章介紹了UITableView的最基本的使用,現(xiàn)在這篇補充一點左滑出現(xiàn)多個按鈕的功能 以及對這些按鈕的設(shè)置 **
目錄
**1.左滑多個按鈕
2.對tableView背景設(shè)置毛玻璃
3.對滑動出來的按鈕設(shè)置背景圖片以及毛玻璃效果 **
左滑多個按鈕
- iOS 8 之后的調(diào)用系統(tǒng)的方法
- (NSArray<UITableViewRowAction *> *)tableView:(UITableView *)tableView editActionsForRowAtIndexPath:(NSIndexPath *)indexPath
{
// 添加一個刪除按鈕
UITableViewRowAction *deleteRowAction = [UITableViewRowAction rowActionWithStyle:UITableViewRowActionStyleDestructive title:@"刪除" handler:^(UITableViewRowAction *action, NSIndexPath *indexPath) {
NSLog(@"點擊了刪除");
}];
// 添加一個更多按鈕
UITableViewRowAction *moreRowAction = [UITableViewRowAction rowActionWithStyle:UITableViewRowActionStyleNormal title:@"更多" handler:^(UITableViewRowAction *action, NSIndexPath *indexPath) {
NSLog(@"點擊了更多");
}];
moreRowAction.backgroundColor = [UIColor clearColor];
return @[deleteRowAction,moreRowAction];
}
/*
UITableViewRowAction 的幾個屬性
@property (nonatomic, copy, nullable) NSString *title; 名稱
@property (nonatomic, copy, nullable) UIColor *backgroundColor; // default background color is dependent on style 背景顏色
@property (nonatomic, copy, nullable) UIVisualEffect* backgroundEffect; 毛玻璃效果
*/
注:
1.這里設(shè)置 UITableViewRowAction 屬性不要使用代碼塊中的action來設(shè)置,我嘗試過,沒有效果。
2.這里這個毛玻璃效果我也使用它來設(shè)置過,也是沒有效果的,不知道是不是我沒設(shè)置好,如果哪位清楚,歡迎再評論中指點。
3.這里數(shù)組中添加順序是從右到左的,也就是,數(shù)組當(dāng)中的第一個,就是你按鈕中最右邊的那個
- iOS 8 之前的話,網(wǎng)上有些第三方,以及其他方法,因為現(xiàn)在iOS10出來了,并且9、10升級率占九成以上,這里就不寫了。
對UItableView背景設(shè)置毛玻璃效果
- 首先設(shè)置背景圖片
- 然后在背景圖片上添加毛玻璃效果
- 然后將cell設(shè)置為透明的就可以了
UIImageView * imageView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"tableViewBackgroundImage"]];
UIBlurEffect * blurEffect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];
UIVisualEffectView * effectView = [[UIVisualEffectView alloc]initWithEffect:blurEffect];
effectView.frame = self.view.bounds;
[imageView addSubview:effectView];
tableView.backgroundView = imageView;
cell.backgroundColor = [UIColor clearColor];
對滑動出來的按鈕設(shè)置背景圖片以及毛玻璃效果
- 首先 我們要搞清楚這里 UITableViewCell 中間子控件的層級關(guān)系
這里可以清晰的看到,cell有兩個子控件,一個是我們常見的
UITableViewCellContentView,還有一個就是
UITableViewCellDeleteConfirmationView,而這個就是我們側(cè)滑出來的按鈕位子的父視圖。
那我們直接是沒有辦法調(diào)用到這個UITableViewCellDeleteConfirmationView的,因此,我們要在自定義的cell中自己去遍歷cell的子控件,來找出這個視圖。
弄清楚了層級關(guān)系,那么我的想法就是在UITableViewCellDeleteConfirmationView 上添加一個背景圖片,并且添加上毛玻璃效果就可以了
自定義的cell中實現(xiàn)這個方法
- (void)layoutSubviews
{
[super layoutSubviews];
for (UIView * subView in self.subviews) {
if ([subView isKindOfClass:NSClassFromString(@"UITableViewCellDeleteConfirmationView")]) {
//這個判斷我認(rèn)為是比較重要的 ,避免你多次添加圖片,你不添加這個判斷,會發(fā)現(xiàn)會添加多次圖片
if (self.backImage == nil) {
self.backImage = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"123"]];
self.backImage.frame = CGRectMake(0, 0, 134, 44); //這里我是直接打印出兩個按鈕的位置來定的位置,實際項目中,更具你按鈕的個數(shù)進(jìn)行調(diào)整
[subView addSubview:self.backImage];
UIBlurEffect * blurEffect =[UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];
// 毛玻璃視圖
self.effectView = [[UIVisualEffectView alloc] initWithEffect:blurEffect];
//添加到要有毛玻璃特效的控件中
self.effectView.frame = self.backImage.frame;
[subView addSubview:self.effectView];
//注意:這里順序不能反,要先將毛玻璃效果放到最后面,再將圖片放在最后面,這樣才能確保毛玻璃是在圖片上面的
[subView sendSubviewToBack:self.effectView];
[subView sendSubviewToBack:self.backImage];
break;
} else {
[subView addSubview:self.effectView];
[subView sendSubviewToBack:self.effectView];
[subView addSubview:self.backImage];
[subView sendSubviewToBack:self.backImage];
break;
}
}
}
}
這里有幾個注意點 :
1.添加圖片的時候進(jìn)行判斷,因為這個方法調(diào)用時在你滑動的時候多次調(diào)用的,不進(jìn)行判斷就會多次添加圖片
2.添加圖片和毛玻璃的順序必須注意,讓圖片在毛玻璃下面
如果對文章有任何疑問或者有改進(jìn)的地方,歡迎各位在評論中留言,我會盡快回復(fù)改正