Arbatpinigių skaičiuoklės kūrimas Kotlin mieste: kaip tai veikia?

Arbatpinigių skaičiuoklės kūrimas Kotlin mieste: kaip tai veikia?

Mes parodome, kaip sukurti paprastą patarimo skaičiavimo programą „Kotlin“. Jei tiksliau, Kotlin 1.3.21, Android 4, Android Studio 3. Straipsnis bus įdomus pirmiausia tiems, kurie pradeda savo kelionę kurdami Android programas. Tai leidžia suprasti, kas ir kaip veikia programoje.

Tokia skaičiuoklė praverčia, kai reikia paskaičiuoti arbatpinigių kiekį iš įmonės, nusprendusios leisti laiką restorane ar kavinėje. Žinoma, ne visi ir ne visada arbatos palieka padavėjams, tai daugiau vakarietiška tradicija, tačiau tokios aplikacijos kūrimo procesas bet kokiu atveju įdomus.

Primename: visiems „Habr“ skaitytojams – 10 000 rublių nuolaida užsiregistravus į bet kurį „Skillbox“ kursą naudojant „Habr“ reklamos kodą.

„Skillbox“ rekomenduoja: Praktinis kursas „Mobile Developer PRO.

Štai kaip programa atrodo, kai ji veikia:

Arbatpinigių skaičiuoklės kūrimas Kotlin mieste: kaip tai veikia?

Įvedate norimą procentą nuo visos sumos, susirinkimo dalyvių skaičių ir gaunate rezultatą – arbatpinigių kiekį, kurį reikėtų palikti.

Pradžia

Visa programos sąsaja atrodo taip:
Arbatpinigių skaičiuoklės kūrimas Kotlin mieste: kaip tai veikia?

Arbatpinigių skaičiuoklės kūrimas Kotlin mieste: kaip tai veikia?

Pirmas veiksmas - Parsisiųsti projekto bazę. Atidarykite jį naudodami 3.0 ar naujesnės versijos „Android Studio“. Mes kuriame ir vykdome projektą ir matome baltą ekraną. Viskas gerai, kaip ir turi būti.

Arbatpinigių skaičiuoklės kūrimas Kotlin mieste: kaip tai veikia?

Arbatpinigių skaičiuoklės kūrimas Kotlin mieste: kaip tai veikia?

Vartotojo veiksmai projekte rašomi chronologine tvarka, kad viskas būtų aišku. Norėdami jį peržiūrėti, atidarykite View -> Tool Windows -> TODO.

Studijuojame projektą ir atidarome color.xml, kad įvertintume spalvų paletę. strings.xml yra tekstiniai duomenys (antraštės), o styles.xml yra keli šriftų šablonai.

Išlaidų skyriaus kūrimas

Atidarykite activity_main.xml ir pridėkite toliau pateiktą kodą į linijinį išdėstymą (#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"/>

Dabar galite formuoti vertybių katalogą arba žaisti su spalvomis medžiaga.io įrankis.

Dabar projektas atrodo taip:

Arbatpinigių skaičiuoklės kūrimas Kotlin mieste: kaip tai veikia?
Kaip matote, sąnaudos apskaičiuojamos pagal vartotojo įvestus duomenis.

Sąskaitos skyriaus kūrimas

Pridėkite toliau pateiktą kodą į linijinį išdėstymą po išlaidų skyriaus (#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>

Uždarykite LinearLayout po TODO sąrašo, tada pridėkite naują kodą, įdėdami jį į LinearLayout (#3):

<TextView
      android_layout_margin="15dp"
      android_layout_width="match_parent"
      android_layout_height="wrap_content"
      android_textColor="@color/colorWhite"
      style="@style/h4"
      android_text="@string/billStaticText"/>
 
<EditText
      android_id="@+id/billEditText"
      android_layout_width="match_parent"
      android_layout_height="wrap_content"
      android_textColor="@color/colorWhite"
      android_inputType="numberDecimal"
      android_maxLines="1"
      style="@style/h2Bold"
      android_text="0"/>

Kadangi pagrindinė programos užduotis yra apskaičiuoti individualias išlaidas kiekvienam susirinkimų restorane dalyviui, pagrindinį vaidmenį atlieka „costPersonTextView“.

„EditText“ riboja įvestį iki vienos eilutės, šis parametras turi būti nustatytas į „NumberDecimal inputType“.

Arbatpinigių skaičiuoklės kūrimas Kotlin mieste: kaip tai veikia?
Pradedame bandymo projektą ir įvedame bendros žalos parametrus (sulaužyti puodeliai, lėkštės ir kt.)

Skyriaus „Žmonės ir patarimai“ kūrimas

Norėdami pridėti arbatpinigių sumos parinkiklį, įklijuokite toliau esantį kodą į naują linijinio išdėstymo skiltį (#4):

<TextView
      android_layout_margin="15dp"
      android_layout_width="match_parent"
      android_layout_height="wrap_content"
      android_textColor="@color/colorWhite"
      style="@style/h4"
      android_text="@string/tipStaticText"/>
 
<LinearLayout
      android_layout_width="match_parent"
      android_layout_height="wrap_content"
      android_orientation="horizontal">
 
<ImageButton
        android_id="@+id/subtractTipButton"
        style="@style/operationButton"
        android_layout_marginLeft="20dp"
        android_layout_marginStart="20dp"
        android_src="@drawable/subtract"/>
 
<TextView
        android_id="@+id/tipTextView"
        android_layout_margin="15dp"
        android_layout_width="0dp"
        android_layout_height="wrap_content"
        android_textColor="@color/colorWhite"
        android_layout_weight="1"
        style="@style/h2Bold"
        android_text="20%"/>
 
<ImageButton
        android_id="@+id/addTipButton"
        style="@style/operationButton"
        android_layout_marginEnd="20dp"
        android_layout_marginRight="20dp"
        android_src="@drawable/add"/>
 
</LinearLayout>

Ši kodo dalis reikalinga norint tiksliai apskaičiuoti arbatpinigių sumą. Numatytoji teksto reikšmė yra 20. ImageButtons yra su piktogramomis aplanke su rašymo leidimais.

Nukopijuokite visą skyrių ir pridėkite šiuos dalykus (#5):

  • ImageButton ID (subtractPeopleButton, addPeopleButton)
  • TextView ID (numberOfPeopleStaticText, numberOfPeopleTextView)
  • Numatytasis tekstas, skirtas numberOfPeopleTextView (turėtų būti 4).

Arbatpinigių skaičiuoklės kūrimas Kotlin mieste: kaip tai veikia?

Dabar paleidus aplikaciją galima pridėti sąskaitos sumą, veikia ir mygtukai Add/Atimti, bet dar nieko nevyksta.

Pridėti rodinių

Atidarykite MainActivity.kt ir pridėkite tai prie funkcijos 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
 
}

Mygtukų apdaila

Norėdami pridėti mygtukų paspaudimų palaikymą, klasės lygiu įdiekite „View.OnClickListener“ (7):

class Pagrindinė veikla: AppCompatActivity(), View.OnClickListener {

Projekto sudarymas dabar neveiks, turite atlikti dar kelis veiksmus (# 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()
        }
    }

Kalbant apie mygtukus ir jungiklius, Kotlin viskas sutvarkyta labai šauniai! Pridėkite toliau pateiktą kodą prie visų didinimo ir mažinimo funkcijų
(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()
        }
    }

Čia kodas apsaugo didinimo funkcijas maksimaliomis reikšmėmis (MAX_TIP ir MAX_PEOPLE). Be to, kodas apsaugo sumažinimo funkcijas su minimaliomis reikšmėmis (MIN_TIP ir MIN_PEOPLE).

Dabar mygtukus sujungiame su klausytojais funkcijoje initViews (#13):

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

Arbatpinigių skaičiuoklės kūrimas Kotlin mieste: kaip tai veikia?

Dabar galite pridėti bendrą žalą, patarimus ir susitikimo dalyvių skaičių. Na, dabar svarbiausia...

Išlaidų skyrius

Šis kodas apskaičiuoja išlaidas (#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)
 
}

Na, čia vadinama funkcija, kuri leidžia atsižvelgti į žmonių skaičių įmonėje ir apskaičiuoti arbatpinigių (#15):

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

Paleidžiame programą. Puikiai atrodo ir veikia. Bet gali būti geriau.

Jei bandysite pašalinti sąskaitos sumą ir tada padidinti užuominų ar draugų skaičių, programa sugenda, nes dar nėra patikrinimo, ar nėra nulinių mokesčių. Be to, jei bandysite pakeisti sąskaitos faktūros sumą, mokesčiai nebus atnaujinti.

Paskutiniai žingsniai

Pridėti TextWatcher (#16):

class Pagrindinė veikla: AppCompatActivity(), View.OnClickListener, TextWatcher {

Tada įterpiame billEditText klausytoją (#17):

billEditText.addTextChangedListener(this)

Be to, pridėkite kodą, kad paleistumėte „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) {}

Arbatpinigių skaičiuoklės kūrimas Kotlin mieste: kaip tai veikia?

Na, dabar viskas veikia! Sveikiname, jūs parašėte savo „arbatpinigių skaičiuoklę“ Kotlin.

Arbatpinigių skaičiuoklės kūrimas Kotlin mieste: kaip tai veikia?

„Skillbox“ rekomenduoja:

Šaltinis: www.habr.com

Добавить комментарий