前言
笔者写了好几回筛选工具,发现很多app中也有这种玩意,写的不好,出于分享心态~,接下来我通过代码给大家实现下这个工具,直接上代码了.就没有demo了,先来个效果图(代码中只实现2种情况做介绍)
![](https://img.haomeiwen.com/i1911628/558fef3ea0f42d83.png)
![](https://img.haomeiwen.com/i1911628/5414f55d81f15ca8.png)
![](https://img.haomeiwen.com/i1911628/03e787ddd118de11.png)
1.创建 存放按钮的 ATChooseToolView:UIView
#import <UIKit/UIKit.h>
NS_ASSUME_NONNULL_BEGIN
@protocol ATChooseToolViewDelegate <NSObject>
// 点击按钮
-(void)chooseControlWithBtnArray:(NSArray *)array button:(UIButton *)sender;
@end
@interface ATChooseToolView : UIView
@property(nonatomic ,strong) NSArray *titleArr;
@property(nonatomic ,weak) id<ATChooseToolViewDelegate> delegate;
// 按钮数组
@property(nonatomic ,strong) NSMutableArray <UIButton *>*btnArr;
-(void)setUpAllViewWithTitleArr:(NSArray *)titleArr;
@end
NS_ASSUME_NONNULL_END
#import "ATChooseToolView.h"
#import "ATChooseButton.h"
@interface ATChooseToolView()
@property(nonatomic ,strong) UIView *btnBackView;
@end
@implementation ATChooseToolView
-(instancetype)initWithFrame:(CGRect)frame {
if (self = [super initWithFrame:frame]) {
self.backgroundColor = k_WhiteColor;
self.btnBackView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, kScreenWidth, 44)];
[self addSubview:self.btnBackView];
//线条
[self addSubview:[ATGeneralFuncUtil addLineView:CGRectMake(0, 44-0.5, SCREEN_WIDTH, 0.5)]];
}
return self;
}
- (void)setUpAllViewWithTitleArr:(NSArray *)titleArr{
//创建按钮
for (int i = 0; i<titleArr.count; i++) {
ATChooseButton *btn = [[ATChooseButton alloc]init];
[btn setTitle:titleArr[i] forState:UIControlStateNormal];
[btn setTitleColor:k_MainTitleColor forState:UIControlStateNormal];
[btn setTitleColor:k_MainColor forState:UIControlStateSelected];
[btn setImage:kImageName(@"ic_list_tabuparrows_bg") forState:UIControlStateNormal];
[btn setImage:kImageName(@"ic_list_tabarrowsdown_bg") forState:UIControlStateSelected];
btn.imageAlignment = SWImageAlignmentRight;
btn.spaceBetweenTitleAndImage = 3;
btn.tag = i;
btn.titleLabel.font = kFontWithSize(16);
CGFloat btnW = kScreenWidth/titleArr.count;
CGFloat btnX = i*btnW;
btn.frame = CGRectMake(btnX, 0, btnW, 45);
[self.btnBackView addSubview:btn];
SWWeakSelf(self)
[btn addBlockForControlEvents:UIControlEventTouchUpInside block:^(id _Nonnull sender) {
SWStrongSelf(self)
UIButton *senderBtn = (UIButton *)sender;
senderBtn.selected = !senderBtn.selected;
if ([self.delegate respondsToSelector:@selector(chooseControlWithBtnArray:button:)]) {
[self.delegate chooseControlWithBtnArray:self.btnArr button:sender];
}
}];
[self.btnArr addObject:btn];
}
//画线
CGFloat margin = kScreenWidth/titleArr.count;
for (int i = 0; i<titleArr.count - 1; i++) {
UIView *line = [[UIView alloc]init];
line.backgroundColor = k_VcBgColor;
CGFloat w = 0.5;
CGFloat h = 23;
CGFloat x = (margin + w) * (i+1);
CGFloat y = 8;
line.frame = CGRectMake(x, y, w, h);
[self.btnBackView addSubview:line];
}
}
-(NSMutableArray *)btnArr{
if (!_btnArr) {
_btnArr = [NSMutableArray array];
}
return _btnArr;
}
@end
2.创建自定义button,一般都是箭头 上下选中的效果
#import <UIKit/UIKit.h>
NS_ASSUME_NONNULL_BEGIN
/**
* 按钮中图片的位置
*/
typedef NS_ENUM(NSUInteger, SWImageAlignment) {
/**
* 图片在左,默认
*/
SWImageAlignmentLeft = 0,
/**
* 图片在上
*/
SWImageAlignmentTop,
/**
* 图片在下
*/
SWImageAlignmentBottom,
/**
* 图片在右
*/
SWImageAlignmentRight,
};
@interface ATChooseButton : UIButton
/**
* 按钮中图片的位置
*/
@property(nonatomic,assign)SWImageAlignment imageAlignment;
/**
* 按钮中图片与文字的间距
*/
@property(nonatomic,assign)CGFloat spaceBetweenTitleAndImage;
@end
NS_ASSUME_NONNULL_END
#import "ATChooseButton.h"
@implementation ATChooseButton
- (void)layoutSubviews
{
[super layoutSubviews];
CGFloat space = self.spaceBetweenTitleAndImage;
CGFloat titleW = CGRectGetWidth(self.titleLabel.bounds);//titleLabel的宽度
CGFloat titleH = CGRectGetHeight(self.titleLabel.bounds);//titleLabel的高度
CGFloat imageW = CGRectGetWidth(self.imageView.bounds);//imageView的宽度
CGFloat imageH = CGRectGetHeight(self.imageView.bounds);//imageView的高度
CGFloat btnCenterX = CGRectGetWidth(self.bounds)/2;//按钮中心点X的坐标(以按钮左上角为原点的坐标系)
CGFloat imageCenterX = btnCenterX - titleW/2;//imageView中心点X的坐标(以按钮左上角为原点的坐标系)
CGFloat titleCenterX = btnCenterX + imageW/2;//titleLabel中心点X的坐标(以按钮左上角为原点的坐标系)
switch (self.imageAlignment)
{
case SWImageAlignmentTop:
{
self.titleEdgeInsets = UIEdgeInsetsMake(imageH/2+ space/2, -(titleCenterX-btnCenterX), -(imageH/2 + space/2), titleCenterX-btnCenterX);
self.imageEdgeInsets = UIEdgeInsetsMake(-(titleH/2 + space/2), btnCenterX-imageCenterX, titleH/2+ space/2, -(btnCenterX-imageCenterX));
}
break;
case SWImageAlignmentLeft:
{
self.titleEdgeInsets = UIEdgeInsetsMake(0, space/2, 0, -space/2);
self.imageEdgeInsets = UIEdgeInsetsMake(0, -space/2, 0, space);
}
break;
case SWImageAlignmentBottom:
{
self.titleEdgeInsets = UIEdgeInsetsMake(-(imageH/2+ space/2), -(titleCenterX-btnCenterX), imageH/2 + space/2, titleCenterX-btnCenterX);
self.imageEdgeInsets = UIEdgeInsetsMake(titleH/2 + space/2, btnCenterX-imageCenterX,-(titleH/2+ space/2), -(btnCenterX-imageCenterX));
}
break;
case SWImageAlignmentRight:
{
self.titleEdgeInsets = UIEdgeInsetsMake(0, -(imageW + space/2), 0, imageW + space/2);
self.imageEdgeInsets = UIEdgeInsetsMake(0, titleW+space/2, 0, -(titleW+space/2));
}
break;
default:
break;
}
}
@end
3.控制器中初始化添加
NSArray *array = @[@"城市",@"岗位",@"学历",@"年龄",@"来源"];
ATChooseToolView *chooseView = [[ATChooseToolView alloc]initWithFrame:CGRectMake(0, 12, ScreenWidth, 44)];
chooseView.delegate = self;
[chooseView setUpAllViewWithTitleArr:array];
_chooseControlView = chooseView;
[self.mainView addSubview:chooseView];
[self.mainView addSubview:self.mainTable];
//实现按钮点击代理
- (void)chooseControlWithBtnArray:(NSArray *)array button:(UIButton *)sender{
[self.view addSubview:self.chooseShowView];
self.chooseShowView.hidden = NO;
[self.chooseShowView chooseControlViewBtnArray:array Action:sender];
}
4.创建 ATChooseShowView:UIView(负责弹出收回回调最终后端需要的筛选参数)
#import <UIKit/UIKit.h>
NS_ASSUME_NONNULL_BEGIN
@protocol ATChooseShowViewDelegate <NSObject>
/**
* 第一个View的选中事件
@param leftIndex 选中的索引
@param rightIndex 选中的索引
*/
-(void)chooseOneViewWithTableLeftIndex:(NSInteger)leftIndex rightIndex:(NSInteger)rightIndex;
/**
* 第二个View的选中事件
@param leftindex 选中的索引
@param rightIndex 选中的索引
*/
-(void)chooseTwoViewCellDidSelectedWithLeftIndex:(NSInteger)leftindex rightIndex:(NSInteger)rightIndex mcid:(NSString *)mc_id;
/**
* 第三个View的选中事件
@param index 选中的索引
*/
-(void)chooseThreeViewCellDidSelectedWithIndex:(NSInteger)index;
/**
* 第四个View的选中事件
*/
-(void)chooseFourViewBtnResultWithIsProm:(BOOL)isprom isVer:(BOOL)isver;
@end
@interface ATChooseShowView : UIView
// 按钮数组
@property(nonatomic ,strong) NSArray *btnArray;
@property(nonatomic ,strong) UIView *hiddenView;
//@property(nonatomic ,strong) NSArray *merCateArray;
//@property(nonatomic ,strong) NSArray *childCateArr;
// 索引
//@property(nonatomic ,assign) NSInteger twoLeftIndex;
//@property(nonatomic ,assign) NSInteger twoRightIndex;
@property(nonatomic ,weak) id<ATChooseShowViewDelegate> delegate;
/**
* 初始化筛选View
@param btnArr 标题数组
@param sender 辩题按钮
*/
-(void)chooseControlViewBtnArray:(NSArray *)btnArr Action:(UIButton *)sender;
//自定义一些外部传入数据源的方法,给当前View点m内部使用
- (void)setupOneData:(NSMutableArray *)leftData rightData:(NSMutableArray *)rightData;//第一组弹出的数据
@end
NS_ASSUME_NONNULL_END
#import "ATChooseShowView.h"
#import "ATDoubleChildView.h"
#import "ATSingleChildView.h"
typedef NS_ENUM(NSInteger,ATChooseViewShowType) {
ATChooseViewShowTypeOne,
ATChooseViewShowTypeTwo,
ATChooseViewShowTypeThree,
ATChooseViewShowTypeFour,
};
@interface ATChooseShowView()<ATDoubleChildViewDelegate,ATSingleChildViewDelegate>
@property(nonatomic ,strong) ATDoubleChildView *oneView;
@property(nonatomic ,strong) ATDoubleChildView *twoView;
@property(nonatomic ,strong) ATSingleChildView *threeView;
@property(nonatomic ,strong) ATSingleChildView *fourView; //年龄
@property(nonatomic ,strong) ATSingleChildView *fieView; //来源
//载体 存放View
@property(nonatomic ,strong) NSArray *viewArray;
// 记录弹出的是哪一个视图
@property(nonatomic ,assign) ATChooseViewShowType selctChooseView;
// 记录选中的按钮
@property(nonatomic ,strong) UIButton *seleBtn;
//模拟数据
@property(nonatomic ,strong) NSArray *threeTitleArr;
@property(nonatomic ,strong) NSArray *fourTitleArr;
//模拟第一组需要的数据
@property(nonatomic ,strong) NSArray *allMerAreaArr;
@property(nonatomic ,strong) NSArray *childMerArr;
@end
@implementation ATChooseShowView
-(instancetype)initWithFrame:(CGRect)frame{
if (self = [super initWithFrame:frame]) {
[self setUpAllView];
}
return self;
}
-(void)setUpAllView{
self.backgroundColor = [UIColor colorWithRed:1/255.0 green:1/255.0 blue:1/255.0 alpha:0.0];
self.threeTitleArr = @[@"智能排序",@"离我最近",@"星级最高",@"人气最高",@"价格最低",@"价格最高"];
self.fourTitleArr = @[@"2000-3000",@"3000-5000",@"5000-8000",@"8000-12000",@"12000-20000"];
//传入一个类型 加载不一样的 筛选按钮界面
self.viewArray = @[self.oneView,self.twoView,self.threeView,self.fourView,self.fieView];
[self addSubview:self.hiddenView];
UITapGestureRecognizer *tap= [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(hideViewAction:)];
[self.hiddenView addGestureRecognizer:tap];
}
//模拟赋值
- (void)setupOneData:(NSMutableArray *)leftData rightData:(NSMutableArray *)rightData{
self.oneView.leftDataArray = leftData;
self.oneView.rightDataArray = rightData;
}
#pragma mark - 逻辑处理
#pragma mark - 点击筛选按钮
-(void)chooseControlViewBtnArray:(NSArray *)btnArr Action:(UIButton *)sender{
//记录选中
self.seleBtn = sender;
for (int i = 0; i<btnArr.count; i++) {
UIButton *btn = btnArr[i];
if (btn.tag == sender.tag) {
}else{
btn.selected = NO;
}
}
self.selctChooseView = sender.tag;
//1.选中一个按钮后,其他按钮设置为未选中状态,并且关闭其他按钮绑定的弹出View
switch (sender.tag) {
case 0:
if (sender.selected) {
[self hideOtherChilView:self.oneView]; //隐藏其他
[self showSubViews:self.oneView]; //弹出自己
}else{
[self hideSuviews:self.oneView]; //收回自己
}
break;
case 1:
if (sender.selected) {
[self hideOtherChilView:self.twoView];
[self showSubViews:self.twoView];
}else{
[self hideSuviews:self.twoView];
}
break;
case 2:
if (sender.selected) {
[self hideOtherChilView:self.threeView];
[self showSubViews:self.threeView];
}else{
[self hideSuviews:self.threeView];
}
break;
case 3:
if (sender.selected) {
[self hideOtherChilView:self.fourView];
[self showSubViews:self.fourView];
}else{
[self hideSuviews:self.fourView];
}
break;
case 4:
if (sender.selected) {
[self hideOtherChilView:self.fieView];
[self showSubViews:self.fieView];
}else{
[self hideSuviews:self.fieView];
}
break;
default:
break;
}
}
#pragma mark - 隐藏其他视图
- (void)hideOtherChilView:(UIView *)currentView{
for (UIView *view in self.viewArray) {
if (currentView != view) {
view.hidden = YES;
view.frame = CGRectMake(0, 0, SCREEN_WIDTH, 0);
for (UITableView *tableView in view.subviews) {
tableView.frame = CGRectMake(0, 0, SCREEN_WIDTH, 0);
}
}
}
}
#pragma mark - 其他操作,隐藏当前视图
-(void)hideViewAction:(UITapGestureRecognizer *)gesture{
// 改变按钮的状态
self.seleBtn.selected = !self.seleBtn.isSelected;
// 隐藏视图
switch (self.selctChooseView) {
case 0:
[self hideSuviews:self.oneView];
break;
case 1:
[self hideSuviews:self.twoView];
break;
case 2:
[self hideSuviews:self.threeView];
break;
case 3:
[self hideSuviews:self.fourView];
break;
case 4:
[self hideSuviews:self.fieView];
break;
default:
break;
}
}
#pragma mark - 弹出视图
- (void)showSubViews:(UIView *)currentView{
[self addSubview:currentView];
currentView.hidden = NO;
[UIView animateWithDuration:0.25 animations:^{
if (currentView == self.oneView) {
self.oneView.frame = CGRectMake(0, 0, kScreenWidth, kScreenHeight * 0.55);
self.oneView.leftTable.frame = CGRectMake(0, 0, kScreenWidth/2, kScreenHeight * 0.55);
self.oneView.rightTable.frame = CGRectMake(kScreenWidth/2, 0, kScreenWidth/2, kScreenHeight * 0.55);
}else if(currentView == self.twoView){
self.twoView.frame = CGRectMake(0, 0, kScreenWidth, kScreenHeight * 0.5);
self.twoView.leftTable.frame = CGRectMake(0, 0, kScreenWidth/2, kScreenHeight * 0.5);
self.twoView.rightTable.frame = CGRectMake(kScreenWidth/2, 0, kScreenWidth/2, kScreenHeight * 0.5);
}else if(currentView == self.threeView){
self.threeView.frame = self.threeView.mainTable.frame = CGRectMake(0, 0, kScreenWidth, 280);
}else if(currentView == self.fourView){
self.fourView.frame = self.fourView.mainTable.frame = CGRectMake(0, 0, kScreenWidth, kTableViewCellNomolHeigh *4);
}else if(currentView == self.fieView){
self.fieView.frame = self.fieView.mainTable.frame = CGRectMake(0, 0, kScreenWidth, kTableViewCellNomolHeigh *2);
}
self.backgroundColor = [UIColor colorWithRed:1/255.0 green:1/255.0 blue:1/255.0 alpha:0.3];
}];
}
#pragma mark - 隐藏视图
//双列表类型
- (void)hideSuviews:(UIView *)currentView{
self.backgroundColor = [UIColor clearColor];
[UIView animateWithDuration:.25 animations:^{
if (currentView == self.oneView) {
self.oneView.frame = CGRectMake(0, 0, SCREEN_WIDTH, 0);
self.oneView.leftTable.frame = CGRectMake(0, 0, SCREEN_WIDTH/2, 0);
self.oneView.rightTable.frame = CGRectMake(SCREEN_WIDTH/2, 0, SCREEN_WIDTH/2, 0);
}else if(currentView == self.twoView){
self.twoView.frame = CGRectMake(0, 0, SCREEN_WIDTH, 0);
self.twoView.leftTable.frame = CGRectMake(0, 0, SCREEN_WIDTH/2, 0);
self.twoView.rightTable.frame = CGRectMake(SCREEN_WIDTH/2, 0, SCREEN_WIDTH/2, 0);
}else if(currentView == self.threeView){
self.threeView.frame = self.threeView.mainTable.frame = CGRectMake(0, 0, SCREEN_WIDTH, 0);
}else if(currentView == self.fourView){
self.fourView.frame = self.fourView.mainTable.frame = CGRectMake(0, 0, SCREEN_WIDTH, 0);
}else if(currentView == self.fieView){
self.fieView.frame = self.fieView.mainTable.frame = CGRectMake(0, 0, SCREEN_WIDTH, 0);
}
}completion:^(BOOL finished) {
currentView.hidden = YES;
self.hidden = YES;
}];
}
#pragma mark - 弹出的view视图点击回调
//第一第二个view
- (void)oneViewRightTableviewDidSelectedWithLeftIndex:(NSInteger)leftIndex rightIndex:(NSInteger)rightIndex currentView:(nonnull UIView *)currentView{
NSLog(@"点击左边的第%ld个,右边的第%ld个",(long)leftIndex,(long)rightIndex);
[self hideViewAction:nil];
if ([self.delegate respondsToSelector:@selector(chooseOneViewWithTableLeftIndex:rightIndex:)]) {
[self.delegate chooseOneViewWithTableLeftIndex:leftIndex rightIndex:rightIndex];
}
}
- (void)oneViewLeftTableviewDidSelectedWithLeftIndex:(NSInteger)leftIndex rightIndex:(NSInteger)rightIndex currentView:(nonnull UIView *)currentView{
}
//第三第四个view
- (void)threeViewTableviewDidSelectedWithIndex:(NSInteger)index currentView:(nonnull UIView *)currentView{
if (currentView == self.threeView) {
[self.seleBtn setTitle:self.threeTitleArr[index] forState:UIControlStateNormal];
}else if (currentView == self.fourView){
// [self.seleBtn setTitle:self.fourTitleArr[index] forState:UIControlStateNormal];
}
else if (currentView == self.fieView){
// [self.seleBtn setTitle:@[@"自有资源",@"他人资源"][index] forState:UIControlStateNormal];
}
[self hideViewAction:nil];
}
#pragma mark - 懒加载
-(ATDoubleChildView *)oneView{
if (!_oneView) {
_oneView = [[ATDoubleChildView alloc]initWithFrame:CGRectMake(0, 0, kScreenWidth, 0)];
_oneView.hidden = YES;
_oneView.backgroundColor = k_WhiteColor;
_oneView.delegate = self;
}
return _oneView;
}
-(ATDoubleChildView *)twoView{
if (!_twoView) {
_twoView = [[ATDoubleChildView alloc]initWithFrame:CGRectMake(0, 0, kScreenWidth, 0)];
_twoView.hidden = YES;
_twoView.delegate = self;
_twoView.backgroundColor = k_WhiteColor;
}
return _twoView;
}
-(ATSingleChildView *)threeView{
if (!_threeView) {
_threeView = [[ATSingleChildView alloc]initWithFrame:CGRectMake(0, 0, kScreenWidth, 0)];
_threeView.hidden = YES;
_threeView.delegate = self;
_threeView.titleArray = self.threeTitleArr;
_threeView.backgroundColor = k_WhiteColor;
}
return _threeView;
}
-(ATSingleChildView *)fourView{
if (!_fourView) {
_fourView = [[ATSingleChildView alloc]initWithFrame:CGRectMake(0, 0, kScreenWidth, 0)];
_fourView.hidden = YES;
_fourView.delegate = self;
_fourView.titleArray = @[@"不限",@"18-26岁",@"27-35岁",@"36-45岁"];
_fourView.backgroundColor = k_WhiteColor;
}
return _fourView;
}
-(ATSingleChildView *)fieView{
if (!_fieView) {
_fieView = [[ATSingleChildView alloc]initWithFrame:CGRectMake(0, 0, kScreenWidth, 0)];
_fieView.hidden = YES;
_fieView.delegate = self;
_fieView.titleArray = @[@"自有资源",@"他人资源"];
_fieView.backgroundColor = k_WhiteColor;
}
return _fieView;
}
-(UIView *)hiddenView{
if (!_hiddenView) {
_hiddenView = [[UIView alloc]init];
}
return _hiddenView;
}
-(void)layoutSubviews{
[super layoutSubviews];
if (self.oneView.isHidden) {
CGFloat hiddY = CGRectGetMaxY(self.oneView.frame);
self.hiddenView.frame = CGRectMake(0, hiddY, kScreenWidth, kScreenHeight - hiddY);
}else if (self.twoView.isHidden){
CGFloat hiddY = CGRectGetMaxY(self.twoView.frame);
self.hiddenView.frame = CGRectMake(0, hiddY, kScreenWidth, kScreenHeight - hiddY);
}else if (self.threeView.isHidden){
CGFloat hiddY = CGRectGetMaxY(self.threeView.frame);
self.hiddenView.frame = CGRectMake(0, hiddY, kScreenWidth, kScreenHeight - hiddY);
}else if (self.fourView.isHidden){
CGFloat hiddY = CGRectGetMaxY(self.fourView.frame);
self.hiddenView.frame = CGRectMake(0, hiddY, kScreenWidth, kScreenHeight - hiddY);
}else if (self.fieView.isHidden){
CGFloat hiddY = CGRectGetMaxY(self.fieView.frame);
self.hiddenView.frame = CGRectMake(0, hiddY, kScreenWidth, kScreenHeight - hiddY);
}
}
@end
5 创建单选+双tableView列表的view ATSingleChildView && ATDoubleChildView(你要弹出的View)
这个我就不写啦~ ,你们自己画列表即可,点击cell回调给ATChooseShowView,然后通过ATChooseShowView回调给控制器就完成了回调操作;
总结
希望对你有帮助~陌生网友,如果有不懂得,call my QQ392287145
网友评论