iOS UIPickerView tutorial - IB

UIPickerView究竟是啥(請見下圖)


這是個在iphone內相當常見的一個功能
還可以切成好幾個欄位來作選取滾動
操作上是相當好用的
但是該如何切入使用呢？

首先開啟Interface Builder隨便拉一個UIPickerView


接著來看看有哪些屬性
先點下Inspector


就會出現這畫面，告訴你這個UIPickerView內有哪些東西可以來設定


但是光這樣拉UIPickerView compile後也是看不到任何內容
記得要把delegate還有dataSource連結上File's Owner
以及在.h檔內加上IBOutlet
#import

/*
UIPickerViewDelegate, UIPickerViewDataSource
上面這行是最重要的東西，也就是所謂的Delegate
一定要加入
*/
@interface UIPickerViewViewController : UIViewController {
//這兩行是讓Interface Builder裡面拖拉的物件連結在一起
IBOutlet UIPickerView *myPicker;
IBOutlet UILabel *myLabel;

//等一下要丟入的內容的陣列
NSMutableArray *myArray;
}

//這兩行是用property方式管理記憶體
@property (nonatomic, retain) IBOutlet UIPickerView *myPicker;
@property (nonatomic, retain) IBOutlet UILabel *myLabel;

@end


存檔後繼續開啟Interface Builder再來玩一下連連看
File's Owner上面點下右鍵連到picker


File's Owner上面點下右鍵連到label


如果你動作都跟我長得一樣現在在File's Owner上面應該會長這個樣


接著就是把內容丟入picker啦
開啟.m檔 直接把這些貼進去
#import "UIPickerViewViewController.h"

@implementation UIPickerViewViewController

//有使用property請記得這邊也要相對應
@synthesize myPicker, myLabel;

- (void)viewDidLoad {
[super viewDidLoad];

//給這個陣列一個記憶體位置
myArray = [[NSMutableArray alloc] init];
//一次塞100行進去看起來比較厲害
for(int i = 0; i < 100; i++){
//[陣列名稱 新增一個內容:內容(這邊給他一個字串)];
[myArray addObject:[NSString stringWithFormat:@"這是第 %d 行",i+1]];
}

}

/*************************************************************/
//當前所選擇為哪一項
-(void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component{
//把選擇到的丟入 myLabel中顯示出來
myLabel.text = [myArray objectAtIndex:row];
}

//設定滾輪總共有己欄
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)thePickerView {
return 1;
}

//設定滾輪總共有幾個項目
- (NSInteger)pickerView:(UIPickerView *)thePickerView numberOfRowsInComponent:(NSInteger)component {
return [myArray count];
}

//設定滾輪每一個行位內容為啥
- (NSString *)pickerView:(UIPickerView *)thePickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {
return [myArray objectAtIndex:row];
}

/*************************************************************/


- (void)didReceiveMemoryWarning {
// Releases the view if it doesn't have a superview.
[super didReceiveMemoryWarning];

// Release any cached data, images, etc that aren't in use.
}

- (void)viewDidUnload {
// Release any retained subviews of the main view.
// e.g. self.myOutlet = nil;
}


- (void)dealloc {
//記得記憶體要把他給釋放掉(必須在[super dealloc]前)
[myPicker release];
[myLabel release];
[super dealloc];
}

@end


完成後的demo影片


下次再來介紹如何使用code直接在.m檔內實做UIPickerView以及UIDatePicker

相關連結
iOS UIPickerView Class Reference
Download this example