🥇Котлинде кеңес калькуляторын жасау: ол қалай жұмыс істейді?

Біз сізге Котлиндегі кеңестерді есептеуге арналған қарапайым қосымшаны қалай жасау керектігін айтамыз. Дәлірек айтқанда, Kotlin 1.3.21, Android 4, Android Studio 3. Мақала, ең алдымен, Android қосымшаларын әзірлеуде өз саяхатын бастағандар үшін қызықты болады. Бұл қолданбаның ішінде не және қалай жұмыс істейтінін түсінуге мүмкіндік береді.

Бұл калькулятор мейрамханада немесе кафеде уақыт өткізуге шешім қабылдаған компанияның кеңестерінің мөлшерін есептеу қажет болғанда пайдалы болады. Әрине, әркім әрқашан даяшыларға кеңес қалдырмайды, бұл батыстық дәстүр, бірақ мұндай қосымшаны әзірлеу процесі кез келген жағдайда қызықты.

Біз еске саламыз: «Хабрдың» барлық оқырмандары үшін - «Habr» жарнамалық кодын пайдаланып кез келген Skillbox курсына жазылу кезінде 10 000 рубль көлемінде жеңілдік.

Skillbox ұсынады: Практикалық курс «Ұялы әзірлеуші PRO.

Қолданба жұмыс істеп тұрғандай көрінеді:

Сіз жалпы соманың қалаған пайызын, жиналысқа қатысушылардың санын енгізесіз және нәтиже аласыз - қалдыру керек кеңес сомасы.

Жұмысты бастау

Толық қолданба интерфейсі келесідей көрінеді:

Бірінші әрекет - жоба базасын жүктеп алу. Оны Android Studio 3.0 немесе одан кейінгі нұсқасында ашыңыз. Біз жобаны құрастырамыз және іске қосамыз және ақ экранды көреміз. Бәрі жақсы, солай болуы керек.

Барлығы түсінікті болу үшін жобада пайдаланушы әрекеттері хронологиялық тәртіпте жазылған. Оны көру үшін 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"/>

Енді мәндер каталогын мәнерлеуге немесе түстермен ойнауға болады material.io құралы.

Енді жоба келесідей көрінеді:

Көріп отырғаныңыздай, шығындар пайдаланушы енгізген деректер негізінде есептеледі.

Есептер бөлімін әзірлеу

Төмендегі кодты «Шығын» бөлімінен кейін (№2) LinearLayout-қа қосыңыз:

<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 идентификаторлары(саныPeopleStaticText, 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):

Class 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(бұл)

Сонымен қатар біз 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 ұсынады:

Екі жылдық практикалық курс «Мен веб-әзірлеуші маманмын».

Онлайн курс "C# әзірлеушісі".

Практикалық курс «0-ден PRO-ге дейінгі PHP әзірлеушісі».

Ақпарат көзі: www.habr.com

Котлинде кеңес калькуляторын жасау: ол қалай жұмыс істейді?