前阵子接到个需求，需要实现左边显示大类列表，页面右半部分实现二类及子类数据，并且可以实现上下滑动以及单选多选，并且可以将已选择的数据传递到需要用到的页面。下图是已实现的成品图
##实现流程：
新建MultilevelMenu类，继承自UIView，该类的目的是添加左边leftTableView，右边rightCollectionView，里面进行数据的赋值以及提供对外接口，供自定义开发使用。
MultilevelMenu.h，RightMenu模型类，用于记录按钮菜单的数值，菜单id，以及父类id 代码：
typedef void(^ChooseBlock) (NSString *chooseContent,NSMutableArray *chooseArr);
@interface MultilevelMenu : UIView<UITableViewDataSource,UITableViewDelegate,UICollectionViewDelegateFlowLayout,UICollectionViewDataSource,UICollectionViewDelegate>
@property(strong,nonatomic,readonly) NSArray * allData;
/**
* 是否 记录滑动位置
*/
@property(assign,nonatomic) BOOL isRecordLastScroll;
/**
* 记录滑动位置 是否需要 动画
*/
@property(assign,nonatomic) BOOL isRecordLastScrollAnimated;
/**
* 记录已选中的数据索引
*/
@property(assign,nonatomic,readonly) NSInteger selectIndex;
/**
* 左边背景颜色
*/
@property(strong,nonatomic) UIColor * leftBgColor;
/**
* 左边点中文字颜色
*/
@property(strong,nonatomic) UIColor * leftSelectColor;
/**
* 左边点中背景颜色
*/
@property(strong,nonatomic) UIColor * leftSelectBgColor;
/**
* 选中回调
*/
@property(nonatomic,copy)ChooseBlock chooseBlock;
@property (nonatomic,assign)BOOL ifAllSelected;
@property (nonatomic,assign)BOOL ifAllSelecteSwitch;
@property(strong,nonatomic ) UICollectionView * rightCollection;
-(instancetype)initWithFrame:(CGRect)frame WithData:(NSArray*)data withSelectIndex:(void(^)(NSInteger left,NSInteger right,id info))selectIndex;
@end
复制代码在.m文件中，主要是创建左右两个滑动View，在里面进行滑动的相关处理，对View进行赋值，单选以及多选的逻辑，由于代码较多，这里仅列出主要逻辑代码，完整版请参考demo
@interface MultilevelMenu()<WaterFlowLayoutDelegate>
@property(strong,nonatomic ) UITableView * leftTablew;
@property(assign,nonatomic) BOOL isReturnLastOffset;
//可变数组记录头视图的按钮
@property(nonatomic,strong) NSMutableArray *headerBtnArr;
@end
-(void)setNeedToScorllerIndex:(NSInteger)needToScorllerIndex{
/**
* 滑动到 指定行数
*/
[self.leftTablew selectRowAtIndexPath:[NSIndexPath indexPathForRow:needToScorllerIndex inSection:0] animated:YES scrollPosition:UITableViewScrollPositionTop];
_selectIndex=needToScorllerIndex;
[self.rightCollection reloadData];
_needToScorllerIndex=needToScorllerIndex;
}
-(void)setLeftTablewCellSelected:(BOOL)selected withCell:(MultilevelTableViewCell*)cell
{
UILabel * line=(UILabel*)[cell viewWithTag:kCellRightLineTag];
if (selected) {
line.backgroundColor=cell.backgroundColor;
cell.titile.textColor=self.leftSelectColor;
cell.backgroundColor=self.leftSelectBgColor;
}
else{
cell.titile.textColor=self.leftUnSelectColor;
cell.backgroundColor=self.leftUnSelectBgColor;
line.backgroundColor=_leftTablew.separatorColor;
}
}
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
static NSString * Identifier=@"MultilevelTableViewCell";
MultilevelTableViewCell * cell=[tableView dequeueReusableCellWithIdentifier:Identifier];
cell.selectionStyle=UITableViewCellSelectionStyleNone;
if (!cell) {
cell=[[NSBundle mainBundle] loadNibNamed:@"MultilevelTableViewCell" owner:self options:nil][0];
UILabel * label=[[UILabel alloc] initWithFrame:CGRectMake(kLeftWidth-0.5, 0, 0.5, 44)];
label.backgroundColor = tableView.separatorColor;
[cell addSubview:label];
label.numberOfLines = 0;
label.tag = kCellRightLineTag;
}
cell.selectionStyle=UITableViewCellSelectionStyleNone;
rightMeun * title=self.allData[indexPath.row];
cell.titile.text = title.meunName;
cell.titile.font = [UIFont systemFontOfSize:13];
if (indexPath.row==self.selectIndex) {
[self setLeftTablewCellSelected:YES withCell:cell];
}else{
[self setLeftTablewCellSelected:NO withCell:cell];
}
//設置分割线距离左右距离为0
if ([cell respondsToSelector:@selector(setLayoutMargins:)]) {
cell.layoutMargins=UIEdgeInsetsZero;
}
if ([cell respondsToSelector:@selector(setSeparatorInset:)]) {
cell.separatorInset=UIEdgeInsetsZero;
}
return cell;
}
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
//根据菜单子类数目返回
rightMeun * title=self.allData[self.selectIndex];
if (title.nextArray.count>0) {
rightMeun *sub=title.nextArray[section];
if (sub.nextArray.count==0)//没有下一级
{
return 1;
}
else
return sub.nextArray.count;
}
else{
return title.nextArray.count;
}
}
//点击leftTableView时，刷新右边视图的数据
-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
MultilevelTableViewCell * cell=(MultilevelTableViewCell*)[tableView cellForRowAtIndexPath:indexPath];
_selectIndex = indexPath.row;
[self setLeftTablewCellSelected:YES withCell:cell];
rightMeun *title=self.allData[indexPath.row];
[tableView scrollToRowAtIndexPath:indexPath atScrollPosition:UITableViewScrollPositionTop animated:YES];
self.isReturnLastOffset=NO;
//important
[self.rightCollection reloadData];
if (self.isRecordLastScroll) {
[self.rightCollection scrollRectToVisible:CGRectMake(0, title.offsetScorller, self.rightCollection.frame.size.width, self.rightCollection.frame.size.height) animated:self.isRecordLastScrollAnimated];
}
else{
[self.rightCollection scrollRectToVisible:CGRectMake(0, 0, self.rightCollection.frame.size.width, self.rightCollection.frame.size.height) animated:self.isRecordLastScrollAnimated];
}
}
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath{
//用当前已选中的数组和section中所有的源数据进行比较，如果相等，则高亮全选按钮
if (_choosedArr.count > 0) {
isContain2 = [[testArr1 copy] isEqual:menuArr];
}else{
isContain2 = false;
}
if (isContain2) {
[chooseIcon setSelected:YES];
}else{
[chooseIcon setSelected:NO];
}
}
-(void)ChooseAllClick:(UIButton *)button{
NSInteger sectionIndex = button.tag;
BOOL selectType = button.isSelected;
rightMeun *title = self.allData[self.selectIndex];
//获取到当前选择的item
rightMeun *menu;
menu = title.nextArray[sectionIndex];
NSArray *selectArr = menu.nextArray;
if (selectArr.count > 0) {
//判断当前是全选还是取消全选状态
if (_choosedArr.count == 0) {
//全选
if (!selectType) {
//选中
[_choosedArr addObjectsFromArray:selectArr];
}
}else{
if (selectType) {
//移除数组内数据
[_choosedArr removeObjectsInArray:selectArr];
}else{
//添加到数组内
[_choosedArr removeObjectsInArray:selectArr];
[_choosedArr addObjectsFromArray:selectArr];
}
}
}
//记录选择的数据 并更新视图
_ifAllSelecteSwitch = YES;
NSIndexPath *indexPath = [NSIndexPath indexPathForRow:0 inSection:button.tag];
NSIndexSet *indexSet = [[NSIndexSet alloc] initWithIndex:indexPath.section];
[_rightCollection reloadSections:indexSet];
}
复制代码vc调用，1:需要准备好业务代码所需要的数组元素”allData”（里面是rightMenu模型），包含一级菜单id，一级菜单title，二级菜单id，二级菜单title。2:新建MultilevelMenu，添加到vc.view上
//调用的vc代码
MultilevelMenu * view = [[MultilevelMenu alloc] initWithFrame:CGRectMake(x, y, width, height) WithData: allData withSelectIndex:^(NSInteger left, NSInteger right,rightMeun* info) {
NSLog(@"这是回调");
}];
view.needToScorllerIndex = 0;
view.isRecordLastScroll = YES;
view.leftSelectColor = [UIColor colorWithHexString:@"#E8340C" alpha:1.0f];
view.choosedArr = [self.selectedArrs mutableCopy];
view.chooseBlock = ^(NSString *chooseContent, NSMutableArray *chooseArr) {
};
// [view.rightCollection reloadData];
self.cateView = view;
[self.view addSubview:self.cateView];
复制代码奉上demo链接： demo
© 版权声明
文章版权归作者所有，未经允许请勿转载。
THE END
![[桜井宁宁]COS和泉纱雾超可爱写真福利集-一一网](https://www.proyy.com/skycj/data/images/2020-12-13/4d3cf227a85d7e79f5d6b4efb6bde3e8.jpg)
![[桜井宁宁] 爆乳奶牛少女cos写真-一一网](https://www.proyy.com/skycj/data/images/2020-12-13/d40483e126fcf567894e89c65eaca655.jpg)
