Tips kalkulaatori loomine Kotlinis: kuidas see töötab?

Räägime, kuidas luua lihtne rakendus, et arvutada jootraha Kotlinis. Täpsemalt Kotlin 1.3.21, Android 4, Android Studio 3. Artikkel on huvitav eelkõige neile, kes alustavad oma teekonda Android-rakenduste arenduses. See aitab mõista, kuidas ja mis rakenduses toimib.

Selline kalkulaator on kasulik, kui on vaja arvutada jootraha summa nhóm, kes otsustas aega veeta restoranis või kohvikus. Muidugi ei jäta kõik ja alati teenindajatele jootraha, see on rohkem lääne traditsioon, kuid sellise rakenduse arendamise protsess on igal juhul huvitav.

Tuletame meelde: kõigile «Habr» lugejatele – 10 000 rubla allahindlus igale Skillboxi kursusele, kasutades sooduskoodi «Habr».

Skillbox soovitab: Praktiline kursus Mobiiliarendaja PRO.

Nii näeb rakendus välja tööprotsessis:

Sisestate soovitud protsendi kogusummast, kohtumiste arvu ja saate tulemuse - jootraha summa, mille peaksite jätma.

Alustame

Rakenduse täisliides näeb välja järgmine:




Esimene tegevus - projekti aluse laadimine. Avame selle Android Studio 3.0 või uuema versiooniga. Ehitage ja käivitage projekt ning näete valget ekraani. Kõik on korras, see on nii, nagu peab.

Kasutaja toimingud on projekti sarnases järjestuses, et kõik oleks arusaadav. Selle vaatamiseks avame View -> Tool Windows -> TODO.

Uurime projekti ja avame colors.xml, et hinnata värvipaletti. Tekstid on salvestatud strings.xml ja styles.xmls on mitu fondimalli.

Kulude jaotuse arendamine

Avame activity_main.xml ja lisame allpool oleva koodi LinearLayout'i (#1):

<TextView
    android_id="@+id/expensePerPersonTextView"
    android_layout_width="match_parent"
    android_layout_height="wrap_content"
    android_paddingTop="30dp"
    style="@style/h1Bold"
    android_textColor="@color/colorAccent"
    android_text="0"/>
 
<TextView
    android_layout_width="match_parent"
    android_layout_height="wrap_content"
    android_paddingBottom="25dp"
    style="@style/h2"
    android_textColor="@color/colorAccent"
    android_text="@string/perPersonStaticText"/>

Nüüd saab seadistada stiili kausta values või mängida värvidega, kasutades materjalide tööriista.

Praegu näeb projekt välja nii:

Nagu näete, tehakse kulude arvutust vastavalt kasutaja sisestatud andmetele.

Arve jaotuse arendamine

Lisame allpool oleva koodi LinearLayout'i pärast Expense Section'i (#2):

<LinearLayout
    android_layout_width="match_parent"
    android_layout_height="match_parent"
    android_orientation="vertical"
    android_background="@color/colorAccent">
 
<! — TODO #3: Build Bill Section →
 
… 
<\/LinearLayout>

Sulgeb LinearLayout pärast TODOde loetelu ja lisame seejärel uue koodi, paigutades selle LinearLayout'i sisse (#3):

Kuna rakenduse peamine eesmärk on igaühe kulude individuaalne arvutamine restoranis, mängib costPerPersonTextView suurimat rolli.

EditText piirab andmete sisestamist ühe reaga, sellel parameetril peab olema NumberDecimal inputType väärtus.

Käivitame projekti testimiseks ja sisestame kogukahjude parameetrid (katkised tassid, taldrikud jne).

Jaotise „Inimesed jaTips“ arendamine

Kuna tahame lisada valiku jootrahade koguse kohta, sisestame allpool oleva koodi uude LinearLayout'i sektsiooni (#4):

See koodijupp on vajalik jootrahade summa täpseks arvutamiseks. Vaikimisi teksti väärtus on 20. ImageButton'id on varustatud ikoonidega kirjeldusõigustes.

Kopeerime jaotise täielikult ja lisame järgmise (#5):

• ImageButton'i ids (subtractPeopleButton, addPeopleButton)
• TextView ids (numberOfPeopleStaticText, numberOfPeopleTextView)
• DefaultText numberOfPeopleTextView jaoks (peab olema 4).

Nüüd rakenduse käivitamisel on võimalus lisada arve summa, samuti töötavad nupud 'Lisa/Võta ära', kuid praegu ei toimu midagi.

Lisame Views

Avame MainActivity.kt ja lisame järgmise initViews funktsiooni (#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
 
}

Viimeistelemme painikkeet

Lisätään painikkeiden klikkaustuki käyttämällä View.OnClickListener-luokkaa (#7):

class MainActivity: AppCompatActivity(), View.OnClickListener {

Projektia ei voi kääntää nyt, on suoritettava vielä muutama toimenpide (#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()
        }
    }

Kotlinissa painikkeiden ja kytkimien hallinta on todella hienoa! Lisää alla oleva koodi kaikkiin increment- ja decrement-funktioihin
(#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()
        }
    }

Tässä koodi suojaa increment-toiminnot maksimiarvoilta (MAX_TIP & MAX_PEOPLE). Lisäksi, koodi suojaa decrement-toiminnot minimimääriltä (MIN_TIP & MIN_PEOPLE).

Nyt yhdistämme painikkeet kuuntelijoihin initViews-funktiossa (#13):

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

Nyt voimme laskea yhteiset kulut, tipit ja osallistujamäärät. Ja nyt kaikkein tärkein…

Kulujen laskenta jaottelu

Tämä koodi laskee kulut (#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)
 
}

Ja tässä kutsutaan funktiota, joka ottaa huomioon ryhmän koon ja laskee tipit (#15):

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

Käivitame rakenduse. See näeb välja ja töötab suurepäraselt. Kuid võiks veel parem olla.

Kui proovite kustutada arve summat ja seejärel suurendada vihjete või sõprade arvu, siis rakendus kukub, kuna kulude nullväärtuse kontrollimist pole veel tehtud. Veelgi enam, kui proovite muuta arve summat, kulud ei uuene.

Lõppastmed

Lisame TextWatcher (#16):

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

Seejärel lisame kuulaja billEditText (#17):

billEditText.addTextChangedListener(this)

Pluss lisame koodi TextWatcher'i teostamiseks (#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) {}

Nüüd töötab kõik täiesti hästi! Palju õnne, olete kirjutanud oma «Jootraha kalkulaatori» Kotlin'is.

Skillbox soovitab:

• Kaks aastat praktilist kursust «Ma olen PRO veebiarendaja».
• Veebikursus «C# arendaja».
• Praktiline aastakursus «PHP-arendaja 0-st PRO-ni».

Allikas: habr.com