Date Picker and Picker View

Picker

Date picker 提供日期讓使用者選擇，而Picker View 可以做出比較多特效，有單一挑選值、兩個轉輪供挑選、兩個轉輪選擇值會互相依賴影響、或者在轉輪上面加上圖片和值。每一個轉輪稱為 Picker Component，可以依據實作方式決定它的外觀。使用 datasource 和 delegate 來做出特效。

使用 Picker 不能只是單純從 Interface Builder 拖拉配製就使用，需要額外提供 picker delegate 和 picker datasource。Datasource 告知 picker 有多少 components 需要運轉和多少項目供挑選來組成。Delegate 在這邊扮演最重要角色是每個 rows 要怎麼畫。Picker 會問 delegate 不論是顯示 String 或者圖片提供給該 component，picker 從 delegate 取得顯示資料。

DatePicker
在 DatePickerViewController 宣告 UIDatePicker，規劃出 IBOutlet 和 IBAction。另外在 Interface Builder 拖拉 Date Picker 之後，將相關的關聯配製好。之後回到 Xcode 在類似事件處理區，可以從 datePicker 取得 date 資訊了。

SingleComponentPicker
在 SingleComponentPicker 要記得 implement UIPickerViewDelegate, UIPickerViewDataSource。
@interface SingleComponentPickerViewController : UIViewController {...}
宣告 UIPickerView 和 NSArray 放置資料用，配製好 property 和相關 IBOutlet 以及 IBAction。在 Interface Builder 拖拉 Picker View 之後，將相關的關聯配製好，記得將 Delegate 和 DataSource 都要拖拉關聯到 File's Owner 上。
-(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView {...}
告知 Picker View 只要 show 一組。
-(NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {...}
回傳每一列有多少筆資料
- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {...}
當畫面轉輪變換時候，可以更新取得值。

DoubleComponentPicker
跟 SingleComponentPicker 一樣的規劃，記得 implement UIPickerViewDelegate, UIPickerViewDataSource。
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView {...}
告知要 show 兩組
-(NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {...}
當詢問哪一個 component 回傳該規劃的總量，類似給與 NSArray 的 count。
- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {...}
當畫面轉輪變換時候，更新該 component 的值

DependentComponentPicker
跟前面一樣規劃，在 DependentComponentPickerView.m 實作 Picker Data Source 和 Picker Delegate 的 methods
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView {...}
告知要 show 兩組
-(NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {...}
當詢問哪一個 component 回傳該規劃的總量，類似給與 NSArray 的 count。
- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {...}
當畫面轉輪變換時候，更新該 component 的值
- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component {...}
因為我們要做出互動，所以當選的時候，透過這邊來改變 picker 的值，達到例如挑選了主選單，更新了副選單的值。

CustomPicker
為了做出 5 個轉輪特效，在 viewDidLoad method 要把 png 檔案 load 進來，放置在 UIImageView 裡面，再將這些配製到 5 個 NSArray 中。利用 spin method 來啓動轉動輪盤。
-(IBAction) spin {...}
這邊透過隨機來轉動轉輪，根據五個的圖片值，來決定是否獲勝 (出現三個相同圖案) 或者重試。
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView {...}
告知要 show 5 組
-(NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {...}
回傳轉輪上面的圖片數量，所以 return [self.column1count]; 即可。
- (UIView *)pickerView:(UIPickerView *)pickerView
viewForRow:(NSInteger)row
forComponent:(NSInteger)component reusingView:(UIView *) view {...}
根據 compoent 編號，取得 Array，再根據 row 來回傳選取到的圖片。

以上一種 DatePicker 和四種 Picker View 的效果，我們可以學到彼此共同點和差異點，如果有興趣可以參考書本 Beginning iPhone 3 Development 章節 Tab Bars and Pickers，或者 Github：edwardinubuntu/Picker