01-UIPickerView

weixin_34007291發表於2017-09-22

一.UIPickerView

1.UIPickerView的常見屬性

// 資料來源(用來告訴UIPickerView有多少列多少行)
@property(nonatomic,assign) id<UIPickerViewDataSource> dataSource;

// 代理(用來告訴UIPickerView每1列的每1行顯示什麼內容,監聽UIPickerView的選擇)
@property(nonatomic,assign) id<UIPickerViewDelegate>   delegate;

// 是否要顯示選中的指示器
@property(nonatomic) BOOL showsSelectionIndicator;

// 一共有多少列
@property(nonatomic,readonly) NSInteger numberOfComponents;

2.UIPickerView的常見方法

// 重新重新整理所有列
- (void)reloadAllComponents;

// 重新重新整理第component列
- (void)reloadComponent:(NSInteger)component;

// 主動選中第component列的第row行
- (void)selectRow:(NSInteger)row inComponent:(NSInteger)component animated:(BOOL)animated;

// 獲得第component列的當前選中的行號
- (NSInteger)selectedRowInComponent:(NSInteger)component;

3.資料來源方法(UIPickerViewDataSource)

//  一共有多少列
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView;

//  第component列一共有多少行
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component;

4.代理方法(UIPickerViewDelegate)

//  第component列的寬度是多少
- (CGFloat)pickerView:(UIPickerView *)pickerView widthForComponent:(NSInteger)component;

//  第component列的行高是多少
- (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component;

//  第component列第row行顯示什麼文字
- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component;

//  第component列第row行顯示怎樣的view(內容)
- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view;

//  選中了pickerView的第component列第row行
- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component;

二.UIDatePicker

1.常見屬性

// datePicker的顯示模式
@property (nonatomic) UIDatePickerMode datePickerMode;

// 顯示的區域語言
@property (nonatomic, retain) NSLocale   *locale;

2.監聽UIDatePicker的選擇

  • 因為UIDatePicker繼承自UIControl,所以通過addTarget:...監聽

三.Demo

1.UIPickerView的demo(點菜)

效果圖:

3680843-3665e20c19ff22d7.png
1.png

需求:選擇器中選擇的什麼,相應的下面的label就顯示什麼。

程式碼:(若想要demo示例,可私下聯絡)

#import "ViewController.h"
@interface ViewController ()<UIPickerViewDataSource, UIPickerViewDelegate>
// pickView
@property (weak, nonatomic) IBOutlet UIPickerView *pickView;
// 所有食物
@property (nonatomic, strong) NSArray *foodArray;
// 水果
@property (weak, nonatomic) IBOutlet UILabel *fruitLabel;
// 主食
@property (weak, nonatomic) IBOutlet UILabel *foodLabel;
// 飲料
@property (weak, nonatomic) IBOutlet UILabel *drinkLabel;


@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // 設定預設選中的內容
    self.fruitLabel.text = self.foodArray[0][0];
    self.foodLabel.text = self.foodArray[1][0];
    self.drinkLabel.text = self.foodArray[2][0];
}

#pragma mark - 懶載入
-(NSArray *)foodArray
{
    if (_foodArray == nil) {
        // 載入plist檔案
        NSString *fullPath = [[NSBundle mainBundle] pathForResource:@"foods.plist" ofType:nil];
        // 初始化(分配記憶體空間)
        _foodArray = [NSArray arrayWithContentsOfFile:fullPath];
    }
    return _foodArray;
}
    
#pragma mark - UIPickerViewDataSource
// pickview一共多少列
-(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView
{
    return self.foodArray.count;
}
// 返回pickerView的第component列有多少行
-(NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component
{
    // 獲取對應列的陣列
    NSArray *subFoods = self.foodArray[component];
    // 獲取對應列的行數
    return subFoods.count;
}

#pragma mark - UIPickerViewDelegate
// 返回第component列的第row行顯示什麼內容
-(NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component
{
    // 獲取對應列的陣列
    NSArray *subFoods = self.foodArray[component];
    // 獲取對應行的標題
    NSString *title = subFoods[row];
    return title;
}
    
// 當選中了pickerView的某一行的時候呼叫
// 會將選中的列號和行號作為引數傳入
// 只有通過手指選中某一行的時候才會呼叫
-(void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component
{
    // 獲取對應列和行的資料
    NSString *title = self.foodArray[component][row];
    // 判斷選擇的是哪一列,根據列號設定對應的資料
    if (component == 0) {
        self.fruitLabel.text = title;
    } else if (component == 1) {
        self.foodLabel.text = title;
    } else {
        self.drinkLabel.text = title;
    }
}

@end

可能出現的問題:

  1. 資料顯示不出來?
    原因:
  • 檢視一下是否設定了代理或則資料來源(或則是否進行了連線)


    3680843-576249966911fc98.png
    2.png
  • 檢視一下設定列數時是不是用的是點語法self.foodArray.count;