UIButton e gestione dei touch dell’utente – Guida Sviluppo App iOS

Nel capitolo precedente abbiamo creato una semplice inerfaccia grafica contenente due bottoni che, se cliccati, non producono nessuna azione. In questo capitolo andremo, quindi, ad associare uno specifico comportamento in relazione al touch dell’utente.

Iniziamo con il dire che i bottoni (classe UIButton) derivano da una superclasse detta UIControl che fornisce una base di implementazione per oggetti come bottoni e slider. In sostanza, gli elementi che derivano dalla classe UIControl sono elementi che stanno in ascolto, in attesa, cioè, di un’interazione con l’utente.

Adesso metteremo in pratica quanto detto nei pargrafi precedenti, modificando il nostro programma affinchè, una volta cliccato per esempio il Bottone1, il testo della label venga aggiornato con un nuovo testo ("E’ stato premuto il bottone…").

Anche in questo caso andremo a scrivere il metodo di gestione del comportamento dell’azione dell’utente e poi collegheremo, con Interface Builder, tale metodo ai due bottoni. Per fare ciò è necessario introdurre un’altra parola chiave, ovvero IBAction. In questo modo, il metodo che andremo a scrivere comparirà nel menù delFile’s Owner e potremo collegare il metodo al bottone nella stessa maniera in cui abbiamo collegato gli elementi grafici con il codice sorgente.

Detto questo, andiamo ad arire il file header del ViewController ed inseriamo, come prototipo del metodo, il seguente codice:

-(IBAction)azioneBottone:(id)sender;

Come possiamo vedere abbiamo usato IBAction, come detto precedentemente, ed abbiamo aggiunto il parametro sender. Questo parametro ci permetterà di riconoscere quale dei due pulsanti è stato premuto consentendoci di modellare un comportamento diverso per i due bottoni.

Spostiamoci adesso nel file di implementazione ed inseriamo il seguente codice:

-(IBAction)azioneBottone:(id)sender{
  if(sender == bottone1){
    [label setText:@"Ho premuto il Bottone1"];
  } 
  else{
    [label setText:@"Ho premuto il Bottone2"];
  }
}

Come possiamo vedere, utilizzando il cosrutto condizionale if andiamo a modellare il comportamento della nostra applicazione inconseguenza di quale dei due ottoni è stato premuto. Il metodo setText invocato sulla label semplicemente inserisce nella label la stringa passata come argomento. A questo punto abbiamo terminato la scrittura del codice e dunque non ci resta che aprire Interface Builder per effettuare gli opportuni collegamenti. Clicchiamo su File’s Owner e posizioniamoci nelle connections. Come possiamo vedere, oltre agli elementi grafici collegati precedentemente, è apparso un nuovo sotto menù: Received Action. In questo sottomenù verranno inseriti tutti quei metodi che abbiamo dichiarato con la direttiva IBAction. Adesso è sufficiente collegare il metodo con i due bottoni, nella stessa modalità con la quale abbiamo collegato gli elementi grafici. Nel caso dei metodi è necessario selezionare il tipo di evento che lancierà il metodo e nel nostro caso scegliamo Touch Up Inside ovvero il touch da parte dell’utente all’interno del bottone. Una volta effettuato il collegamento e salvato il progetto di Interface Builder, sarò sufficiente lanciare l’applicazione per vedere che il tutto funzioni perfettamente.

Como possiamo vedere la gestione del touch dell’utente sugli elementi grafici di Interface Builder è abbastanza facile. Si consiglia al lettore di esercitarsi su questo argomento creando più metodi che gestiscano eventi diversi come, ad esempio, il Touch Up Outside.