IOS自制类似于下拉框的控件

zhaozy78

第一步：新建工程XiaLaKuang（名字比较俗，新建方法不再比比。。。）

第二步：操作main.storyboard

     ——》拖拽一个UIButton（命名Title为“吨”，background为“light gray”，Alignment中的Horizonal选择靠左），再拖拽一个UIImage的图像为三角箭头的图片，使按钮看起来想一个下拉框；

           注：将来点击这个按钮会弹出选择器，选择内容后，会将按钮的Title更改为我们选择的内容；



   ——》再拖拽一个Toolbar、PickerView控件到按钮的下方（稍微小一点，毕竟我们选择的东西就很少），再往Toolbar上拖拽一个Item控件更名为“完成”，也可以再往Item的左侧拖拽一个Flexible space使“完成”按钮在右侧；再将Toolbar和PickerView的Hidden勾选；

完成后的效果图如下：


第三步：连线（控件与ViewController.m之间）

   ——》UIButton连接两根线，一根Outlet“Button”，一根Action“BtnAction”；

   ——》Toolbar一根Outlet“Toolbar”；

   ——》UIPickerView一根Outlet“Picker”；

   ——》Toolbar上的“完成”按钮连一根Action“selectedAction”；

   ——》给PickerView连接dataSource和delegate；（方法和UITableview显示列表数据时的连线方法一样，看我的上上篇博客）



第四步：编码

1. #import "ViewController.h"
   
2. 
   
3. @interface ViewController ()<UIPickerViewDelegate,UIPickerViewDataSource>
   
4. @property (weak, nonatomic) IBOutlet UIButton *danweiBtn;
   
5. - (IBAction)BtnAction:(id)sender;
   
6. 
   
7. @property (weak, nonatomic) IBOutlet UIToolbar *Toolbar;
   
8. @property (weak, nonatomic) IBOutlet UIPickerView *Picker;
   
9. - (IBAction)selectedAction:(id)sender;
   
10. 
    
11. @property (nonatomic, strong) NSArray *danwei;
    
12. @end
    
13. 
    
14. @implementation ViewController
    
15. 
    
16. - (void)viewDidLoad {
    
17.     [super viewDidLoad];
    
18.     // Do any additional setup after loading the view, typically from a nib.
    
19.     _danwei = [NSArray arrayWithObjects:@"吨",@"方",@"件", nil];
    
20. }
    
21. 
    
22. - (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
    
23. {
    
24.     return 1;
    
25. }
    
26. 
    
27. - (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component
    
28. {
    
29.     return _danwei.count;
    
30. }
    
31. 
    
32. - (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component
    
33. {
    
34.     return [_danwei objectAtIndex:row];
    
35. }
    
36. 
    
37. - (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component
    
38. {
    
39.     [self.danweiBtn setTitle:[_danwei objectAtIndex:row] forState:UIControlStateNormal];
    
40. }
    
41. 
    
42. - (void)didReceiveMemoryWarning {
    
43.     [super didReceiveMemoryWarning];
    
44.     // Dispose of any resources that can be recreated.
    
45. }
    
46. 
    
47. - (IBAction)BtnAction:(id)sender {
    
48.     self.Picker.hidden = NO;
    
49.     self.Toolbar.hidden = NO;
    
50. }
    
51. - (IBAction)selectedAction:(id)sender {
    
52.    
    
53.     self.Picker.hidden = YES;
    
54.     self.Toolbar.hidden = YES;
    
55. }
    
56. @end

复制代码

最终效果图：