简单的下拉选择框

首先、为了文章有个好看的封面、特附今早狂风下拍的一张自认为还挺好看的图片、哈哈

哈哈.jpg

应公司项目需求要实现一个简单的下拉选择的功能，故今天顺便写一下文章。
先上图吧、请再次原谅和忽略本宝宝粗糙的审美、图丑凑合着看、意思到了就行哈～

其实思路很简单、我们的UI控件中有一个UITextfield、他是可以设置内部左右自定义视图的、另外我们下拉的视图就用tableview去写。

哎、还是直接上代码吧、辣么详细的注释已经不需要我再啰嗦什么了。

#import "ViewController.h"

@interface ViewController ()<UITableViewDelegate,UITableViewDataSource>

// 展示textf的rightView图标的imageView
@property (nonatomic,strong) UIImageView *imageV;

@property (nonatomic ,strong) UITextField *textf;

@property (nonatomic,strong) UITableView *popChooseView;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    self.view.backgroundColor = [UIColor whiteColor];
    
    [self textfield];
    [self setupPopChooseView];
}


- (void)textfield
{
    self.textf = [[UITextField alloc] initWithFrame:CGRectMake(20, 100, 120, 40)];
    self.textf.borderStyle = UITextBorderStyleRoundedRect;
    self.textf.text = @"英语";
    self.textf.tag = 50;
    [self.view addSubview:self.textf];
    
    // 设置textf的rightView
    UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 30, 30)];
    view.backgroundColor = [UIColor clearColor];
    
    self.imageV = [[UIImageView alloc] initWithFrame:CGRectMake(5, 5, 20, 20)];
    self.imageV.image = [UIImage imageNamed:@"Down"];
    self.imageV.tag = 100;
    self.imageV.contentMode = UIViewContentModeCenter;
    [view addSubview:self.imageV];
    
    self.textf.rightView = view;
    self.textf.rightViewMode = UITextFieldViewModeAlways;
    
    // 添加点击手势
    UITapGestureRecognizer *tapGes = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(chooseViewShowOrHide)];
    [self.textf addGestureRecognizer:tapGes];
    
}

// 点击手势的执行事件
// 改变imageView中的图标
- (void)chooseViewShowOrHide
{
    if (self.imageV.tag == 100) {
        self.imageV.tag = 101;
        self.imageV.image = [UIImage imageNamed:@"up"];
        [self.view addSubview:self.popChooseView];
        
    }else
    {
        self.imageV.tag = 100;
        self.imageV.image = [UIImage imageNamed:@"Down"];
        [self.popChooseView removeFromSuperview];
    }
}

当然，这里我只是为了说明效果、没有去自定义cell、大家可以根据自己的需求去写一个比我这个漂亮不知道多少次方倍的cell

- (void)setupPopChooseView
{
    UITableView *tableView = [[UITableView alloc] initWithFrame:CGRectMake(20, 139, 120, 150) style:UITableViewStylePlain];
    tableView.delegate = self;
    tableView.dataSource = self;
    tableView.rowHeight = 30;
    self.popChooseView = tableView;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 5;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *cellID = @"popCell";
    
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellID];
    if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellID];
    }
    cell.backgroundColor = [UIColor lightGrayColor];
    cell.textLabel.text = [NSString stringWithFormat:@"英语-%d",(int)indexPath.row];
    return cell;
}

// tableViewCell 点击事件
// 1、将cell中的相关数据赋值给textf
// 2、同时隐藏popChooseView
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    [tableView deselectRowAtIndexPath:indexPath animated:YES];
    UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
    self.textf.text = cell.textLabel.text;
    
    [self chooseViewShowOrHide];
}

到此为止，一个“简洁大方”的下拉选择框就写成了。
希望我的文章对大家有所帮助。康撒米哒～～～

千山万水总是情
关注一下行不行  (*^_^*)