Disegnare UITableViewCell direttamente da IB

Programmazione, Sviluppo on November 29th, 2008 No Comments

Da bravi sviluppatori iPhone avrete sicuramente avuto a che fare con le UITableView; questo significa che, a meno di non aver voluto utilizzare la UITableViewCell di default (che comunque è adattabile nella maggior parte dei casi) sarete dovuti ricorrere ad una subclass della stessa provvedendo programmaticamente al disegno degli oggetti al suo interno.

Una tecnica che a dire la verità puzza un pò di vecchio e che oltre ad essere scomoda per la montagna di codice da aggiungere (potenzialmente inutile) fa si che la vostra applicazione sia anche difficile da modificare in un secondo momento.

Ma allora perchè non utilizzare Interface Builder per disegnare il contenuto della vostra cella risparmiando così prezioso tempo (sia prima che dopo), ma sopratutto guadagnandoci in salute?

E’ proprio quello che ho pensato quache giorno fa: così mi sono messo a cercare un pò tra le API e su Internet confidando nella buona sorte; purtroppo le informazioni scarseggiano e le soluzioni sembrano non funzionare (inoltre parecchi messaggi fanno riferimento alle vecchie versioni dell’SDK).
Dopo aver studiato un pò la cosa ecco la soluzione.
Create una subclass di UITableViewCell

Di seguito l’header file (in questo esempio disegneremo una cella con solo due label, una per il titolo e una per il sottotilo; ovviamente una volta scelto il vostro layout potrete mettere i riferimenti agli oggetti creati in IB per poterli usare poi).


@interface PSTSTableCell : UITableViewCell {
IBOutlet UILabel *labelTitle;
IBOutlet UILabel *labelSubTitle;
}

@property (readonly) UILabel *labelTitle;
@property (readonly) UILabel *labelSubTitle;
@end

 
Sarà ora necessario creare un file .XIB dove andremo a collocare la nostra UITableViewCell. Sebbene possa sembrare ridondante la creazione di un ulteriore XIB per ogni tipo di cella, questo ci permetterà di caricare le risorse necessarie all’applicazione soltanto nel momento in cui esse verranno effettivamente utilizzate.

Scegliete quindi la voce “New File…” dal menu File di XCode e selezionate “Empty XIB” sotto la categoria “User Interfaces” di iPhone OS. Il nome del XIB non ci interessa particolarmente, ma per praticità useremo lo stesso nome della nostra classe.

Apriamo ora lo XIB e trasciniamo dalla libreria un nuovo elemento UITableViewCell. Dopo aver disegnato la nostra cella come in figura impostiamo il tipo di classe dell’oggetto su PSTSTableCell e l’Identifier ad una stringa qualsiasi (ad esempio “MyClass”). A questo punto il grosso del lavoro è fatto.

Passiamo quindi al nostro UITableViewController (o comunque al datasource della tabella dove vogliamo usare la cella) e -tableView:cellForRowAtIndexPath: inseriamo il codice che segue:


static NSString *CellIdentifier = @"MyCell";
PSTSTableCell *cell = (PSTSTableCell*)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];

if (cell == nil) {
cell = (PSTSTableCell *) [[[NSBundle mainBundle] loadNibNamed:@"PSTSTableCell" owner:self options:nil] objectAtIndex:1];
}

// Set up the cell...
cell.labelTitle.text = [NSString stringWithFormat: @"Titolo %d",indexPath.row];
cell.labelSubTitle.text = [NSString stringWithFormat: @"Sottotitolo %d",indexPath.row];
return cell;

Come già sappiamo il metodo dequeueReusableCellWithIdentifier:CellIdentifier: si occupa di cercare nella cache del sistema la cella richiesta in modo da evitare una nuova allocazione (va ricordato che una delle attività più dispendiose in un programma per iPhone è proprio il caricamente degli UIView). Almeno la prima volta il metodo non restituirà nulla; a questo punto avviene il caricamento vero e proprio: utilizziamo -loadNibNamed per caricare il nib che contiene la nostra cella, acquisendo l’oggetto 1 (quindi il secondo dopo il File Owner) nella gerarchia del nib (che guardacaso è proprio la nostra cella customizzata).

A questo punto possiamo impostare i valori tipici di ogni cella (nel nostro esempio scriviamo semplicemente titolo e sottotitolo seguiti dall’indice della cella nella relativa sezione).

Il risultato è qualcosa del genere (click per ingrandire):

Trovate il codice del progetto qui.

Tags: , ,

No Responses to “Disegnare UITableViewCell direttamente da IB”

Leave a Reply