Basic4Android: Creiamo una prima, semplice applicazione

Basic4Android è un'alternativa molto valida all'SDK ufficiale di Android.
La sua sintassi è quasi uguale a quella del Visual Basic, e dunque è molto facile da comprendere.
Vediamo oggi come scrivere una prima, semplicissima applicazione in b4a.


Cosa impareremo
Questo non sarà un tutorial su come creare un banale "Hello World": il nostro programma non si limiterà a stampare una stringa prefissata, ma sarà leggermente più complesso e "personalizzabile":
Al click sul Button, verrà cambiato il testo della label in "Ciao NOME" dove NOME sarà preso dalla EditText.
Nel caso in cui sia selezionata una casella di spunta che vedremo in seguito, verrà anche mostrato un Toast, che è semplicemente un messaggino che spunta in basso, una sorta di popup.
In questo modo cercheremo di imparare diverse cose:

• Disegnare un interfaccia con b4a
• Utilizzare l'IDE
• EditText
• CheckBox
• Button
• Label
• Concatenamento di stringhe
• IF
• Altre istruzioni basi

Costruiamo l'interfaccia
Sulla barra del menu, clicchiamo su "Designer" .
Appariranno due finestre:  l'Abstract Designer e il Designer.
Il primo altro non è che il nostro "schermo virtuale", lo spazio dove andremo a piazzare i vari controlli dell'interfaccia grafica.
Il secondo invece è una finestra che mostra le varie proprietà del controllo selezionato, e permette di fare varie cose.

Per prima cosa, connettiamo il designer al nostro emulatore o macchina virtuale, facendo doppio click sull'icona a sinistra di "Status: ....."
Una volta connesso, siamo pronti per disegnare la nostra interfaccia.

Per aggiungere un controllo (o più tecnicamente, in Android si chiamano View) non dobbiamo far altro che cliccare, dalla finestra Designer, su "Add View".
Dal menù a tendina possiamo scegliere tra una lista, l'elemento che ci serve.
Una volta cliccato, il controllo verrà aggiunto sull'altra finestra aperta, in quello spazio nero, e sarà possibile ridimensionare e spostare l'oggetto.

Importante: Per ogni View che aggiungete, cliccateci su col tasto destro e selezionate "Dim NOME as TIPO" dove NOME e TIPO ovviamente cambieranno in relazione all'oggetto selezionato.

Quando avete finito, cliccate su "File -> Save" e come nome del layout scegliete uno qualsiasi, io di solito uso "main" (In seguito ci servirà in quanto verrà caricato in una routine)
Bene, ora sapete creare, a grandi linee, un'interfaccia, divertitevi! :D
Ecco la nostra come dovrà venire, prima nel Designer, e poi nel lancio vero e proprio dell'applicazione:

 

Il layout non è proprio perfetto, anche a causa del taglio che ho fatto sull'immagine, ma in ogni caso, dovreste riuscire a distinguere le varie View.
Ricapitolando, abbiamo 4 controlli nella nostra interfaccia, che sono:

1. EditText - txtNome
2. CheckBox - chkToast
3. Button - btnSaluta
4. Label - lblSaluta

Quelli a destra sono i nomi, che io ho deciso di stabilire per comodità, voi potete non cambiarli o cambiarli a vostro piacimento, ovviamente però, nel corso della guida, ogni qualvolta che incontrerete i controlli col nome da me scelto, voi, in caso non li abbiate chiamati allo stesso modo, dovrete necessariamente cambiare il nome anche nel codice.

Vediamo innanzitutto la EditText: tramite la proprietà "Hint" settata a "Inserisci il tuo nome", il testo verrà immediatamente cancellato appena l'utente cliccherà sul campo di testo.
Dunque, il testo impostato con hint è usato come suggerimento di cosa inserire all'interno dell'EditText.

Il testo "Saluta" sul Button, "Mostra un Toast" sulla CheckBox, e "Clicca sul bottone per salutare" sulla label, sono tutti settati tramite la proprietà Text dei vari controlli.

Programmazione
Breve nota per chi non sapesse come creare funzioni: b4a, nonché Visual Basic, per iniziare la dichiarazione di una nuova funzione o routine, richiedono l'uso della keyword Sub (Che termina ovviamente con End Sub).

b4a inserisce delle sub prestabilite, ovvero:

Sub Process_Globals
Dove vengono dichiarate le variabili globali inizializzate una volta che l'applicazione inizia. Tali variabili saranno accessibili da tutti i moduli.

Sub Globals
Anche qui vengono dichiarate le variabili globali ma, tali variabili saranno accessibili solo dal modulo corrente.

Sub Activity_Create(FirstTime As Boolean):
Viene chiamata non appena viene creata l'Activity.

Sub Activity_Resume
Viene chiamata non appena viene ripresa l'Activity.

Sub Activity_Pause (UserClosed As Boolean)
Viene chiamata non appena viene interrotta l'Activity.

Possiamo notare, se avete eseguito i passaggi precedenti (in particolare sul menu "Generate" -> "Dim ....") che nella Sub "Globals" l'IDE ha già scritto il codice per la dichiarazioni delle variabili delle View del layout:

Dim txtNome As EditText
Dim chkToast As CheckBox
Dim btnSaluta As Button
Dim lblSaluta As Label

Ora, dal momento che tutto si basa sul click del bottone, vediamo come gestire tale evento.Dal designer, selezioniamo col tasto destro il Button e scegliamo Generate.Questa volta però, clicchiamo la voce "Click".
Verrà creata una nuova sub: btnSaluta_ClickTale funzione è chiamata automaticamente nel momento in cui si fa appunto un click sul Button.Quindi, il codice successivo, verrà scritto tutto in questa funzione, ed avremo dunque:

Sub btnSaluta_Click
 Dim nome As String
 nome = txtNome.Text
 lblSaluta.Text = "Ciao " & nome
 If chkToast.Enabled Then
  ToastMessageShow("Ciao anche dal Toast, " & nome, False)
 End If
End Sub

Dichiariamo una variabile "nome" che conterrà il testo digitato nella EditText, che prenderemo accedendo alla proprietà "Text" della nostra variabile txtNome.

Quindi procediamo a visualizzare il seguente testo nella label:   "Ciao " & nomeNotate quella "&" che serve a concatenare due stringhe ( o più, aggiungendo altre &, es:  "Ciao " & nome & " bentornato!")

A questo punto abbiamo già un programma funzionante che fa qualcosa, ma come detto nell'introduzione, ho voluto aggiungere un'ulteriore View (CheckBox), che se spuntata mostrerà anche un Toast, tramite la funzione ToastMessageShow, che prende come primo parametro la stringa da visualiazzare e come secondo parametro scegliamo True se vogliamo che il Toast sia visualizzato per un periodo più lungo, False se deve apparire per pochi secondi. 

Ovviamente però, dobbiamo fare un controllo per vedere se la checkbox è selezionata, e lo facciamo tramite l'istruzione If.
Il funzionamento è molto semplice:  IF condizione Thenazione da fare se condizione è vera  (if=se)Else azione da fare se condizione è falsa (else=altrimenti)End IfIn realtà ci sarebbe anche "Else If", usato quando vogliamo controllare se è un altro determinato valore, ma nel nostro caso, così come qualunque caso True/False, occorre solamente If/Else;  anzi, a noi l'else non interessa, perché nel caso la check non sia selezionata, noi non facciamo nulla.

Quindi il controllo va fatto solo sulla proprietà "enabled" della nostra CheckBox, che appunto restituisce True se è spuntata, e False ovviamente se non è spuntata.

Risultato finale: