zoukankan      html  css  js  c++  java
  • iOS 5 编程实现自定义的选择器视图(UIPickerView)

    iOS 5 编程-工具栏UIToolbar和日期选择器UIDatePicker的应用中,演示了UIDatePicker 日期选择器的使用。

    这里将创建一个自定义的选择器视图,提供的范例App在iPad 模拟器中运行,iPhone的版本稍有差异。iPad 采用popover 弹出式视图,iPhone 版本采用模态视图,这个符合Apple的UI设计规范(Apple要求必须在弹出框中显示选择器)。

    范例App的运行界面如下所示(iPad模拟器)

    要实现自定义选择器视图,必须实现类遵守选择器委托协议(UIPickerViewDelegate)和选择器数据源协议(UIPickerViewDataSource)。

    @interface AppleChooserViewController : UIViewController <UIPickerViewDataSource, UIPickerViewDelegate>

    上述定义的AppleChooserViewController 类将负责实现自定义选择器视图正常运行所需的所有方法。

    1. 遵守选择器数据源协议(UIPickerViewDataSource),必须实现的2个方法。

    - (NSInteger) numberOfComponentsInPickerView:(UIPickerView *)pickerView
    {
    return kComponentCount;
    }
    这个方法返回选择器将显示多少个Component。

    - (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component
    {
    if(component == kAppleComponent)
    return [self.appleNames count];
    else{
    return [self.appleColor count];
    }
    }
    这个方法根据相应的component编号,返回该component将显示的元素数,也就是每一个component包含的元素数。这里使用了常量kAppleComponent,需要自己在AppleChooserViewController.m实现文件中定义。

    2. 实现选择器视图委托协议

    选择器视图委托协议负责定制选择器的显示方法,以及在用户在选择器中选择时,做出相应的操作。

    下面这个方法在选择器相应位置,显示自定义的视图。第一个component显示苹果图片;第二个component显示一个label标签,文本信息为苹果颜色。

    - (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view{
    if(component == kAppleComponent){
    return [self.appleImages objectAtIndex:row];
    }
    else{
    UILabel *colorLabel;
    colorLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 100, 32)];
    colorLabel.backgroundColor = [UIColor clearColor];
    colorLabel.text = [self.appleColor objectAtIndex:row];
    return colorLabel;
    }
    }

    设置选择器component的高度:

    - (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component
    {
    if(component == kAppleComponent){
    return 200.0;
    }
    else{
    return 55.0;
    }
    }

    设置选择器component的宽度:

    - (CGFloat)pickerView:(UIPickerView *)pickerView widthForComponent:(NSInteger)component{
    if(component == kAppleComponent){
    return 200.0;
    }
    else{
    return 120.0;
    }
    }

    下面这个委托方法,用来获取用户在自定义的选择器中所做的选择,这个方法提供的参数为用户选择的component和行号row。

    - (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component{
    MainViewController *initialView = self.mainViewControler;

    if(component == kAppleComponent)
    {
    int chosenColor = [pickerView selectedRowInComponent:kColorComponent];
    [initialView displaySelectedApple:[self.appleNames objectAtIndex:row]
    withColor:[self.appleColor objectAtIndex:chosenColor]
    fromComponent:@”苹果组”];
    } else{
    int chosenApple = [pickerView selectedRowInComponent:kAppleComponent];
    [initialView displaySelectedApple:[self.appleNames objectAtIndex:chosenApple]
    withColor:[self.appleColor objectAtIndex:row]
    fromComponent:@”颜色组”];
    }
    }

    其中[initialView displaySelectedApple:]是调用初始视图(主视图)的方法displaySelectedApple,用来在主视图显示用户在自定义选择器视图中所做的选择。

    3. 还需要建立连接,也就是将选择器视图的输出口dataSource和delegate连接到视图控制器对象。





  • 相关阅读:
    添加或删除项并动态记录项的值
    练习题。对DOM中document的深刻理解巩固
    document--文档中的操作,操作属性、操作样式、操作元素
    10.13DOM中document--文档1找到元素的方法,还有元素内容属性
    函数的定义,语法,二维数组,几个练习题
    10.11讲的内容总结
    js基础巩固练习
    10.9做的一个静态页面(巩固前面的内容)
    9.29学习的js基础
    9.28做的作业(企业名称静态网页)
  • 原文地址:https://www.cnblogs.com/tuncaysanli/p/2727848.html
Copyright © 2011-2022 走看看