恕我搜商有限, 暂时未能找到apple为开发者提供的较为方便的编辑模式, 我是自己实现
我需要实现点击navi右按钮"编辑"进入编辑模式, 与此同时这个按钮变为全选, , navi左按钮变为取消.
此时屏幕底部升上来一个删除按钮.
同时每个collectionviewCell 的图片会出现蒙版, 右下角会出现圆圈, 点击会变为对钩表示被选中. 点击全选能全部选中, 点击删除会删除被选中的collectionviewCell.
如果没有选中任何collectionviewCell, 不可以让删除按钮有点击事件实现, 所以我让按钮响应事件直接return, 而且样式也得把背景颜色改为灰色, 有选中才变为主题色, 且可以实现删除代码
而且我的最后一个cell是一个加号让用户可以添加, 在编辑模式下需要隐藏.
当然了, 这些东西我都写在同一种cell里面, 需要显示什么hidden==NO即可
关键知识点, 首先是运用didSelect和didDeselect两个协议方法, 去实现点击选中, 再次点击同一个取消选中.
第二个就是遍历所有cell, 不要用其他api, 就用
for (NAFirstBookShelfCollectionViewCell *cell in _collectionView.visibleCells) {
}
第三点就是声明一个BOOL变量, 进入编辑模式赋值为yes, 退出编辑则赋值为NO, 方便很多地方的判断
第四点就是使用两个可变数组, 一个记录被选中的indexPath, 一个记录被选中的cell的model, 前者用于
_collectionView deleteItemsAtIndexPaths:
这个更新界面的api, 后者用于更新装数据的原数组
_mArrOfData removeObjectsInArray:
当然了, 取消选中也要同时更新这俩数组. 而且退出编辑或者进入编辑时, 随意选一个时机把数组初始化. 还有, 删除的顺序应该是先更新数据, 后更新界面
talk is cheap
以下这个方法是item数, 需要根据当前是否为编辑模式判断item数量, 所以, 每次进入退出编辑都要reloadData, mArrOfData就是界面所需的model的原数组
#pragma mark item数
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
if(_isEdit){
return _mArrOfData.count;
}
else{
return _mArrOfData.count + 1;
}
}
以下这个是取出cell的协议方法, 根据实际情况使用, 没什么参考价值
#pragma mark 取出item
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
NAFirstBookShelfCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"NAFirstBookShelfCollectionViewCell" forIndexPath:indexPath];
if(_isEdit){
cell.imageViewOfPic.hidden = NO;
cell.labelOfTitle.hidden = NO;
cell.labelOfProgress.hidden = NO;
cell.imageViewOfAdd.hidden = YES;
cell.grayCoverView.hidden = NO;
}
else{
if (indexPath.row == _mArrOfData.count) {
cell.imageViewOfPic.hidden = YES;
cell.labelOfTitle.hidden = YES;
cell.labelOfProgress.hidden = YES;
cell.imageViewOfCycle.hidden = YES;
cell.imageViewOfSelected.hidden = YES;
cell.grayCoverView.hidden = YES;
cell.imageViewOfAdd.hidden = NO;
}
else{
cell.imageViewOfPic.hidden = NO;
cell.labelOfTitle.hidden = NO;
cell.labelOfProgress.hidden = NO;
cell.imageViewOfAdd.hidden = YES;
}
}
return cell;
}
以下是删除代码的实现, 上面说了, 没有选中时, 即包含选中的model的数组或包含选中的indexPath的数组数量不为空, 方可进行删除, 最后一行是一个没有参数的block, 通知按钮样式变灰
if(_mArrOfSelectedData.count == 0){
return;
}
[_mArrOfData removeObjectsInArray:_mArrOfSelectedData];
[_collectionView deleteItemsAtIndexPaths:_mArrOfSelectedItem];
_mArrOfSelectedItem = [NSMutableArray array];
_mArrOfSelectedData = [NSMutableArray array];
self.turnIntoGray();
以下是选中和取消选中的协议方法, 涉及到几个判断: 判断是否在编辑模式下, 包括判断是否有选中的item来改变删除按钮颜色, 并将选中item的model和indexPatch放入对应的数组中, 取消选中则剔除对应元素
#pragma mark 点击item
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
if (_isEdit) {
NAFirstBookShelfCollectionViewCell *cell = (NAFirstBookShelfCollectionViewCell *)[collectionView cellForItemAtIndexPath:indexPath];
[_mArrOfSelectedItem addObject:indexPath];
NSString *str = _mArrOfData[indexPath.row];
[_mArrOfSelectedData addObject:str];
cell.imageViewOfCycle.hidden = YES;
cell.imageViewOfSelected.hidden = NO;
}
if (_mArrOfSelectedItem.count > 0) {
self.turnIntoBlue();
}
else{
self.turnIntoGray();
}
}
#pragma mark 反选
- (void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath{
if (_isEdit) {
NAFirstBookShelfCollectionViewCell *cell = (NAFirstBookShelfCollectionViewCell *)[collectionView cellForItemAtIndexPath:indexPath];
if ([_mArrOfSelectedItem containsObject:indexPath]) {
[_mArrOfSelectedItem removeObject:indexPath];
NSString *str = _mArrOfData[indexPath.row];
[_mArrOfSelectedData removeObject:str];
cell.imageViewOfSelected.hidden = YES;
cell.imageViewOfCycle.hidden = NO;
}
}
}
以下是选择navi右按钮时的响应事件, 需要对判断编辑状态的BOOL值进行赋值, 并更改navi左右按钮, 并且遍历所有cell把蒙版和圆圈显示出来, 允许collectionview的多选
#pragma mark - 选择编辑
- (void)edit:(UIBarButtonItem *)btn{
_isEdit = YES;
_collectionView.allowsMultipleSelection = YES;
_mArrOfSelectedData = [NSMutableArray array];
_mArrOfSelectedItem = [NSMutableArray array];
for (NAFirstBookShelfCollectionViewCell *cell in _collectionView.visibleCells) {
cell.imageViewOfCycle.hidden = NO;
cell.grayCoverView.hidden = NO;
}
[_collectionView reloadData];
self.navigationItem.leftBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:@"取消" style:UIBarButtonItemStylePlain target:self action:@selector(cancelEdit:)];
self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:@"全选" style:UIBarButtonItemStylePlain target:self action:@selector(selectAll:)];
//用block叫父vc把两个view隐藏, 并更改按钮为灰色
self.hideTwoBottomView();
self.turnIntoGray();
}
以下是全选的点击事件, 需要把原数组所有数组加入到保存选中元素的数组中, 并把所有indexPath保存进存选中item的indexPath的数组, 还需要遍历所有cell把对钩和蒙版显示出来, 需要注意的是如何把所有item选中.
core code: [_collectionView selectItemAtIndexPath:indexPath animated:NO scrollPosition:UICollectionViewScrollPositionNone];
#pragma mark 选择全选
- (void)selectAll:(UIBarButtonItem *)btn{
_isEdit = YES;
_mArrOfSelectedData = [NSArray arrayWithArray:_mArrOfData].mutableCopy;
for (NAFirstBookShelfCollectionViewCell *cell in _collectionView.visibleCells) {
NSIndexPath *indexPath = [_collectionView indexPathForCell:cell];
[_collectionView selectItemAtIndexPath:indexPath animated:NO scrollPosition:UICollectionViewScrollPositionNone];
cell.imageViewOfSelected.hidden = NO;
cell.grayCoverView.hidden = NO;
[_mArrOfSelectedItem addObject:indexPath];
}
//更改按钮为蓝色
self.turnIntoBlue();
}
点击navi左按钮退出编辑和上面差不多了, 无非是更新界面, 取消允许多选, 赋值判断编辑状态的BOOL变量
#pragma mark 取消编辑
- (void)cancelEdit:(UIBarButtonItem *)btn{
_mArrOfSelectedData = [NSMutableArray array];
_mArrOfSelectedItem = [NSMutableArray array];
_collectionView.allowsMultipleSelection = NO;
_isEdit = NO;
for (NAFirstBookShelfCollectionViewCell *cell in _collectionView.visibleCells) {
cell.imageViewOfCycle.hidden = YES;
cell.grayCoverView.hidden = YES;
cell.imageViewOfSelected.hidden = YES;
NSIndexPath *indexPath = [_collectionView indexPathForCell:cell];
[_collectionView deselectItemAtIndexPath:indexPath animated:NO];
}
[_collectionView reloadData];
self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:@"编辑" style:UIBarButtonItemStylePlain target:self action:@selector(edit:)];
self.navigationItem.leftBarButtonItem = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@"navi_back"] style:UIBarButtonItemStylePlain target:self action:@selector(naviBack)];
//bolck让底部两个view出现
self.showTwoBottomView();
}
好了完结, 撒花
