🥇Creazione di un calcolatore di mance in Kotlin: come funziona?

Scopri come creare un'app semplice per calcolare le mance in Kotlin. Più precisamente, utilizzando Kotlin 1.3.21, Android 4 e Android Studio 3. Questo articolo sarà interessante soprattutto per chi inizia il proprio percorso nello sviluppo di applicazioni Android. Permette di capire come funziona il tutto all'interno dell'app.

Un tale calcolatore è utile quando è necessario calcolare la somma delle mance in un'uscita di gruppo in un ristorante o caffè. Certo, non tutti lasciano sempre mance ai camerieri, è più una tradizione occidentale, ma il processo di sviluppo di un'app del genere è comunque interessante.

Ricordiamo: per tutti i lettori di «Habr» — sconto di 10.000 rubli per l'iscrizione a qualsiasi corso Skillbox con il codice promozionale «Habr».

Skillbox consiglia: Corso pratico Sviluppatore mobile PRO.

Ecco come appare l'app in azione:

Inserisci la percentuale desiderata sull'importo totale, il numero di partecipanti all'incontro e ricevi il risultato: l'importo della mancia da lasciare.

Iniziamo

L'interfaccia completa dell'app appare come segue:

La prima azione è il caricamento della base del progetto. Apriamolo in Android Studio 3.0 o versioni successive. Costruiamo e avviamo il progetto e vediamo una schermata bianca. Tutto normale, è esattamente come dovrebbe essere.Le azioni dell'utente sono indicate nel progetto in ordine cronologico, per renderle chiare. Per visualizzarle, apriamo Visualizza -> Finestra strumenti -> TODO.

Esaminiamo il progetto e apriamo colors.xml per valutare la palette di colori. In strings.xml sono presenti i dati testuali (etichette), mentre in styles.xml ci sono alcuni template di font.

Sviluppo della sezione costi

Apriamo activity_main.xml e aggiungiamo il codice sottostante a LinearLayout (#1):

Ora possiamo personalizzare lo stile della directory values o divertirci con i colori utilizzando

lo strumento material.io Ora il progetto appare così:.

Come puoi vedere, il calcolo dei costi è basato sui dati inseriti dall'utente.

Sviluppo della sezione fatture

Aggiungiamo il codice sottostante a LinearLayout dopo la Sezione Costi (#2):

& <! — TODO #3: Costruisci la Sezione Fattura → …

Chiudiamo LinearLayout dopo l'elenco dei TODO e poi aggiungiamo un nuovo codice all'interno di LinearLayout (#3):

Poiché l'obiettivo principale dell'app è calcolare i costi individuali per ciascun partecipante all'uscita in ristorante, il valore principale è costPerPersonTextView.

EditText limita l'immissione di dati a una riga, e questo parametro deve avere il tipo di input NumberDecimal.

Avviamo il progetto per un test e inseriamo i parametri dell'importo totale (piatti e bicchieri rotti, ecc.)

Sviluppo della sezione "Persone e mance"

Per aggiungere una selezione dell'importo delle mance, inseriamo il codice sottostante in una nuova sezione LinearLayout (#4):

Questo pezzo di codice è necessario per il calcolo preciso dell'importo delle mance. Il valore di testo predefinito è 20. I pulsanti ImageButton sono forniti di icone nella cartella con i diritti di scrittura.

Copia completamente la sezione e aggiungi il seguente (#5):

IDs di ImageButton (subtractPeopleButton, addPeopleButton)

IDs di TextView (numberOfPeopleStaticText, numberOfPeopleTextView)
DefaultText per numberOfPeopleTextView (dovrebbe essere 4).
Ora, all'avvio dell'app, è possibile aggiungere l'importo della fattura e le funzioni dei pulsanti "Aggiungi/Va via" funzionano, ma per ora non succede nulla.

Aggiungi Views

Apriamo MainActivity.kt e aggiungiamo questo nella funzione initViews (#6):

funzione privata initViews() {
        expensePerPersonTextView = findViewById(R.id.expensePerPersonTextView)
        billEditText = findViewById(R.id.billEditText)
 
addTipButton = findViewById(R.id.addTipButton)
        tipTextView = findViewById(R.id.tipTextView)
        subtractTipButton = findViewById(R.id.subtractTipButton)
 
addPeopleButton = findViewById(R.id.addPeopleButton)
        numberOfPeopleTextView = findViewById(R.id.numberOfPeopleTextView)
        subtractPeopleButton = findViewById(R.id.subtractPeopleButton)
 
//TODO #8: Collega i pulsanti al listener
 
//TODO #16: Collega EditText a TextWatcher
}

Completiamo i pulsanti

Per aggiungere il supporto al clic dei pulsanti, implementiamo View.OnClickListener a livello di classe (#7):

classe MainActivity: AppCompatActivity(), View.OnClickListener {

Non sarà possibile compilare il progetto subito, dobbiamo eseguire ancora alcune azioni (#8):

override fun onClick(v: View?) {
        when (v?.id) {
            R.id.addTipButton -> incrementTip()
            R.id.subtractTipButton -> decrementTip()
            R.id.addPeopleButton -> incrementPeople()
            R.id.subtractPeopleButton -> decrementPeople()
        }
    }

In termini di pulsanti e switch, Kotlin è organizzato molto bene! Aggiungiamo il codice qui sotto in tutte le funzioni increment e decremento
(#9–#12):

funzione privata incrementTip() {
        if (tipPercent != MAX_TIP) {
            tipPercent += TIP_INCREMENT_PERCENT
            tipTextView.text = String.format("%d%%", tipPercent)
        }
    }
 
funzione privata decrementTip() {
        if (tipPercent != MIN_TIP) {
            tipPercent -= TIP_INCREMENT_PERCENT
            tipTextView.text = String.format("%d%%", tipPercent)
        }
    }
 
funzione privata incrementPeople() {
        if (numberOfPeople != MAX_PEOPLE) {
            numberOfPeople += PEOPLE_INCREMENT_VALUE
            numberOfPeopleTextView.text = numberOfPeople.toString()
        }
    }
 
funzione privata decrementPeople() {
        if (numberOfPeople != MIN_PEOPLE) {
            numberOfPeople -= PEOPLE_INCREMENT_VALUE
            numberOfPeopleTextView.text = numberOfPeople.toString()
        }
    }

Qui il codice protegge le funzioni di incremento con valori massimi (MAX_TIP & MAX_PEOPLE). Inoltre, il codice protegge le funzioni di decremento con valori minimi (MIN_TIP & MIN_PEOPLE).

Ora colleghiamo i pulsanti ai listener nella funzione initViews (#13):

funzione privata initViews() {
 
...
 
addTipButton.setOnClickListener(this)
        subtractTipButton.setOnClickListener(this)
 
addPeopleButton.setOnClickListener(this)
        subtractPeopleButton.setOnClickListener(this)
 
//TODO #15: Collega EditText a TextWatcher
}

Ora possiamo aggiungere il totale delle spese, le mance e il numero di partecipanti all'incontro. E ora la cosa più importante…

Sezione di calcolo delle spese

Questo codice calcola le spese (#14):

funzione privata calculateExpense() {
 
val totalBill = billEditText.text.toString().toDouble()
 
val totalExpense = ((HUNDRED_PERCENT + tipPercent) / HUNDRED_PERCENT) * totalBill
        val individualExpense = totalExpense / numberOfPeople
 
expensePerPersonTextView.text = String.format("$%.2f", individualExpense)
 
}

E qui viene chiamata la funzione che considera il numero di persone nel gruppo e calcola la mancia (#15):

funzione privata incrementTip() {
 
…
 
}
 
funzione privata decrementTip() {
 
…
 
}
 
funzione privata incrementPeople() {
 
…
 
}
 
funzione privata decrementPeople() {
 
…
 
}

Avviamo l'applicazione. Appare e funziona bene. Ma può sempre migliorare.

Se provi a rimuovere l'importo della bolletta e poi aumentare il numero di mance o amici, l'app si bloccherà poiché non ci sono controlli per un valore di costo nullo. Inoltre, se provi a modificare l'importo della bolletta, le spese non verranno aggiornate.

Passaggi finali

Aggiungiamo il TextWatcher (#16):

classe MainActivity: AppCompatActivity(), View.OnClickListener, TextWatcher {

Poi integriamo il listener billEditText (#17):

billEditText.addTextChangedListener(this)

In aggiunta, aggiungiamo il codice per eseguire il TextWatcher (#18):

override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {
        if (!billEditText.text.isEmpty()) {
            calculateExpense()
        }
    }
override fun afterTextChanged(s: Editable?) {}

    override fun beforeTextChanged(s: CharSequence?, start: Int, count: Int, after: Int) {}

Ora funziona tutto alla perfezione! Congratulazioni, hai creato il tuo "Calcolatore di mance" in Kotlin.

Skillbox consiglia:

Corso pratico di due anni «Sviluppatore Web PRO».

Corso online «Sviluppatore C#».

Corso pratico annuale «Sviluppatore PHP da 0 a PRO».

Fonte: habr.com