版本记录
版本号 | 时间 |
---|---|
V1.0 | 2017.08.07 |
前言
很多时候我们需要选择多行或者取消选择多行,这个在购物类电商类app中是常见的功能,下面我就简单的实现了下,希望对大家有所帮助。
功能目标
实现了cell
的多选和取消多选。
功能实现
这里思路其实很明确,就是控制数据源,在模型了添加一BOOL
属性,来判断cell
是否选择,通过选择或者取消选择cell时更改此值并刷新数据,达到了多行数据的选择和取消选择。
特别要注意的是,需要提前设置tableView
的一个属性。
tableView.allowsMultipleSelection = YES;
下面直接看代码。
1. JJMultiChooseVC.h
#import <UIKit/UIKit.h>
@interface JJMultiChooseVC : UIViewController
@end
2. JJMultiChooseVC.m
#import "JJMultiChooseVC.h"
#import "JJMultiChooseModel.h"
#import "JJMultiChooseCell.h"
@interface JJMultiChooseVC () <UITableViewDelegate, UITableViewDataSource>
@property (nonatomic, strong) UITableView *tableView;
@property (nonatomic, strong) NSMutableArray <JJMultiChooseModel *> *contentArrM;
@end
@implementation JJMultiChooseVC
static NSString *const kJJMultiChooseCellReuseIdentify = @"kJJMultiChooseCellReuseIdentify";
#pragma mark - Override Base Function
- (void)viewDidLoad
{
[super viewDidLoad];
self.title = @"多行选择";
self.view.backgroundColor = [UIColor lightGrayColor];
[self setupUI];
[self loadData];
}
#pragma mark - Object Private Function
- (void)setupUI
{
UITableView *tableView = [[UITableView alloc] initWithFrame:self.view.frame style:UITableViewStylePlain];
tableView.delegate = self;
tableView.dataSource = self;
[tableView registerClass:[JJMultiChooseCell class] forCellReuseIdentifier:kJJMultiChooseCellReuseIdentify];
tableView.allowsMultipleSelection = YES;
tableView.rowHeight = 70.0;
[self.view addSubview:tableView];
self.tableView = tableView;
}
- (void)loadData
{
self.contentArrM = [NSMutableArray array];
NSArray *contentArr = @[@"第一行", @"第二行", @"第三行", @"第四行", @"第五行"];
[contentArr enumerateObjectsUsingBlock:^(NSString *obj, NSUInteger idx, BOOL * _Nonnull stop) {
JJMultiChooseModel *model = [[JJMultiChooseModel alloc] init];
model.contentStr = obj;
[self.contentArrM addObject:model];
}];
}
#pragma mark - UITableViewDelegate, UITableViewDataSource
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
return self.contentArrM.count;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
JJMultiChooseCell *cell = [tableView dequeueReusableCellWithIdentifier:kJJMultiChooseCellReuseIdentify forIndexPath:indexPath];
cell.model = self.contentArrM[indexPath.row];
return cell;
}
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
JJMultiChooseModel *model = self.contentArrM[indexPath.row];
model.isSelected = !model.isSelected;
[self.tableView reloadData];
}
@end
3. JJMultiChooseModel.h
#import <Foundation/Foundation.h>
@interface JJMultiChooseModel : NSObject
@property (nonatomic, copy) NSString *contentStr;
@property (nonatomic, assign) BOOL isSelected;
@end
4. JJMultiChooseCell.h
#import <UIKit/UIKit.h>
@class JJMultiChooseModel;
@interface JJMultiChooseCell : UITableViewCell
@property (nonatomic, strong) JJMultiChooseModel *model;
@end
5. JJMultiChooseCell.m
#import "JJMultiChooseCell.h"
#import "Masonry.h"
#import "JJMultiChooseModel.h"
@interface JJMultiChooseCell ()
@property (nonatomic, strong) UILabel *contentLabel;
@property (nonatomic, strong) UIImageView *selectImageView;
@end
@implementation JJMultiChooseCell
#pragma mark - Override Base Function
- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier]) {
[self setupUI];
}
return self;
}
#pragma mark - Object Private Function
- (void)setupUI
{
UILabel *contentLabel = [[UILabel alloc] init];
contentLabel.textColor = [UIColor blueColor];
[self.contentView addSubview:contentLabel];
self.contentLabel = contentLabel;
UIImageView *selectImageView = [[UIImageView alloc] init];
[self.contentView addSubview:selectImageView];
self.selectImageView = selectImageView;
}
- (void)layoutUI
{
[self.contentLabel sizeToFit];
[self.contentLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.center.equalTo(self.contentView);
}];
[self.selectImageView mas_makeConstraints:^(MASConstraintMaker *make) {
make.centerY.equalTo(self.contentView);
make.right.equalTo(self.contentView.mas_right).offset(-20);
make.width.height.equalTo(@50);
}];
}
#pragma mark - Getter && Setter
- (void)setModel:(JJMultiChooseModel *)model
{
self.contentLabel.text = model.contentStr;
if (model.isSelected) {
self.selectImageView.image = [UIImage imageNamed:@"group_prooerty_selected"];
}
else {
self.selectImageView.image = [UIImage imageNamed:@"group_prooerty_unselected"];
}
[self layoutUI];
}
@end
代码就这么多了,也很简单。
功能效果
下面看一下实现效果。
效果实现
后记
很简单的小东西,希望对大家有所帮助。
今日立秋