Objective-C UIPickerView

Bu dersimizde UIPickerView sınıfına kullanarak uygulama geliştireceğiz. UIPickerView nedir, nerede kullanılır, nasıl veri eklenir, bu veriler nasıl erişilir, örnekler üzerinde anlatmaya çalışacağım.

Merhaba
Bu dersimizde UIPickerView sınıfına kullanarak uygulama geliştireceğiz. UIPickerView nedir, nerede kullanılır, nasıl veri eklenir, bu veriler nasıl erişilir, örnekler üzerinde anlatmaya çalışacağım.

PickerView daha anlaşılır ve gözünüzde bir şeyler canlanması adına PickerView'e Combobox diyebiliriz. İkisi de aynı ihtiyaçlara cevap veriyorlar.Bu yüzden Combobox demek çok da yanlış olmayacaktır.

Uygulamamıza geçmeden önce kısaca ne yapacağımızı anlatmak istiyorum PickerView ekleyip verilerini bir dizi'den çekip PickerView'e sıralı olarak ekleyeceğiz.UIPickerView Sınıfının bize sağladığı olay dinleyiciler ile PickerView üzerinde bir seçim değişikliği olduğunda metot'umuz çalışarak güncel seçimi alacağız.

Adım 1
Select File > New Project diyerek yeni bir proje açıyoruz.Ben proje ismi kısmına UIPickerView yazıyorum



Adım 2
Projemizi açtıktan sonra görüntü denetleyicimizi (UIViewController) eklemeliyiz.Bir önceki ders'de Helloworld uygulaması ile bu sınıfı açıklamıştık.

Sağ taraftaki Classes Klasörüne sağ tıklayarak Add > New File diyerek ekleyebiliriz.



Sağ taraftaki dosya ağacından Classes klasörüne ViewController.m ViewController.h ve ViewController.xib dosyalarını oluşturmuş olmalı.
UIPickerViewAppDelegate sınıfımızı açarak görüntü denetleyicimizi eklememiz gerektiğini bir önceki ders'de belirmiştik her ders'de bu konuya değinmek istemiyorum.Bundan sonraki derslerde zaman kazanmak adına sadece ViewController bağlantı sağlamamız gerektiğini hatırlatıp geçeceğim


UIPickerViewAppDelegate.m



- (void)applicationDidFinishLaunching:(UIApplication *)application { 

 self.viewController = [ViewController alloc];

[window addSubview:self.viewController.view];

[window makeKeyAndVisible];

}

UIPickerViewAppDelegate.h



#import <UIKit/UIKit.h> 

@class ViewController;

@interface UIPickerViewAppDelegate : NSObject <UIApplicationDelegate> {

UIWindow *window;

ViewController *viewController;

}

@property (nonatomic, retain) IBOutlet UIWindow *window;

@property (nonatomic, retain)  ViewController  *viewController;

@end




Görüntü denetleyicisine buton ,resim bir önceki ders'de eklediğimiz etiket(label) gibi nesneleri direk kod üzerinden ekleyebiliriz.Alternatif olarak ViewController.xib dosyasından Interface Builder aracılığı ilede ekleyebiliyoruz.Bu dersimizde her iki alternatifinde görmeniz adına Interface Builder ile ekleyeceğiz.

Adım 3
Sağ taraftaki dosya ağacından ViewController.xib dosyasını seçiyoruz.



Bu seçin sonrasında Xcode Interface Builder otomatik açıldığını göreceksinizdir.

Adım 4
Interface Builder birleşenlerinden (components) PickerView ve Label Sürükle bırak işlemi ile View alanıza bırakınız.



Adım 5
Bu adımda ViewController.h (Interface) sınıfına değişkenlerimizi ekleyerek bunlara implementation üzerinden erişim sağlayacağız.PickerView için ise gerekli olan sınıfları tanımlayacağız.

ViewController.h

@interface ViewController : UIViewController <UIPickerViewDelegate, UIPickerViewDataSource>

{

//UILabel sınıfını kullanarak mlabel adında etiket tanımlıyorum.

IBOutlet UILabel *mlabel;

//NSMutableArray sınıfını kullanarak arrayNO dizimi oluşturuyorum.

NSMutableArray *arrayNo;

// *1 Açıklama

IBOutlet UIPickerView *pickerView;

 }

// *1 Açıklama

@property (nonatomic, retain) UILabel *mlabel;

@end




*1 UIPickerView sınıfını kullanarak daha önceden xib'den eklediğimiz PickerView temsil etmesi için pickerView tanımlıyorum.Bu atamayı birazdan yapacağız.

Adım 6
ViewController.m sıfını açarak interface üzerinde oluşturduğumuz değişkenleri kullanarak PickerView(Combobox) verilerini ekliyecegiz.PickerView üzerinde yapılan seçimi mlabel adında oluşturduğumuz etiketimize yazdıracağız.


@implementation ViewController

@synthesize mlabel;



//Sınıfımız hazır olduğunda çalışacak olan ilk metodumuz, bu metot sizlerde de ekli olarak geldiğini göreceksinizdir.Bu metot da,daha önceden oluşturduğum diziye elemanlar ekliyorum. 

- (void)viewDidLoad

{

[super viewDidLoad];

arrayNo = [[NSMutableArray alloc] init];

[arrayNo addObject:@"Actionscript 3.0"];

[arrayNo addObject:@"ADO.NET"];

[arrayNo addObject:@"Objective-C"];

[arrayNo addObject:@"C++"];

[arrayNo addObject:@"HTML 5"];

[pickerView selectRow:1 inComponent:0 animated:NO];

//Etiketimize default(varsayılan) olarak dizimin birinci elemanını atıyorum.

mlabel.text= [arrayNo objectAtIndex:[pickerView selectedRowInComponent:0]];

}



//PickerView sütün sayısını belirleyen metot

- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView;

{

//Sütün sayısı

return 1;

}



//PickerView üzerinden seçim değişikliği olduğunda çalışacak olan metodumuz. 

- (void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component

{

//Seçilen degeri mlabel adında oluşturdgumuz etiketimize atıyorum.

mlabel.text= [arrayNo objectAtIndex:row];

}



//PickerView kaç satırlı olacağını belirleyen metot burada dizinin eleman sayısını alarak satır sayısını belirleyip değerleri eklememize sağlayan metodumuz.

- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component;

{

return [arrayNo count];

}



//Dizi elemanları bitene kadar dönerek değerleri return edip elemanları pickerView eklememizi sağlıyor.

- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component;

{

return [arrayNo objectAtIndex:row];

}



Adım 7
4.Adımda yaptığımız ViewController.xib View üzerine interface Builder ile PickerView ve Label eklemiştik.Bir sonraki adımda ise ViewController.h sınıfında değişkenlerimizi oluşturmuştuk bu adımımızda ise bunların arasındaki bağlantıyı sağlayacağız.

Versiyon farklıkları nedeni ile Interface Builder çok ufak da olsa farklılık gösteriyor.Ben tüm versiyonlarda mevcut olan yöntem ile bu bağlantıyı sağlayacağım.Farklı menülerden farklı şekilde de bağlantı sağlanabiliyor.Ancak tüm versiyonlarda geçerli değil yerleri farklı bu nedenle bu yöntemi tercih ediyorum.Alternatifleri nede değinmeye çalışıcam.

Sağ taraftaki dosya agaçından ViewController.xib tıklayarak 4.adımda bulunduğumuz Interface Builder kısmına geliyoruz.View üzerinde bulunan Label ve PickerView e sağ tıklıyoruz.




Açılan siyah pencede dataSource delegate ve pickerView karşılığının boş oldugunu göreceksinizdir bağlantınızı henüz sağlamadıgınız için beyaz ration butona benzer kısımı sürekle bırak yöntemi ile File's Over üzerine sürekleyerek bırakmalısınız.Bu işlemi dogru yaptıgınızdan lütfen emin olun benim paylaştıgım resimdeki siyah penceredeki bağlantıların sağlanmış olmasına dikkat edin.

Aynı işlemi Label içinde yapıyoruz.



Bu adımı eksiksiz uyguladıkdan sonra interface 'de tanımladıgımız değişkenler ile interface Builder ile eklediğimiz pickerView ve Label bağlantılarını sağlamış olduk.

Özetle bu ders'de ne yaptığımızı anlatmak istiyorum.UIPickerView ve UILabel Sınıflarından faydanalarak PickerView'den yapılan seçimi label(etikete) yazdırdık.

Uygulamayı test edebilmek için Build > Build and Go demelisiniz. Kullandıgınız xCode sürümüne bağlı olarak Sağ üst köşeden "Run" diyebilirsiniz.

Önizleme ve Kaynak dosya

  • Etiketler;
Yorum Yaz

Yorum yazabilmek için üye girişi yapmanız gerekiyor!

Yukarı Git