Corso di programmazione di sistemi mobile 1 1 Android Activity, View e Layout.

Presentazione sul tema: "Corso di programmazione di sistemi mobile 1 1 Android Activity, View e Layout."— Transcript della presentazione:

1 Corso di programmazione di sistemi mobile 1 1 Android Activity, View e Layout

2 Corso di programmazione di sistemi mobile 2 2 Activity In qualsiasi programma è sicuramente richiesta un interfaccia grafica che permetta all’utente di visualizzare e interagire con essa secondo i principi previsti dallo sviluppatore. In Android questa interfaccia viene solitamente gestita tramite le activity. Possiamo immaginare un activity come una schermata, un contenitore di componenti grafici e oggetti messi a disposizione all’utente. È facile intuire come in un applicazione possano esservi diverse schermate che comunichino, si richiamino e si susseguano anche più volte. E’ questo il motivo per cui solitamente un programma consiste in più activity connesse tra loro, la principale delle quali è solitamente definita main activity. Android organizza le activity secondo un principio di stack, in base al quale l’activity attualmente in uso è quella in cima. Il richiamo di una specifica activity porterà questa in cima allo stack, ponendo quindi le altre in uno stato di pausa. Ogni applicazione aperta mantiene uno stack delle Activity che permette di tornare all’activity precedente tramite la pressione del tasto back o all’invocazione di un metodo predefinito. In termini di programmazione, una activity è intesa come un estensione della classe android.app.Activity del framework di Android.

3 Corso di programmazione di sistemi mobile 3 3 Ogni activity definita nel nostro progetto deve estendere laclasse di Activity o una sua sottoclasse. Per poter comprendereal meglio le activity e come utilizzarle è necessario innanzituttocapire il suo ciclo di vita. I principali metodi sono: o onCreate() : Invocato ogni volta che l’activity viene creata. All’interno di questo metodo è consigliabile effettuare tuttequelle operazioni che dovranno essere eseguite una sola volta,come ad esempio l’impostazione del layout e l’assegnamentodei riferimenti alle variabili. o onStart() : viene invocato ogni volta che l’activity viene portata in prima piano e quindi visualizzata sullo schermo. Alsuo interno è buona norma impostare tutte le componentirelative alla visualizzazione delle informazioni. Ciclo Di Vita

4 Corso di programmazione di sistemi mobile 4 4 o onResume() : tale metodo è richiamato ogni volta che l’activity diventa interattiva, cioè quando l’utente può interagire con essa. Pertanto al suo interno vanno gestite tutte quelle funzioni relative all’uso da partedell’utente (suoni, animazioni, ecc.) Si aggiunge un ulteriore metodo, onRestart(), che viene eseguito nel caso in cui un activity precedentemente messa in pausa ritorna attiva. Esso è stato introdotto come alternativa a onCreate(), pertutte quelle situazioni in cui devono essere ripristinati oggetti inizializzati all’interno di onCreate() edisabilitati nel metodo onStop().Per ognuno dei metodi appena citati esiste un metodo complementare: o onPause() : eseguito nel momento in cui l’activity smette di essere interattiva. Essendo simmetrico a onResume() è necessario eliminare le eventuali risorse allocate al suo interno (ad esempio interrompereun’eventuale canzone in riproduzione). o onStop() : complementare a onStart() è eseguito nel momento in cui l’activity non è più visibile sullo schermo. o onDestroy() : invocato nel momento in cui l’activity viene eliminata, ad esempio a seguito della pressione del tasto Back.

5 Corso di programmazione di sistemi mobile 5 5 Layouts Ogni activity ha bisogno di un proprio layout per definire come saranno visualizzate le informazioni da mostrare all’utente ed i vari componenti per poter gestire l’interazione con esso. Android ci mette a disposizione, oltre che una gran quantità di View, anche vari layouts per determinare la disposizione delle View. Tali layout, che ereditano tutti la superclasse comune ViewGroup, si differenziano per il modo in cui permettono di disporre la View in essi contenute. Android quindi disegna i componenti di una schermata attraverso oggetti della classe View, raccolti all'interno di oggetti ViewGroup (che possono raccogliere, a loro volta, altri oggetti View e ViewGroup), per creare strutture anche molto complesse, partendo da alcuni semplici componenti. La presentazione di informazioni all'interno di un'activity, per alcune applicazioni, è spesso legata a una sorgente di dati. In tal caso è particolarmente importante collegare quest'ultima ai meccanismi che hanno il compito di presentare le informazioni all'interno degli oggetti ViewGroup dell'activity.

6 Corso di programmazione di sistemi mobile 6 6 La descrizione dell’interfaccia grafica di una applicazione può avvenire: Attraverso file xml Attraverso codice java Nel primo caso l'interfaccia grafica viene descritta in un file xml (res/layout) il cui nome è l'id che nepermette il riferimento. Il metodo findViewById(int ResourceId) della classe Activity ritorna un riferimento aun oggetto View presente all'interno delle risorse di progetto, attraverso il suo id.Nel secondo caso l’interfaccia grafica deve essere creata a runt-time andando a definire inoltre tutte leproprietà che si definiscono all’intero del file xml come il colore di sfondo, l’orientamento ecc.public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main);//file xml LinearLayout layout = new LinearLayout(this); setContentView(layout);//codice java}

7 Corso di programmazione di sistemi mobile 7 7 View e ViewGroup Esistono diverse specializzazioni degli oggetti View e ViewGroup. Alcune specializzazioni della classe View, definiti all’interno del package widget, sono: Button per rappresentare i bottoni TextView, EditText per visualizzare e inserire il testo ImageView per visualizzare le immagini Alcune specializzazioni della classe ViewGroup sono: LinearLayout per disporre le view in modo verticale o orizzontale RelativeLayout per disporre le view in base alla posizione relativa di un’altra view o del contenitore TableLayout per disporre le view come se stessimo lavorando con una tabella Le specializzazioni dette sopra ereditano dalle rispettive classi padre numerosi metodi e costanti pertanto, durante la scrittura del codice, è necessario avere sempre a portata di mano la documentazione. Normalmente il layout più utilizzato è il LinearLayout

8 Corso di programmazione di sistemi mobile 8 8 Si tratta di un layout che dispone le view lungo la direzione stabilita dalla proprietàandroid:layout_orientation, che può assumere i valori horizontal (le view sono disposte su colonne) e vertical (le view sono disposte su righe). Qualora il numero di view sia tale da andare oltre le dimensioni delloschermo si possono utilizzare le View: ScrollView e HorizontalScrollView. Esempio di LinearLayout orizzontale: Linear Layout

9 Corso di programmazione di sistemi mobile 9 9 Esempio di LinearLayout orizzontale:

10 Corso di programmazione di sistemi mobile 10 Corso di programmazione di sistemi mobile 10 Il RelativeLayout richiede una gestione più complessa rispetto alLinearLayout, ma fra tutti i componenti messi a disposizione dallapiattaforma è probabilmente il più flessibile da utilizzare. Tale componente consente di definire il posizionamento di una delleView in termini relativi indicando, come deve posizionarsi rispetto ad unao più altre View presenti all’interno del contenitore oppure rispetto aimargini laterali del relative layout. Ad esempio, nell’immagine a fianco, il bottone con id button1 viene posizionato in alto a sinistra all’interno del proprio contenitore. Il button2 viene posizionato al di sotto e a destra del button1 e il margine destro allineato con quello del proprio contenitore. Infine il button3 viene posizionato al di sotto del button2 allineando i margini sinistro e destro con quelli del RelativeLayout. Relative Layout

11 Corso di programmazione di sistemi mobile 11 Corso di programmazione di sistemi mobile 11

12 Corso di programmazione di sistemi mobile 12 Corso di programmazione di sistemi mobile 12 Widget I widget rappresentano le view che prevedono un interazione con l’utente. Android mette a disposizione diverse view base, le principali sono: TextView per visualizzare del testo EditText per inserire del testo Button per visualizzare un pulsante ImageView per visualizzare le immagini

13 Corso di programmazione di sistemi mobile 13 Corso di programmazione di sistemi mobile 13 È una etichetta, label e graficamente rappresenta un semplice testo fisso. Viene definita all’interno di un filexml tramite il tag TextView La proprietà xml che ci consente di impostare il testo è android :text dove è possibile scrivere direttamente il testo o inserire un riferimento ad un stringa (@string/hello_world) TextView

14 Corso di programmazione di sistemi mobile 14 Corso di programmazione di sistemi mobile 14 Permette l’input di testo da parte dell’utente. Con l’attributo android:inputType si possono impostare i formati di input come password, testo, date, indirizzi ecc… La proprietà android:hint permette di inserire untesto di aiuto e viene visualizzato quando non è presente la parola inserita dall’utente EditText

15 Corso di programmazione di sistemi mobile 15 Corso di programmazione di sistemi mobile 15 È il classico pulsante la cui «pressione» comporta solitamente il verificarsi di un conseguente evento.L’azione da intraprendere alla pressione del pulsante può essere definita a livello di codice tramite il metodoOnClickListener dell’oggetto Button, oppure tramite la proprietà android:onClick. Se si utilizza la proprietà onClick dovrà essere definito un metodo con lo stesso nome all’interno dell’activitye dovrà avere come parametro la view.< Button android :layout_width= "wrap_content" android :layout_height= "wrap_content" android :text= "Visualizza« android :onClick= "visualizzaPass" android :id= "@+id/button_vis" /> Button //Metodo invocato con la pressione del Pulsante public void visualizzaPass(View view) { // … } //Alternativa usando OnClickListener Button button (Button)findViewById(R.id.button_vis); button.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { text.setText(password.getText()); } });

16 Corso di programmazione di sistemi mobile 16 Corso di programmazione di sistemi mobile 16 Risultato ottenuto avviando l’applicazione e cliccando il pulsante visualizza dopo aver inserito una parolanel campo password del widget editText

17 Corso di programmazione di sistemi mobile 17 Corso di programmazione di sistemi mobile 17 View che permette di visualizzare una immagine, piu precisamente una Bitmap che può essere caricata dalle risorse (R.drawable) oppure dinamicamente da file.XML < ImageView android :src= "@drawable/connected" android :layout_width= "wrap_content" android :layout_height= "wrap_content" android :id= "@+id/imageViewId" /> Java:ImageView image = (ImageView) findViewById(R.id.imageViewId);image.setImageResource(R.drawable.connected); ImageView