Kuidas luua näpunäidete kalkulaator Kotlinis: kuidas see töötab?

Räägime, kuidas luua lihtne rakendus, et arvutada jootraha Kotlin keeles. Täpsemalt öeldes, Kotlin 1.3.21, Android 4, Android Studio 3. See artikkel on eelkõige huvitav neile, kes alustavad oma teed Android-rakenduste arendamisel. See aitab mõista, mis ja kuidas rakenduses töötab.

See kalkulaator tuleb kasuks, kui tuleb arvutada jootraha summa ettevõtte jaoks, kes otsustas veeta aega restoranis või kohvikus. Loomulikult ei jäta kõik ja alati teenindajatele jootraha, see on pigem lääne traditsioon, kuid sellise rakenduse arendamise protsess on igal juhul huvitav.

Tuletame meelde: kõigile «Habra» lugejatele — 10 000 rubla soodustus, kui registreerite end Skillboxi mis tahes kursusele promokoodi «Habr» abil.

Skillbox soovitab: Praktiline kursus Mobiiliarendaja PRO.

Nii näeb rakendus välja töö käigus:

Sisestate soovitud protsendi kogusummast, kohtumise osalejate arvu ja saate tulemuse — jootrahade summa, mille jätmine on soovitatav.

Alustame

Rakenduse täielik liides näeb välja järgmine:




Esimene samm — projekti aluse laadimine. Avame selle Android Studio 3.0 või uuema versiooniga. Ehitasime ja käivitasime projekti ning näeme valget ekraani. Kõik on korras, just nii peab olema.

Действия пользователя прописаны в проекте в хронологическом порядке, чтобы все было понятно. Для его просмотра открываем View -> Tool Windows -> TODO.

Изучаем проект и открываем colors.xml для оценки цветовой палитры. В strings.xml размещены текстовые данные (подписи), а в styles.xml есть несколько шрифтовых шаблонов.

Разработка раздела затрат

Открываем activity_main.xml и добавляем расположенный ниже код в LinearLayout (#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"/>

Теперь можно настроить стиль директории values или поиграть с цветами, используя инструмент material.io.

Сейчас проект выглядит так:

Как видите, расчет затрат производится по данным, которые вносит пользователь.

Разработка раздела счетов

Добавляем код, размещенный ниже, в LinearLayout после Expense Section (#2):

<! — TODO #3: Build Bill Section →
 
…

Sulgege LinearLayout pärast TODOde loendit ja lisage uus kood, paigutades selle LinearLayout'i sisse (#3):

Kuna rakenduse peamine ülesanne on arvutada iga restorani külastaja individuaalsed kulud, on costPerPersonTextView'i roll väga oluline.

EditText piirab andmete sisestamist ühe reale, seda parameetrit peab olema NumberDecimal inputType.

Käivitage projekt testimiseks ja sisestage üldise kahju parameetrid (katkised tassid, taldrikud jne).

Inimeste ja jootraha sektsiooni väljatöötamine

Et lisada jootraha valimist, sisestage allolev kood uude LinearLayout'i sektsiooni (#4):

See koodijupp on vajalik tipprekete täpseks arvutamiseks. Vaikimisi tekst on 20. ImageButton’id sisaldavad ikoone kirja õiguste kaustas.

Kopeerime jagu täielikult ja lisame järgmist (#5):

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

Nüüd, kui rakendus käivitub, on võimalik lisada arve summa, samuti töötavad nupud "Lisa/Võta välja", kuid praegu ei toimu midagi.

Lisame Views

Avame MainActivity.kt ja lisame see funktsiooni 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: Siduda nuppe kuulajaga
 
//TODO #16: Siduda EditText TextWatcheriga
 
}

Viimistleme nuppe

Nuppude klikkimise toe lisamiseks rakendame View.OnClickListener klassi tasemel (#7):

class MainActivity: AppCompatActivity(), View.OnClickListener {

Praegu ei õnnestu projekti kompileerida, vajalik on teha veel mõned toimingud (#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()
        }
    }

Kotlinis on nuppude ja lülitite haldamine väga hea! Lisame alljärgneva koodi kõikidesse increment ja decrement funktsioonidesse
(#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()
        }
    }

Siin on kood, mis kaitseb suurenemise funktsioone maksimaalse väärtusega (MAX_TIP ja MAX_PEOPLE). Lisaks kaitseb kood langetamise funktsioone minimaalsete väärtustega (MIN_TIP ja MIN_PEOPLE).

Se now we link buttons to listeners in the initViews function (#13):

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

Nüüd on võimalik lisada kogukahju, jootraha ja osalejate arvu. Ja nüüd kõige tähtsam…

Kulude arvestamise osa

See kood arvutab kulud (#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)
 
}

Siin kutsutakse välja funktsioon, mis võimaldab arvestada inimeste arvu firmas ja arvutada kõhtu (#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 olla veelgi parem.

Kui proovite kustutada arve summa ja seejärel suurendada näpunäidete või sõprade arvu, kukub rakendus kokku, kuna kulude nulli väärtuse kontrolli pole veel olemas. Veelgi enam, kui proovite muuta arve summat, ei uuene kulud.

Lõppfaasid

Lisame TextWatcher'i (#16):

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

Seejärel sisestame billEditText jaoks kuulaja (#17):

billEditText.addTextChangedListener(this)

Lisame ka koodi TextWatcher'i täitmiseks (#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 ideaalselt! Palju õnne, olete kirjutanud oma «Joogiraha kalkulaatori» Kotlinis.

Skillbox soovitab:

• Kaheaastane praktiline kursus „Mina olen PRO veebiarendaja”.
• Veebikursus C#-arendaja.
• Praktiline aastakursus „PHP arendaja algusest PRO-ni“.

Allikas: habr.com