Android Essentials creazione di moduli utente semplici

Le applicazioni Android spesso fanno affidamento sui dati forniti dagli utenti. Questo tutorial ti guida attraverso la creazione e l'uso di alcuni dei controlli più comuni utilizzati per raccogliere dati dall'utente, tra cui:

  • Il controllo EditText
  • Il controllo Spinner
  • Il controllo Checkbox
  • Il controllo Button

A proposito, se stai cercando una soluzione rapida, controlla Android Dynamic Form, un plug-in generatore dinamico di moduli disponibile su Envato Market.

Modulo dinamico Android

Per questo tutorial, si progetta e si implementa un modulo all'interno dell'applicazione Android che consente all'utente di fornire un feedback importante allo sviluppatore. All'utente viene fornita una serie di opzioni per l'invio di diversi tipi di feedback. Questo feedback può quindi essere inviato allo sviluppatore come un'email. Il modulo che creerai apparirà in questo modo:

ipotesi

Gli autori presumono che il lettore abbia una conoscenza di base di Android e che tutti gli strumenti siano installati e funzionanti, in particolare Eclipse, l'SDK Android e il plug-in Android ADT per Eclipse.

I lettori possono anche trarre vantaggio dalla lettura del nostro suggerimento rapido: consentire agli utenti di inviare e-mail dalle applicazioni Android - in modo semplice.

Passaggio 0: creazione di un semplice progetto Android

Inizia creando un nuovo progetto Android. Puoi anche seguire il codice sorgente fornito come supplemento a questo tutorial.

Passaggio 1: progettazione del modulo

Innanzitutto, è necessario riflettere sul tipo di dati che si desidera raccogliere dall'utente. Il modulo può avere un numero qualsiasi di campi. Considera i tipi di dati che desideri raccogliere e scegli il tipo di controllo appropriato. Per esempio:

  • Per raccogliere l'input di testo, utilizzare i controlli EditText
  • Per limitare l'utente a un set fisso di risposte, utilizzare i controlli Spinner, in modo simile a un menu a discesa
  • Per raccogliere l'input booleano (sì / no), utilizzare i controlli CheckBox
  • Per consentire all'utente di attivare eventi, utilizzare i controlli Button

Per questo tutorial, starai progettando un modulo di feedback. Questo modulo raccoglie cinque parti di dati dall'utente:

  • Il nome dell'utente (una stringa)
  • L'email dell'utente (una stringa)
  • Il tipo di feedback (opzioni: Praise, Gripe, Suggestion o Bug)
  • Il messaggio di feedback (una stringa)
  • Se l'utente desidera o meno una risposta e-mail (un booleano)

Passaggio 2: creazione della risorsa di layout

Inizia creando una risorsa di layout per la schermata del modulo. Il modulo avrà una serie di campi, che potrebbero estendersi su più di un singolo schermo (a seconda delle dimensioni dello schermo del dispositivo), quindi dovresti considerare di avvolgere l'intero modulo all'interno di un controllo ScrollView per abilitare le barre di scorrimento.

Il controllo ScrollView deve avere esattamente una vista secondaria, quindi considera quale controllo di layout è più appropriato per il modulo che desideri creare. I moduli sono spesso contenuti all'interno di un controllo LinearLayout orientato verticalmente, in modo che i campi modulo si sovrappongano verticalmente, uno dopo l'altro. Ciò aiuta anche l'attenzione dell'utente a spostarsi da un campo all'altro in modo naturale.

Una semplice risorsa di layout del modulo potrebbe essere simile a questa:

     

Passaggio 3: aggiungere un controllo TextView (descrizione del modulo)

Successivamente, è necessario aggiungere un controllo TextView all'interno del controllo LinearLayout. Il controllo TextView chiamato TextViewTitle visualizza la descrizione e lo scopo del modulo per l'utente. Questo controllo visualizza una risorsa stringa chiamata @ string / feedbacktitle, che deve essere definita all'interno del file di risorse stringa /res/values/strings.xml.

Ecco l'XML da aggiungere al file di risorse del layout del modulo:

 

Passaggio 4: aggiungere un controllo EditText (nome)

Ora devi aggiungere il tuo primo controllo EditText appena sotto il controllo TextView appena creato. Questo controllo EditText chiamato EditTextName funge da campo modulo per il nome dell'utente. Puoi utilizzare l'attributo hint per fornire una stringa da visualizzare nel controllo EditText quando è vuota (ad esempio "Inserisci il tuo nome qui ..."). È anche possibile impostare l'attributo inputType del controllo EditText per applicare la logica di inserimento del nome.

Ecco l'XML da aggiungere al file di risorse del layout del modulo:

 

Passaggio 5: aggiungi un altro controllo EditText (email)

Successivamente, devi aggiungere il tuo secondo controllo EditText appena sotto il controllo EditText chiamato EditTextName. Questo controllo EditText chiamato EditTextEmail funge da campo modulo per l'indirizzo email dell'utente. Ancora una volta, imposta l'attributo hint per fornire una stringa da visualizzare nel controllo EditText quando è vuota. Questa volta, imposta l'attributo inputType del controllo EditText a textEmailAddress, che renderà più facile l'immissione delle email sull'utente.

Ecco l'XML da aggiungere al file di risorse del layout del modulo:

 

Passaggio 6: aggiungere un controllo Spinner (tipo di feedback)

Successivamente, devi aggiungere un controllo Spinner appena sotto il controllo EditText appena creato. Questo controllo Spinner chiamato SpinnerFeedbackType consente all'utente di selezionare il tipo di feedback da un elenco fisso di opzioni (Praise, Gripe, Suggestion o Bug).

Innanzitutto, è necessario definire queste scelte come singole risorse stringa nel file di risorse strings.xml.

   Lode Lamentela Suggerimento insetto 

Quindi, creare una risorsa di matrice di stringhe usando le singole risorse di stringa come segue in /res/values/arrays.xml:

   @ String / feedbacktype1 @ String / feedbacktype2 @ String / feedbacktype3 @ String / feedbacktype4  

Ora sei pronto per configurare il controllo Spinner nel layout del modulo. Inizia fornendo l'attributo prompt, che fornirà una stringa utile nella parte superiore del controllo Spinner. Quindi, specificare l'elenco di scelte di stringa usando l'attributo entries, in particolare, impostare l'attributo entries sull'array di stringhe appena definito: @ array / feedbacktypelist.

Ecco l'XML da aggiungere al file di risorse del layout del modulo:

 

Passaggio 7: aggiungere un controllo EditText multilinea (Feedback)

Successivamente, devi aggiungere un altro controllo EditText appena sotto il controllo Spinner. Questo controllo EditText chiamato EditTextFeedbackBody funge da campo modulo per il testo del feedback. Ancora una volta, imposta l'attributo hint per fornire una stringa da visualizzare nel controllo EditText quando è vuota. Questa volta si desidera offrire all'utente ampio spazio per scrivere elogi, suggerimenti, suggerimenti o descrivere bug nell'applicazione. Pertanto, potresti voler impostare l'attributo inputType del controllo EditText a textMultiLine e specificare il numero di linee da disegnare usando l'attributo lines.

Ecco l'XML da aggiungere al file di risorse del layout del modulo:

 

Passaggio 8: aggiungere un controllo CheckBox

Successivamente, è necessario aggiungere un controllo CheckBox appena sotto il controllo EditText appena creato. Questo controllo CheckBox chiamato CheckBoxResponse consente all'utente di scegliere se desidera o meno richiedere una risposta via email dallo sviluppatore dell'app. È possibile utilizzare l'attributo di testo per fornire una stringa da visualizzare accanto al controllo CheckBox.

Ecco l'XML da aggiungere al file di risorse del layout del modulo:

 

Passaggio 9: aggiungere un controllo pulsante

Finalmente, sei pronto per completare il modulo con un controllo Button. Se vuoi avere un pulsante con del testo, usa il controllo Button; se preferisci un pulsante con un'immagine, usa invece un controllo ImageButton. Useremo un controllo Button qui. Per prima cosa, imposta il testo sul controllo Button usando l'attributo text. Successivamente, puoi facilmente registrare un gestore di clic (anziché registrarlo a livello di programmazione nell'attività) per il controllo Button utilizzando l'attributo onClick.

Ecco l'XML da aggiungere al file di risorse del layout del modulo:

Eccellente! Hai finito di progettare il tuo modulo. Ora, tutto ciò che devi fare è implementare il metodo sendFeedback () nella tua attività.

Passaggio 10: implementare un gestore di clic Button

Nel controllo Button, hai specificato l'attributo onClick come sendFeedback. Ora è necessario implementare un metodo chiamato sendFeedback () all'interno della classe Activity. Per esempio:

public void sendFeedback (pulsante Visualizza) // Fai clic sulla gestione qui 

Passaggio 11: lettura dell'ingresso dai controlli di EditText

Ora che il modulo è stato progettato e i controlli sono stati implementati, è necessario raccogliere i dati del modulo dai singoli campi quando si fa clic sul controllo Button..

Per un controllo EditText, si utilizza il metodo getText ().

final EditText nameField = (EditText) findViewById (R.id.EditTextName); Nome stringa = nomeField.getText (). ToString (); final EditText emailField = (EditText) findViewById (R.id.EditTextEmail); String email = emailField.getText (). ToString (); final EditText feedbackField = (EditText) findViewById (R.id.EditTextFeedbackBody); String feedback = feedbackField.getText (). ToString (); 

Passaggio 12: lettura dell'ingresso dai controlli Spinner

Il tuo modulo includeva un controllo Spinner. Si utilizza il metodo getSelectedItem () per leggere i dati da questo controllo di modulo.

feedback Spinner finaleSpinner = (Spinner) findViewById (R.id.SpinnerFeedbackType); String feedbackType = feedbackSpinner.getSelectedItem (). ToString (); 

In questo caso, l'elemento selezionato nel controllo Spinner è la stringa scelta dall'utente dell'elemento selezionato.

Passaggio 13: lettura dell'ingresso dai controlli CheckBox

Infine, il tuo modulo includeva un controllo CheckBox. In questo caso, il risultato è solo una bandiera per comunicare all'applicazione se la casella è stata selezionata o meno.

checkBox finaleCheckCheckbox = (CheckBox) findViewById (R.id.CheckBoxResponse); boolean bRequiresResponse = responseCheckbox.isChecked (); 

Puoi usare questo valore booleano comunque nella tua app.

Passaggio 14: generare i dettagli di posta elettronica appropriati

Ora che hai tutti i dati del tuo modulo, sei pronto per creare un messaggio. Elabora semplicemente tutti i campi dati e crea un messaggio di feedback appropriato. Ad esempio, è possibile utilizzare alcuni campi nell'oggetto del messaggio e altri nel corpo del messaggio. È possibile utilizzare le stringhe di formato per aiutare a costruire le stringhe appropriate, le cui specifiche saranno discusse in un suggerimento rapido in arrivo.

Conclusione

In questo tutorial, hai imparato come utilizzare vari tipi di controlli di input per progettare un modulo di feedback all'interno di un'applicazione Android. Il controllo EditText è versatile e potente, consentendo diversi tipi di testo e input di forma libera. I controlli Spinner e Checkbox aiutano a limitare l'input dell'utente a un insieme specifico di risposte. Il controllo Button è un modo semplice per generare un evento per elaborare l'input del modulo.

Esistono molti altri controlli che vale la pena esplorare per l'uso all'interno dei moduli. Ci sono molte più informazioni sulla buona progettazione dei moduli, sul modo in cui i controlli di forma si inseriscono nel ciclo di vita dell'Attività e su come i metodi di input e il fattore in questione, ma per ora concentrarsi su come ottenere una buona base sulle basi dei controlli dei moduli e su come usarli.

Ci auguriamo che questo tutorial ti sia piaciuto e attendo il tuo feedback!

Riguardo agli Autori

Gli sviluppatori mobili Lauren Darcey e Shane Conder hanno coautore diversi libri sullo sviluppo di Android: un libro di programmazione approfondito intitolato Sviluppo di applicazioni wireless Android e Sams TeachYourself Sviluppo di applicazioni Android in 24 ore. Quando non scrivono, passano il loro tempo a sviluppare software mobile presso la loro azienda ea fornire servizi di consulenza. Possono essere contattati via email a [email protected], tramite il loro blog su androidbook.blogspot.com e su Twitter @androidwireless.