UIPickerView的使用

簡介：UIPickerView是一個選擇器控件，它比UIDatePicker更加通用，它可以生成單列的選擇器，也可生成多列的選擇器，而且開發者完全可以自定義選擇項的外觀，因此用法非常靈活。UIPickerView直接繼承了UIView，沒有繼承UIControl，因此，它不能像UIControl那樣綁定事件處理方法，UIPickerView的事件處理由其委託對象完成。使用UIPickerView的對象應該遵守UIPickerViewDataSource,UIPickerViewDelegate。 

一、UIPickerView控件常用的屬性和方法如下：

Ø numberOfComponents：獲取UIPickerView指定列中包含的列表項的數量。該屬性是一個只讀屬性。 
  
Ø showsSelectionIndicator：該屬性控制是否顯示UIPickerView中的選中標記（以高亮背景作爲選中標記）。 

Ø - numberOfRowsInComponent:：獲取UIPickerView包含的列數量。 
  
Ø - rowSizeForComponent:：獲取UIPickerView包含的指定列中列表項的大小。該方法返回一個CGSize對象。 

Ø - selectRow:inComponent:animated:：該方法設置選中該UIPickerView中指定列的特定列表項。最後一個參數控制是否使用動畫。 
  
Ø - selectedRowInComponent:：該方法返回該UIPickerView指定列中被選中的列表項。 
  
Ø - viewForRow:forComponent:：該方法返回該UIPickerView指定列的列表項所使用的UIView控件。 
 
UIDatePicker控件只是負責該控件的通用行爲，而該控件包含多少列，各列包含多少個列表項則由UIPickerViewDataSource對象負責。開發者必須爲UIPickerView設置
UIPickerViewDataSource對象，並實現如下兩個方法。 

Ø - numberOfComponentsInPickerView:：該UIPickerView將通過該方法來判斷應該包含多少列。 
 
Ø - pickerView:numberOfRowsInComponent:：該UIPickerView將通過該方法判斷指定列應該包含多少個列表項。 

如果程序需要控制UIPickerView中各列的寬度，以及各列中列表項的大小和外觀，或程序需要爲UIPickerView的選中事件提供響應，都需要爲UIPickerView設置UIPickerViewDelegate委託對象，並根據需要實現該委託對象中的如下方法。 
  
Ø - pickerView:rowHeightForComponent:：該方法返回的CGFloat值將作爲該UIPickerView控件中指定列中列表項的高度。 

Ø - pickerView:widthForComponent:：該方法返回的CGFloat值將作爲該UIPickerView控件中指定列的寬度。 

Ø - pickerView:titleForRow:forComponent:：該方法返回的NSString值將作爲該UIPickerView控件中指定列的列表項的文本標題。 

Ø - pickerView:viewForRow:forComponent:reusingView:：該方法返回的UIView控件將直接作爲該UIPickerView控件中指定列的指定列表項。 

Ø - pickerView:didSelectRow:inComponent:：當用戶單擊選中該UIPickerView控件的指定列的指定列表項時將會激發該方法。 
  

二、UIPickerView的使用方法（先以單列選擇器爲例）：

1、遵守協議

2、創建pickerView

3、實現代理

//UIPickerViewDataSource中定義的方法，該方法的返回值決定該控件包含的列數
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView*)pickerView
{
    return 1; // 返回1表明該控件只包含1列
}

//UIPickerViewDataSource中定義的方法，該方法的返回值決定該控件指定列包含多少個列表項
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component
{
    // 由於該控件只包含一列，因此無須理會列序號參數component
    // 該方法返回teams.count，表明teams包含多少個元素，該控件就包含多少行
    return _teams.count;
}


// UIPickerViewDelegate中定義的方法，該方法返回的NSString將作爲UIPickerView
// 中指定列和列表項的標題文本
- (NSString *)pickerView:(UIPickerView *)pickerView
             titleForRow:(NSInteger)row forComponent:(NSInteger)component
{
    // 由於該控件只包含一列，因此無須理會列序號參數component
    // 該方法根據row參數返回teams中的元素，row參數代表列表項的編號，
    // 因此該方法表示第幾個列表項，就使用teams中的第幾個元素
    
    return [_teams objectAtIndex:row];
}

// 當用戶選中UIPickerViewDataSource中指定列和列表項時激發該方法
- (void)pickerView:(UIPickerView *)pickerView didSelectRow:
(NSInteger)row inComponent:(NSInteger)component
{
    // 使用一個UIAlertView來顯示用戶選中的列表項
    UIAlertView* alert = [[UIAlertView alloc]
                          initWithTitle:@"提示"
                          message:[NSString stringWithFormat:@"你選中的球隊是：%@"
                                   , [ _teams objectAtIndex:row]]
                          delegate:nil
                          cancelButtonTitle:@"確定"
                          otherButtonTitles:nil];
    [alert show];
}

 

效果圖

 多列選擇器（以二列爲例）

 1、遵守協議和創建兩個數據源

2、創建pickView

 

3、實現代理

 

//UIPickerViewDataSource中定義的方法，該方法的返回值決定該控件包含的列數
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView*)pickerView
{
    return 2; // 返回2表明該控件只包含2列
}

//UIPickerViewDataSource中定義的方法，該方法的返回值決定該控件指定列包含多少個列表項
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component
{
    // 如果該控件只包含一列，因此無須理會列序號參數component
    // 該方法返回teams.count，表明teams包含多少個元素，該控件就包含多少行
    if (component == 0) {
        return _areas.count;
    }
    else
        return _teams.count;
    
}


// UIPickerViewDelegate中定義的方法，該方法返回的NSString將作爲UIPickerView中指定列和列表項的標題文本
- (NSString *)pickerView:(UIPickerView *)pickerView
             titleForRow:(NSInteger)row forComponent:(NSInteger)component
{
    // 由於該控件只包含一列，因此無須理會列序號參數component
    // 該方法根據row參數返回teams中的元素，row參數代表列表項的編號，
    // 因此該方法表示第幾個列表項，就使用teams中的第幾個元素
    if (component == 0) {
        return [_areas objectAtIndex:row];
    }
    return [_teams objectAtIndex:row];
}


// 當用戶選中UIPickerViewDataSource中指定列和列表項時激發該方法
- (void)pickerView:(UIPickerView *)pickerView didSelectRow:
(NSInteger)row inComponent:(NSInteger)component
{
    
    NSArray *tmp = component == 0 ? _areas: _teams;
    NSString *tip = component == 0 ? @"區域":@"球隊";
    // 使用一個UIAlertView來顯示用戶選中的列表項
    UIAlertView* alert = [[UIAlertView alloc]
                          initWithTitle:@"提示"
                          message:[NSString stringWithFormat:@"你選中的%@是：%@"
                                   , tip ,[ tmp objectAtIndex:row]]
                          delegate:nil
                          cancelButtonTitle:@"確定"
                          otherButtonTitles:nil];
    [alert show];
}

// UIPickerViewDelegate中定義的方法，該方法返回的NSString將作爲
// UIPickerView中指定列的寬度
-(CGFloat)pickerView:(UIPickerView *)pickerView
   widthForComponent:(NSInteger)component
{
    // 如果是第一列，寬度爲90
    if(component == 0) {
        return 90;
    }
    return 210; // 如果是其他列（只有第二列），寬度爲210
}

 

效果圖

現在我們一起學習相互依賴的多列選擇器

 1、遵守協議

2、創建pickView

 

3、實現協議

//UIPickerViewDataSource中定義的方法，該方法的返回值決定該控件包含的列數
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView*)pickerView
{
    return 2; // 返回2表明該控件只包含2列
}

//UIPickerViewDataSource中定義的方法，該方法的返回值決定該控件指定列包含多少個列表項
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component
{
    // 由於該控件只包含一列，因此無須理會列序號參數component
    // 該方法返回teams.count，表明teams包含多少個元素，該控件就包含多少行
    
    if (component == 0) {
        return _areas.count;
    }
    else
    
        return [[_teams objectForKey:_selectedAreas]count];
    
}


// UIPickerViewDelegate中定義的方法，該方法返回的NSString將作爲UIPickerView
// 中指定列和列表項的標題文本
- (NSString *)pickerView:(UIPickerView *)pickerView
             titleForRow:(NSInteger)row forComponent:(NSInteger)component
{
    // 由於該控件只包含一列，因此無須理會列序號參數component
    // 該方法根據row參數返回teams中的元素，row參數代表列表項的編號，
    // 因此該方法表示第幾個列表項，就使用teams中的第幾個元素
    
    if (component == 0) {
        return [_areas objectAtIndex:row];
    }
    return [[_teams objectForKey:_selectedAreas]objectAtIndex:row];
    
}

// 當用戶選中UIPickerViewDataSource中指定列和列表項時激發該方法
- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component
{
    
    if (component == 0) {
        _selectedAreas = [_areas objectAtIndex:row];
        [self.pickView reloadComponent:1];
        
    }
    
    NSArray *tmp = component == 0 ? _areas: [_teams objectForKey:_selectedAreas];
    
    NSString *tip = component == 0 ? @"區域":@"球隊";
    // 使用一個UIAlertView來顯示用戶選中的列表項
    UIAlertView* alert = [[UIAlertView alloc]
                          initWithTitle:@"提示"
                          message:[NSString stringWithFormat:@"你選中的%@是：%@"
                                   , tip ,[ tmp objectAtIndex:row]]
                          delegate:nil
                          cancelButtonTitle:@"確定"
                          otherButtonTitles:nil];
    [alert show];
}


// UIPickerViewDelegate中定義的方法，該方法返回的NSString將作爲
// UIPickerView中指定列的寬度
-(CGFloat)pickerView:(UIPickerView *)pickerView
   widthForComponent:(NSInteger)component
{
    // 如果是第一列，寬度爲90
    if(component == 0) {
        return 90;
    }
    return 210; // 如果是其他列（只有第二列），寬度爲210
}

 

效果圖：