效果图：
A9CCF5C3D52B7B408E9175FFA03F213D.gif
下拉菜单
首先，上面下拉菜单为Button，点击调用显示方法。第一行第二行......是一个tableView，下面是一个黑色背景，需要设置透明度。
最开始，tableView隐藏，背景View隐藏，调用显示方法之后，背景出现，tableView出现。
因为要有封装性，所以新建一个DropDownView，继承于UIView.
DropDownView.h
#importtypedef void(^SelectBlock)(NSString *title, NSInteger row);
//@protocol DropDownViewDelegate
//-(void)didSelectRow:(NSInteger)row title:(NSString *)title;
//@end
@interface DropDownView : UIView@property (strong, nonatomic) UITableView *tableView;
/**
选项的数组
**/
@property (strong, nonatomic) NSArray *titles;
/**
行高
**/
@property (assign, nonatomic) CGFloat rowHeight;
/**
被选中的行,默认0
**/
@property (assign, nonatomic) CGFloat selectIndex;//@property (weak, nonatomic) iddelegate;
/**
菜单宽度,默认屏幕宽度
**/
@property (assign, nonatomic) CGFloat menuWidth;
/**
选中颜色
**/
@property (strong, nonatomic) UIColor *selectColor;
/**
正常颜色,默认黑色
**/
@property (strong, nonatomic) UIColor *normalColor;
/**
触发点击的block
**/
@property (copy, nonatomic) SelectBlock selectRow;
/**
显示的方法
**/
-(void)show;
/**
隐藏的方法
**/
-(void)hidden;
@end
DropDownView.m
#define WIDTH [UIScreen mainScreen].bounds.size.width
#import "DropDownView.h"
#import "DownViewTableViewCell.h"
static NSString *identifier = @"DownVIewCell";
@interface DropDownView()
@property (strong, nonatomic) UIView *bgView;//背景
@property (strong, nonatomic) UITapGestureRecognizer *tap;//手势
@end
@implementation DropDownView
//初始化
- (instancetype)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
//添加手势，点击调用隐藏方法
_tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(hidden)];
if (_menuWidth == 0) {
_menuWidth = [UIScreen mainScreen].bounds.size.width;
}
//接下来是背景
_bgView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, _menuWidth, frame.size.height)];
_bgView.backgroundColor = [UIColor blackColor];
_bgView.alpha = 0;
[_bgView addGestureRecognizer:_tap];
[self addSubview:_bgView];
//关于tableView
_tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, _menuWidth, 0)];
_tableView.delegate =self;
_tableView.dataSource = self;
_tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
[_tableView registerNib:[UINib nibWithNibName:@"DownViewTableViewCell" bundle:nil] forCellReuseIdentifier:identifier];
[self addSubview:_tableView];
//隐藏，0为NO，1为YES
self.hidden = 1;
}
return self;
}
-(void)awakeFromNib{
[super awakeFromNib];
CGRect frame = self.frame;
_tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(hidden)];
if (_menuWidth == 0) {
_menuWidth = [UIScreen mainScreen].bounds.size.width;
}
//接下来是背景
_bgView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, _menuWidth, frame.size.height)];
_bgView.backgroundColor = [UIColor blackColor];
_bgView.alpha = 0;
[_bgView addGestureRecognizer:_tap];
[self addSubview:_bgView];
_tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, _menuWidth, 0)];
_tableView.delegate =self;
_tableView.dataSource = self;
_tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
[_tableView registerNib:[UINib nibWithNibName:@"DownViewTableViewCell" bundle:nil] forCellReuseIdentifier:identifier];
[self addSubview:_tableView];
self.hidden = 1;
}
-(void)show
{
if (!self.hidden) {
[self hidden];
return;
}
self.hidden = 0;
[UIView animateWithDuration:0.25 animations:^{
_bgView.alpha = 0.3;
_tableView.frame = CGRectMake(0, 0, _menuWidth, _titles.count * 36);
}];
}
-(void)hidden
{
[UIView animateWithDuration:0.25 animations:^{
_bgView.alpha = 0;
_tableView.frame = CGRectMake(0, 0, _menuWidth, 0);
} completion:^(BOOL finished) {
self.hidden = 1;
}];
}
//setter方法的增补
-(void)setTitles:(NSArray *)titles{
_titles = titles;
[_tableView reloadData];
}
-(UIColor *)selectColor{
if (_selectColor == nil) {
_selectColor = [UIColor colorWithRed:0x3e / 255.0 green:0x7e / 255.0 blue:0xc7 / 255.0 alpha:1];
}
return _selectColor;
}
-(UIColor *)normalColor{
if (_selectColor == nil) {
_selectColor = [UIColor blackColor];
}
return _selectColor;
}
-(CGFloat)rowHeight{
if (_rowHeight == 0) {
_rowHeight = 36;
}
return _rowHeight;
}
//表格代理
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
return self.rowHeight;
}
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
return _titles.count;
}
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
DownViewTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:identifier];
cell.titleLabel.text = _titles[indexPath.row];
if (indexPath.row == _selectIndex) {
cell.titleLabel.textColor = self.selectColor;
cell.img.hidden = 0;
} else {
cell.titleLabel.textColor = self.normalColor;
cell.img.hidden = 1;
}
return cell;
}
-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
// [_delegate didSelectRow:indexPath.row title:_titles[indexPath.row]];
_selectRow(_titles[indexPath.row], indexPath.row);
_selectIndex = indexPath.row;
[_tableView reloadData];
[self hidden];
}
@end
新建一个tableViewCell，设置cell的样式。此处为左边一个label，右边一个imageView。
最后在ViewController里面使用这个封装的下拉菜单：
ViewController.m
#import "ViewController.h"
#import "DropDownView.h"
@interface ViewController ()
@property (weak, nonatomic) IBOutlet DropDownView *dropView;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
_dropView.titles = @[@"第一行",@"第二行",@"第三行",@"第四行",@"第五行",@"第六行"];
_dropView.selectRow = ^(NSString *title, NSInteger row) {
NSLog(@"选中了第%d行,标题是%@",(int)row,title);
};
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
- (IBAction)open:(id)sender {
[_dropView show];
}
@end
ok，一个简单的下拉菜单完毕。
网友评论