🥇Котлинде кеңеш калькуляторун түзүү: ал кантип иштейт?

Биз сизге Котлинде жөнөкөй кеңешти эсептөө тиркемесин кантип түзүүнү көрсөтөбүз. Тагыраак айтканда, Kotlin 1.3.21, Android 4, Android Studio 3. Макала, биринчи кезекте, Android тиркемелерин иштеп чыгууда өз сапарын баштагандар үчүн кызыктуу болот. Бул колдонмонун ичинде эмне жана кантип иштээрин түшүнүүгө мүмкүндүк берет.

Мындай калькулятор ресторанда же кафеде убакыт өткөрүүнү чечкен компаниянын кеңештеринин суммасын эсептөө керек болгондо пайдалуу. Албетте, баары эмес жана ар дайым официанттарга чай калтырбайт, бул батыштын салты, бирок мындай тиркемени иштеп чыгуу процесси кандай болгон күндө да кызыктуу.

Биз эсиңизге салабыз: "Хабрдын" бардык окурмандары үчүн - "Habr" промо-кодун колдонуу менен каалаган Skillbox курсуна катталганда 10 000 рубль арзандатуу.

Skillbox сунуштайт: Практикалык курс "Мобилдик Developer PRO.

Бул колдонмо иштеп жатканда кандай көрүнөт:

Сиз жалпы сумманын каалаган пайызын, жолугушуунун катышуучуларынын санын киргизип, натыйжаны аласыз - кетүүгө татыктуу кеңештердин суммасы.

баштоо

Колдонмонун толук интерфейси төмөнкүдөй көрүнөт:

Биринчи иш - долбоордун базасын жүктөп алуу. Аны Android Studio 3.0 же кийинки версиясында ачыңыз. Биз долбоорду куруп, иштетип, ак экранды көрөбүз. Баары жакшы, болушу керек эле.

Колдонуучунун аракеттери долбоордо хронологиялык тартипте жазылгандыктан, баары түшүнүктүү. Аны көрүү үчүн, Көрүү -> Курал 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"/>

Эми сиз баалуулуктар каталогун стилдештире аласыз же түстөр менен ойной аласыз material.io куралы.

Эми долбоор мындай көрүнөт:

Көрүнүп тургандай, чыгымдарды эсептөө колдонуучу киргизген маалыматтарга негизделген.

Эсеп бөлүмүн иштеп чыгуу

Төмөнкү кодду LinearLayout'ка Чыгымдар бөлүмүнөн (№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>

Биз TODO тизмесинен кийин LinearLayout'ту жабабыз, андан кийин жаңы кодду кошуп, аны 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"/>

Тиркеменин негизги милдети ресторандагы чогулуштарга катышуучулардын ар бири үчүн жеке чыгымдарды эсептөө болгондуктан, costPerPersonTextView негизги ролду ойнойт.

EditText киргизүүнү бир сап менен чектейт, бул параметр NumberDecimal inputType деп коюлушу керек.

Биз сыноо үчүн долбоорду баштайбыз жана жалпы зыяндын параметрлерин киргизебиз (сынган чөйчөк, табак ж.б.)

«Адамдар жана кеңештер» бөлүмүн иштеп чыгуу

Үндүн көлөмүн тандоо үчүн төмөнкү кодду жаңы LinearLayout бөлүмүнө чаптаңыз (№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>

Коддун бул бөлүгү учтун суммасын так эсептөө үчүн талап кылынат. Демейки тексттин мааниси 20. ImageButtons жазуу уруксаттары бар папкадагы иконалар менен камсыз кылынат.

Бөлүмдү толугу менен көчүрүп, төмөнкүнү кошуңуз (№5):

ImageButton идентификаторлору (subtractPeopleButton, addPeopleButton)
TextView идентификаторлору (numberOfPeopleStaticText, numberOfPeopleTextView)
numberOfPeopleTextView үчүн DefaultText (4 болушу керек).

Эми, тиркемени баштаганда, эсеп-дүмүрчөктүн суммасын кошууга болот, Кошуу/Чыгаруу баскычтары да иштейт, бирок азырынча эч нерсе болбойт.

Көрүүлөрдү кошуу

MainActivity.ktти ачып, муну 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
 
}

Баскычтарды бүтүрүү

Баскычты чыкылдатууларды колдоо үчүн View.OnClickListener программасын класс деңгээлинде ишке ашырыңыз (№7):

класс MainActivity: AppCompatActivity(), View.OnClickListener {

Долбоорду азыр түзүү иштебейт, сиз дагы бир нече кадамдарды жасашыңыз керек (# 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()
        }
    }

Баскычтар жана өчүргүчтөр боюнча, Котлинде бардыгы абдан сонун уюштурулган! Бардык көбөйтүү жана азайтуу функцияларына төмөндөгү кодду кошуңуз
(#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()
        }
    }

Бул жерде код кошумча функцияларды максималдуу маанилер менен коргойт (MAX_TIP & MAX_PEOPLE). Мындан тышкары, код төмөндөтүү функцияларын минималдуу маанилер менен коргойт (MIN_TIP & MIN_PEOPLE).

Эми биз баскычтарды initViews функциясында угуучуларга байлайбыз (№13):

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

Эми сиз жалпы зыянды, кеңештерди жана жолугушуунун катышуучуларынын санын кошо аласыз. Эми эң негизгиси...

Чыгымдар бөлүмү

Бул код чыгымдарды эсептейт (№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)
 
}

Бул жерде компаниядагы адамдардын санын эсепке алууга жана учту эсептөөгө мүмкүндүк берүүчү функция деп аталат (№15):

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

Биз колдонмону ишке киргизебиз. Ал көрүнөт жана сонун иштейт. Бирок жакшыраак болушу мүмкүн.

Эгер сиз эсеп-дүмүрчөктүн суммасын алып салууга аракет кылып, андан кийин кеңештердин же достордун санын көбөйтүүгө аракет кылсаңыз, колдонмо бузулуп калат, анткени азырынча нөлдүк чыгымдарды текшерүү жок. Мындан тышкары, эгерде сиз эсеп-фактуранын суммасын өзгөртүүгө аракет кылсаңыз, төлөмдөр жаңыртылбайт.

Акыркы кадамдар

TextWatcher кошуу (№16):

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

Андан кийин биз billEditText угуучусун киргизебиз (№17):

billEditText.addTextChangedListener(бул)

Plus 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) {}

Ооба, азыр баары иштейт! Куттуктайбыз, сиз Котлинде өзүңүздүн "Балклама калькуляторуңузду" жаздыңыз.

Skillbox сунуштайт:

Эки жылдык практикалык курс "Мен PRO веб-иштеп чыгуучумун".

Онлайн курс "C# иштеп чыгуучу".

Практикалык жылдык курс "PHP иштеп чыгуучусу 0дөн PRO".

Source: www.habr.com

Котлинде учтун калькуляторун куруу: ал кантип иштейт?