Att skapa en dricks-kalkylator i Kotlin: hur fungerar det?

Vi visar hur man skapar en enkel applikation för att räkna dricks på Kotlin-språket. Mer specifikt, Kotlin 1.3.21, Android 4, Android Studio 3. Artikeln kommer att vara intressant, framför allt för dem som börjar sin väg inom utvecklingen av Android-applikationer. Den gör det möjligt att förstå vad som fungerar och hur det fungerar inuti applikationen.

En sådan kalkylator är användbar när man behöver räkna ut dricksbeloppet för ett sällskap som har bestämt sig för att tillbringa tid på en restaurang eller ett café. Självklart lämnar inte alla och inte alltid dricks till servitörer, det är mer en västerländsk tradition, men utvecklingsprocessen av en sådan applikation är intressant i alla fall.

Påminnelse: för alla läsare av "Habr" — 10 000 rubel rabatt vid registrering för vilken kurs som helst på Skillbox med rabattkoden "Habr".

Skillbox rekommenderar: Praktisk kurs Mobilutvecklare PRO.

Så här ser applikationen ut under drift:

Du anger önskad procentandel av den totala summan, antal deltagare i mötet och får resultatet — dricksbeloppet som bör lämnas.

Vi börjar

Det fullständiga gränssnittet för applikationen ser ut som följer:




Det första steget — ladda projektets grundstruktur. Öppna den i Android Studio 3.0 eller senare. Bygg och kör projektet, och se en vit skärm. Allt är normalt, så ska det vara.

Användarens åtgärder är angivna i projektet i kronologisk ordning, så att allt ska vara klart. För att se det öppnar vi View -> Tool Windows -> TODO.

Vi studerar projektet och öppnar colors.xml för att bedöma färgpaletten. I strings.xml finns textdata (etiketter), och i styles.xml finns det flera typsnittsmallar.

Utveckling av kostnadsavsnittet

Öppna activity_main.xml och lägg till koden nedan i LinearLayout (#1):

Nu kan du justera stil i directory-namnvalues eller leka med färger, med hjälp av material.io-verktyget.

Nu ser projektet ut så här:

Som du ser beräknas kostnaderna utifrån de uppgifter som användaren anger.

Utveckling av räkenskapsavsnittet

Lägg till koden nedan i LinearLayout efter Expense Section (#2):

<! — TODO #3: Bygg räknesektionen →
 
…

Vi stänger LinearLayout efter TODO-listan och lägger sedan till ny kod genom att placera den inuti LinearLayout (#3):

Eftersom appens huvudsyfte är att beräkna individuella kostnader för varje deltagare vid restaurangbesök, är costPerPersonTextView av stor betydelse.

EditText begränsar inmatning till en rad, detta parameter ska ha värdet NumberDecimal inputType.

Vi kör projektet för att testa och anger parametrarna för den totala skadan (ömtåliga föremål som krossade muggar och tallrikar etc.).

Utveckling av avsnittet 'Människor och dricks'

För att lägga till val av dricksbelopp, infoga följande kod i den nya sektionen LinearLayout (#4):

Denna kodavsnitt är nödvändig för att exakt beräkna beloppet för dricks. Standardvärdet för texten är 20. ImageButtons är försedda med ikoner i mappen med skrivbehörighet.

Vi kopierar hela avsnittet och lägger till följande (#5):

• ImageButton ids (subtractPeopleButton, addPeopleButton)
• TextView ids (numberOfPeopleStaticText, numberOfPeopleTextView)
• DefaultText för numberOfPeopleTextView (ska vara 4).

Nu, vid start av appen, finns det möjlighet att lägga till summan av notan, knapparna 'Lägg till/Drag bort' fungerar också, men just nu händer inget.

Vi lägger till Views

Vi öppnar MainActivity.kt och lägger till detta i funktionen initViews (#6):

private fun 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: Bind Buttons to Listener
 
//TODO #16: Bind EditText to TextWatcher
 
}

Färdigställ knapparna

För att lägga till klickstöd för knapparna implementerar vi View.OnClickListener på klassnivå (#7):

class MainActivity: AppCompatActivity(), View.OnClickListener {

Det går inte att kompilera projektet just nu, vi behöver utföra några fler åtgärder (#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()
        }
    }

Knappar och switchar i Kotlin är verkligen väl organiserade! Lägg till koden nedan i alla increment- och decrement-funktioner
(#9 –#12):

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

Denna kod skyddar increment-funktionerna med maximala värden (MAX_TIP & MAX_PEOPLE). Dessutom skyddar koden decrement-funktionerna med minimala värden (MIN_TIP & MIN_PEOPLE).

Nu länkar vi knapparna till lyssnare i funktionen initViews (#13):

private fun initViews() {
 
...
 
addTipButton.setOnClickListener(this)
        subtractTipButton.setOnClickListener(this)
 
addPeopleButton.setOnClickListener(this)
        subtractPeopleButton.setOnClickListener(this)
 
//TODO #15: Bind EditText to TextWatcher
}

Nu kan vi räkna ut den totala kostnaden, dricks och antal deltagare. Och det viktigaste…

Avsnitt för kostnadsberäkning

Denna kod räknar ut kostnaden (#14):

private fun 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)
 
}

Och här anropas funktionen som möjliggör att ta hänsyn till antalet personer i sällskapet och räkna ut dricksen (#15):

private fun incrementTip() {
 
…
 
}
 
private fun decrementTip() {
 
…
 
}
 
private fun incrementPeople() {
 
…
 
}
 
private fun decrementPeople() {
 
…
 
}

Vi startar appen. Den ser bra ut och fungerar utmärkt. Men det kan bli ännu bättre.

Om du försöker ta bort summan av notan och sedan öka antalet tips eller vänner kommer appen att krascha eftersom det inte finns någon kontroll för nollvärdet. Dessutom, om du försöker ändra summan av notan kommer kostnaderna inte att uppdateras.

Sista stegen

Lägg till TextWatcher (#16):

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

Sedan integrerar vi lyssnaren billEditText (#17):

billEditText.addTextChangedListener(this)

Plus vi lägger till koden för att köra 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) {}

Och nu fungerar allt perfekt! Grattis, du har skrivit din egen "Dricksbok" i Kotlin.

Skillbox rekommenderar:

• Tvåårig praktisk kurs «Jag är PRO Webbutvecklare».
• Onlinekurs «C#-utvecklare».
• Praktisk årskurs PHP-utvecklare från grunden till PRO.

Källa: habr.com