ios开发之区域地区选择下拉框，如下图：
屏幕快照 2018-04-27 下午3.42.43.png
- 下拉框，出现和消失带有动画，下面有黑色半透明背景图遮盖
- 左右列表是有两个tableView联动实现
关键代码实现
.m文件代码
@implementation AddressSelectionView
//初始化列表View
+ (instancetype)shareUpDownView
{
AddressSelectionView *upDown = [[[NSBundle mainBundle]loadNibNamed:@"AddressSelectionView" owner:nil options:nil] firstObject];
//添加点击手势
UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:upDown action:@selector(tapClick:)];
[upDown addGestureRecognizer:tap];
return upDown;
}
//下面半透明黑色背景View
- (UIView *)shadowView
{
if (!_shadowView) {
_shadowView = [[UIView alloc] init];
_shadowView.userInteractionEnabled = YES;
_shadowView.backgroundColor = [UIColor blackColor];
_shadowView.alpha = 0.0;
}
return _shadowView;
}
//两个tableView的父视图View
- (UIView *)listView
{
if (!_listView) {
_listView = [[UIView alloc] init];
_listView.backgroundColor = [UIColor whiteColor];
_listView.frame = CGRectMake(0, MaxY(self) + 1, ScreenW, 0);
}
return _listView;
}
//加载左边列表
- (UITableView *)leftTableview
{
if (!_leftTableview) {
_leftTableview = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, 101, _listView.bounds.size.height) style:UITableViewStylePlain];
_leftTableview.separatorStyle = UITableViewCellSeparatorStyleNone;
//取消弹簧效果
_leftTableview.bounces = NO;
_leftTableview.showsVerticalScrollIndicator = NO;
_leftTableview.layer.borderColor = BACKGROUD_CL.CGColor;//设置边框颜色
_leftTableview.layer.borderWidth = 1.0f;//设置线宽
_leftTableview.dataSource = self;
_leftTableview.delegate = self;
}
return _leftTableview;
}
//加载右边列表
- (UITableView *)rightTableview
{
if (!_rightTableview) {
_rightTableview = [[UITableView alloc] initWithFrame:CGRectMake(MaxX(self.leftTableview), 0, ScreenW - self.leftTableview.frame.size.width, _listView.bounds.size.height) style:UITableViewStylePlain];
//取消弹簧效果
_rightTableview.showsVerticalScrollIndicator = NO;
_rightTableview.bounces = NO;
_rightTableview.separatorStyle = UITableViewCellSeparatorStyleNone;
_rightTableview.dataSource = self;
_rightTableview.delegate = self;
}
return _rightTableview;
}
//手势触发事件
- (void)tapClick:(UITapGestureRecognizer *)tapRecognizer
{
//添加阴影View
[[[UIApplication sharedApplication].delegate window] addSubview:self.shadowView];
//添加listView
[[[UIApplication sharedApplication].delegate window] addSubview:self.listView];
if (!self.isOpen) {
//显示地区列表
[self showDropDown];
}else
{
//隐藏地区列表
[self hideDropDown];
}
}
- (void)showDropDown{ // 显示下拉列表
self.shadowView.frame = CGRectMake(0, MaxY(self.listView), ScreenW, ScreenH - MaxY(self.listView));
[self.listView.superview bringSubviewToFront:_listView]; // 将下拉列表置于最上层
[UIView animateWithDuration:AnimateTime animations:^{
self.listView.h = 200;
self.leftTableview.h = self.listView.bounds.size.height;
self.rightTableview.h = self.listView.bounds.size.height;
_shadowView.alpha = 0.8;
}completion:nil];
self.isOpen = YES;
}
- (void)hideDropDown{ // 隐藏下拉列表
//动画改变控件的高度
[UIView animateWithDuration:AnimateTime animations:^{
self.listView.h = 0;
self.leftTableview.h = self.listView.bounds.size.height;
self.rightTableview.h = self.listView.bounds.size.height;
self.shadowView.alpha = 0.0;
}completion:^(BOOL finished) {
//移除listView
[self.listView removeFromSuperview];
[self.shadowView removeFromSuperview];
}];
self.isOpen = NO;
}
.h文件实现代码
//添加一个代理，在点击右侧tableView时触发
@protocol AddressSelectionViewDelegate<NSObject>
- (void)addressSelectionView:(AddressSelectionView *)addressSelectionView didSelectLocation:(NSString *)location detailLocation:(NSString *)detailLocation;
@end
//点击右侧按钮实现代码
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
//点击左边加载右边的数据
if (tableView == self.leftTableview) {
self.currentLocation = [self.dataDict allKeys][indexPath.row];
[self.rightTableview reloadData];
}else
{
NSString *detailLocation = self.detailLocations[indexPath.row];
//实现代理
if ([self.delegate respondsToSelector:@selector(addressSelectionView:didSelectLocation:detailLocation:)]) {
[self.delegate addressSelectionView:self didSelectLocation:self.currentLocation detailLocation:detailLocation];
}
//隐藏下拉列表
//[self hideDropDown];
}
}
就此为该下拉框实现的关键代码，如果有不好的地方，希望能够指出来，共同学习。
