🥇 په کوټلین کې د ټیپ کیلکولیټر رامینځته کول: دا څنګه کار کوي؟

موږ تاسو ته وایو چې څنګه په کوټلین کې د لارښوونو محاسبه کولو لپاره ساده غوښتنلیک رامینځته کړئ. په ډیر دقیق ډول، کوټلین 1.3.21، Android 4، د Android سټوډیو 3. مقاله به په زړه پوري وي، لومړی د هغو کسانو لپاره چې د Android غوښتنلیک پراختیا کې خپل سفر پیل کوي. دا تاسو ته اجازه درکوي پوه شئ چې دا د غوښتنلیک دننه څه او څنګه کار کوي.

دا کیلکولیټر به په کار وي کله چې تاسو اړتیا لرئ د هغه شرکت څخه د لارښوونو مقدار محاسبه کړئ چې پریکړه کوي په رستورانت یا کیف کې وخت تیر کړي. البته، هرڅوک تل ویټرانو ته لارښوونه نه پریږدي؛ دا د لویدیځ دود دی، مګر د داسې غوښتنلیک رامینځته کولو پروسه په هر حالت کې په زړه پورې ده.

موږ یادونه کوو: د ټولو هابر لوستونکو لپاره - د 10 روبل تخفیف کله چې د هابر پرومو کوډ په کارولو سره د مهارت بکس کوم کورس کې نوم لیکنه وکړئ.

Skillbox وړاندیز کوي: عملي کورس "د ګرځنده پراختیا کونکي PRO.

دا هغه څه دي چې غوښتنلیک په عملیاتو کې ښکاري:

تاسو د ټول مقدار مطلوب فیصده داخل کړئ، د غونډې ګډون کونکو شمیر، او پایله ترلاسه کړئ - د ټیپ مقدار چې تاسو باید پریږدئ.

پیل کول

د غوښتنلیک بشپړ انٹرفیس داسې ښکاري:

لومړی اقدام - د پروژې اساس ډاونلوډ کول. دا په Android سټوډیو 3.0 یا وروسته کې خلاص کړئ. موږ پروژه جوړه او پیل کوو او سپینه سکرین ګورو. هرڅه سم دي، دا باید څنګه وي.

د کارونکي عملونه په پروژه کې په تاریخي ترتیب کې لیکل شوي ترڅو هرڅه روښانه کړي. د دې لیدو لپاره ، لید -> اوزار وینډوز -> 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
    android_layout_width="match_parent"
    android_layout_height="match_parent"
    android_orientation="vertical"
    android_background="@color/colorAccent">
 
<! — TODO #3: Build Bill Section →
 
… 
</LinearLayout>

موږ د TODOs لیست وروسته 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"/>

څرنګه چې د غوښتنلیک اصلي دنده د رستورانت په راټولولو کې د هر ګډون کونکي لپاره د انفرادي لګښتونو محاسبه کول دي، د قیمت PerPersonTextView اصلي رول لوبوي.

EditText ان پټ په یوه کرښه کې محدودوي، دا پیرامیټر باید د NumberDecimal inputType سره تنظیم شي.

موږ پروژه د ازموینې لپاره پیل کوو او د عمومي زیان لپاره پیرامیټرونه دننه کوو (مات شوي پیالې ، پلیټونه او نور)

د "خلک او لارښوونې" برخې پراختیا

د ټیپ حجم انتخاب اضافه کولو لپاره ، لاندې کوډ په نوي لینکر لی آؤٹ برخې کې پیسټ کړئ (#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 دی. د امیج بټن د لیکلو اجازې سره په فولډر کې د شبیانو سره چمتو شوي.

برخه په بشپړه توګه کاپي کړئ او لاندې اضافه کړئ (#5):

د عکس بټن ids (د خلکو بټن کم کړئ ، د خلکو بټن اضافه کړئ)
TextView ids(numberOfPeopleStaticText, numberOfPeopleTextView)
د numberOfPeopleTextView لپاره ډیفالټ متن (باید 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
 
}

د بټونو پای کول

د تڼۍ کلیکونو لپاره د ملاتړ اضافه کولو لپاره، موږ د ټولګي په کچه (#7) کې View.OnClickListener پلي کوو:

ټولګي اصلي فعالیت: 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):

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):

ټولګي اصلي فعالیت: 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 وړاندیز کوي:

دوه کلن عملي کورس "زه د ویب پرمخ وړونکی PRO یم".

آنلاین کورس "C# پرمخ وړونکی".

یو کلن عملي کورس "د پی ایچ پی جوړونکی له 0 څخه تر پرو".

سرچینه: www.habr.com

په کوټلین کې د ټیپ کیلکولیټر رامینځته کول: دا څنګه کار کوي؟