iOS - UIPickerView

前言

    NS_CLASS_AVAILABLE_IOS(2_0) __TVOS_PROHIBITED @interface UIPickerView : UIView <NSCoding, UITableViewDataSource>
    @available(iOS 2.0, *)                      public class UIPickerView : UIView, NSCoding, UITableViewDataSource 
  • 选择框可以让用户以滑动的方式选择值。

1、UIPickerView 的创建

  • 遵守协议 UIPickerViewDataSource, UIPickerViewDelegate

  • Objective-C

        // 实例化 UIPickerView 对象
        UIPickerView *pickerView = [[UIPickerView alloc] init];
    
        // 设置代理
        pickerView.dataSource = self;
        pickerView.delegate = self;
    
        // 将 pickerView 添加到屏幕
        [self.view addSubview:pickerView];
    
        // 设置列数,必须设置,UIPickerViewDataSource 协议方法
        - (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView {
    
            return 3;
        }
    
        // 设置行数 ,必须设置,UIPickerViewDataSource 协议方法
        - (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {
    
            return 10;
        }
    
        // 设置各行内容,必须设置,UIPickerViewDelegate 方法
        - (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {
    
            return [NSString stringWithFormat:@"%li行 - %li列", row, component];
        }
  • Swift

        // 实例化 UIPickerView 对象
        let pickerView:UIPickerView = UIPickerView()
    
        // 设置代理
        pickerView.dataSource = self
        pickerView.delegate = self
    
        // 将 pickerView 添加到屏幕
        self.view.addSubview(pickerView)
    
        // 设置列数,必须设置,UIPickerViewDataSource 协议方法
        func numberOfComponentsInPickerView(pickerView: UIPickerView) -> Int {
    
            return 3
        }
    
        // 设置行数,必须设置,UIPickerViewDataSource 协议方法
        func pickerView(pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {
    
            return 10
        }
    
        // 设置各行内容,必须设置,UIPickerViewDelegate 方法
        func pickerView(pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? {
    
            return String(format: "%li行 - %li列", row, component)
        }

2、UIPickerView 的设置

  • Objective-C

        // 设置默认值
        [pickerView selectRow:1 inComponent:0 animated:YES];      // 第 0 列的默认值为 1
        [pickerView selectRow:2 inComponent:1 animated:YES];      // 第 1 列的默认值为 2
        [pickerView selectRow:3 inComponent:2 animated:YES];      // 第 2 列的默认值为 3
    
        // 设置 frame
        /*
            高度只有三个值:162, 180 和 216,默认为 216,设置为其它的值无效
        */
        pickerView.frame = CGRectMake(10, 30, self.view.bounds.size.width - 20, 162);
    
        // 设置位置
        pickerView.center = self.view.center;
    
        // 设置背景颜色
        pickerView.backgroundColor = [UIColor orangeColor];
    
        // 是否显示指示器
        /*
            default is NO
        */
        pickerView.showsSelectionIndicator = YES;
    
        // 刷新指定的列
        [pickerView reloadComponent:0];
    
        // 刷新所有的列
        [pickerView reloadAllComponents];
    
        // 获取列数,只读
        NSInteger numberOfComponents = pickerView.numberOfComponents;
    
        // 获取指定列的行数
        NSInteger numberOfRows = [pickerView numberOfRowsInComponent:0];
    
        // 获取指定行的尺寸
        CGSize rowSize = [pickerView rowSizeForComponent:0];
    
        // 获取指定列被选中的行数索引
        NSInteger selectedIndex = [pickerView selectedRowInComponent:0];
    
        // 获取指定行列的视图
        UIView *view = [pickerView viewForRow:3 forComponent:0];
    
        // 设置列宽
        /*
            不设置时为默认宽度,UIPickerViewDelegate 方法
        */
        - (CGFloat)pickerView:(UIPickerView *)pickerView widthForComponent:(NSInteger)component {
    
            return 50;
        }
    
        // 设置行高
        /*
            不设置时为默认高度 32,UIPickerViewDelegate 方法
        */
        - (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component {
    
            return 50;
        }
  • Swift

        // 设置默认值
        pickerView.selectRow(1, inComponent: 0, animated: true)      // 第 0 列的默认值为 1
        pickerView.selectRow(2, inComponent: 1, animated: true)      // 第 1 列的默认值为 2
        pickerView.selectRow(3, inComponent: 2, animated: true)      // 第 2 列的默认值为 3
    
        // 设置 frame
        /*
            高度只有三个值:162, 180 和 216,默认为 216,设置为其它的值无效
        */
        pickerView.frame = CGRectMake(10, 30, self.view.bounds.size.width - 20, 162)
    
        // 设置位置
        pickerView.center = self.view.center
    
        // 设置背景颜色
        pickerView.backgroundColor = UIColor.orangeColor()
    
        // 是否显示指示器
        /*
            default is NO
        */
        pickerView.showsSelectionIndicator = true
    
        // 刷新指定的列
        pickerView.reloadComponent(0)
    
        // 刷新所有的列
        pickerView.reloadAllComponents()
    
        // 获取列数,只读
        let numberOfComponents:Int = pickerView.numberOfComponents
    
        // 获取指定列的行数
        let numberOfRows:Int = pickerView.numberOfRowsInComponent(0)
    
        // 获取指定行的尺寸
        let rowSize:CGSize = pickerView.rowSizeForComponent(0)
    
        // 获取指定列被选中的行数索引
        let selectedIndex:Int = pickerView.selectedRowInComponent(0)
    
        // 获取指定行列的视图
        let view:UIView? = pickerView.viewForRow(3, forComponent: 0)
    
        // 设置列宽
        /*
            不设置时为默认宽度,UIPickerViewDelegate 方法
        */
        func pickerView(pickerView: UIPickerView, widthForComponent component: Int) -> CGFloat {
    
            return 50
        }
    
        // 设置行高
        /*
            不设置时为默认高度 32,UIPickerViewDelegate 方法
        */
        func pickerView(pickerView: UIPickerView, rowHeightForComponent component: Int) -> CGFloat {
    
            return 50
        }

3、UIPickerViewDataSource 协议方法

  • Objective-C

        // 设置列数
        - (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView {
    
        }
    
        // 设置行数
        - (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {
    
        }
  • Swift

        // 设置列数
        func numberOfComponentsInPickerView(pickerView: UIPickerView) -> Int {
    
        }
    
        // 设置行数
        func pickerView(pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {
    
        }

4、UIPickerViewDelegate 协议方法

  • Objective-C

        // 设置各行内容为 字符串
        - (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {
    
        }
    
        // 设置各行内容为 NSAttributedString 型字符串
        - (NSAttributedString *)pickerView:(UIPickerView *)pickerView attributedTitleForRow:(NSInteger)row forComponent:(NSInteger)component {
    
        }
    
        // 设置各行内容为 view
        - (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view {
    
        }
    
        // 设置列宽
        - (CGFloat)pickerView:(UIPickerView *)pickerView widthForComponent:(NSInteger)component {
    
        }
    
        // 设置行高
        - (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component {
    
        }
    
        // 检测行的选择状态,在滑动停止后触发
        - (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component {
    
        }
  • Swift

        // 设置各行内容为 字符串
        func pickerView(pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? {
    
        }
    
        // 设置各行内容为 NSAttributedString 型字符串
        func pickerView(pickerView: UIPickerView, attributedTitleForRow row: Int, forComponent component: Int) -> NSAttributedString? {
    
        }
    
        // 设置各行内容为 view
        func pickerView(pickerView: UIPickerView, viewForRow row: Int, forComponent component: Int, reusingView view: UIView?) -> UIView {
    
        }
    
        // 设置列宽
        func pickerView(pickerView: UIPickerView, widthForComponent component: Int) -> CGFloat {
    
        }
    
        // 设置行高
        func pickerView(pickerView: UIPickerView, rowHeightForComponent component: Int) -> CGFloat {
    
        }
    
        // 检测行的选择状态,在滑动停止后触发
        func pickerView(pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) {
    
        }
上一篇:iOS - UIScrollView


下一篇:iOS - UIWebView