Apple fornisce che un controllo girevole conosciuto come il UIPickerView, con la quale un utente può selezionare un elemento da un elenco. In questo tutorial ti spiegherò come creare una semplice pickerView a 2 colonne.
La visualizzazione del selettore consente all’utente di selezionare un elemento da un elenco. In questo tutorial, imparerai come è facile configurare una visualizzazione del selettore e rispondere agli eventi. Questo è il risultato finale:
Ora creiamo un nuovo progetto di tipo Single-View Application e come nome mettiamo “Meteo” o qualcosa a nostro piacere.
Per prima cosa creiamo l’interfaccia grafica andiamo sul file xib e inseriamo 2 label e un PickerView in modo da coincidere con l’immagine sopra citata, l’interfaccia non è delle migliori ma sta a te colorarla e renderla carina.
Andiamo nel file ViewController.h e inseriamo questo codice :
[code lang=”objc”]
#import <UIKit/UIKit.h>
@interface ViewController : UIViewController <UIPickerViewDelegate,UIPickerViewDataSource>{
NSArray *array1;
NSArray *array2;
}
@property (retain, nonatomic) IBOutlet UILabel *oggiLabel;
@property (retain, nonatomic) IBOutlet UILabel *voglioAndare;
@end
[/code]
non facciamo altro che inserire i delegati del picker, dichiarare due array ed inserire le proprietà delle due label che andranno collegate al file xib e sintetizzate. Oppure come ho fatto io possiamo usare la tecnica del ctrl+click per collegare direttamente nel file ViewController.h tutti gli elementi creati nel file xib. La tecnica viene descritta nei minimi particolari qui: Apprendista sviluppatore 4 durante il tutorial per usare il MapKit. Inoltre non dimentichiamoci di collegare le proprietà dataSource e delegate al File’s Owner.
Ora andiamo nel file ViewController.m e inseriamo quest’altro codice:
[code lang=”objc”]
– (void)viewDidLoad{
[super viewDidLoad];
array1=[[NSArray alloc]initWithObjects:@\”piove\”,@\”nuvoloso\”,@\”sole\”, nil];
array2=[[NSArray alloc]initWithObjects:@\”il mare\”,@\”la montagna\”,@\”dormire\”, nil];
}
[/code]
Ora passiamo all’implementazione dei delegate:
[code lang=”objc”]
-(NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView{
return 2; //numero delle colonne
}
-(NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component{
//il component indica la colonna su cui si agisce
if (component==0) {
return [array1 count];
}
else{
return [array2 count];
}
}
-(NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component{
switch (component) {
case 0:
return [array1 objectAtIndex:row];
case 1:
return [array2 objectAtIndex:row];
}
return nil;
}
[/code]
Ed infine dobbiamo implementare il delegate della selezione che aggiornerà anche le label:
[code lang=”obj-c”]-(void)pickerView:(UIPickerView *)pickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component{
switch (component) {
case 0:
NSLog(@\”Selezionato:%@ riga: %i\”,[array1 objectAtIndex:row],row);
oggiLabel.text =[NSString stringWithFormat:@\”Oggi:%@\”,[array1 objectAtIndex:row]];
break;
case 1:
NSLog(@\”Selezionato:%@ riga: %i\”,[array2 objectAtIndex:row],row);
voglioAndare.text = [NSString stringWithFormat:@\”voglio andare:%@\”,[array2 objectAtIndex:row]];
default:
break;
}
}[/code]
Non facciamo altro che controllare quale colonna si è mossa e quindi agiamo di conseguenza aggiornando le label con il nuovo valore ricevuto dalla riga del pickerView.
Ecco il risultato finale:
È tutto. Vi lascio con il progetto di esempio che abbiamo costruito insieme. Dubbi e domande, lasciate un commento.
