🥇Kotlin'de bahşiş hesaplayıcı oluşturma: nasıl çalışır?

Size Kotlin'de nasıl basit bir bahşiş hesaplama uygulaması oluşturacağınızı gösteriyoruz. Daha kesin olmak gerekirse, Kotlin 1.3.21, Android 4, Android Studio 3. Makale, öncelikle Android uygulamaları geliştirme yolculuğuna başlayanlar için ilginç olacak. Uygulama içinde neyin ve nasıl çalıştığını anlamanızı sağlar.

Böyle bir hesap makinesi, bir restoran veya kafede vakit geçirmeye karar veren bir şirketin verdiği bahşiş miktarını hesaplamanız gerektiğinde kullanışlıdır. Tabii ki, herkes ve her zaman garsonlar için çay bırakmaz, bu daha çok bir Batı geleneğidir, ancak böyle bir uygulamayı geliştirme süreci her durumda ilginçtir.

Hatırlatıyoruz: tüm "Habr" okuyucuları için - "Habr" promosyon kodunu kullanarak herhangi bir Skillbox kursuna kayıt olurken 10 ruble indirim.

Skillbox şunları önerir: pratik kurs "Mobil Geliştirici PRO.

Uygulama çalışırken şöyle görünür:

Toplam tutarın istediğiniz yüzdesini, toplantıdaki katılımcı sayısını girersiniz ve sonucu alırsınız - bırakılması gereken bahşiş miktarı.

Başlarken

Uygulamanın tam arayüzü şöyle görünür:

İlk eylem - proje tabanı indir. Android Studio 3.0 veya sonrasında açın. Projeyi kurup çalıştırıyoruz ve beyaz bir ekran görüyoruz. Her şey yolunda, olması gerektiği gibi.

Kullanıcı eylemleri projede kronolojik sırayla yazılır, böylece her şey netleşir. Görüntülemek için Görünüm -> Araç Pencereleri -> YAPILACAKLAR'ı açın.

Projeyi inceliyoruz ve renk paletini değerlendirmek için colors.xml'i açıyoruz. strings.xml metin verilerini (resim yazıları) içerir ve styles.xml birkaç yazı tipi şablonu içerir.

Maliyet Bölümü Geliştirme

Activity_main.xml dosyasını açın ve aşağıdaki kodu LinearLayout'a (#1) ekleyin:

<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"/>

Artık değerler dizinini biçimlendirebilir veya kullanarak renklerle oynayabilirsiniz. materyal.io aracı.

Şimdi proje şöyle görünüyor:

Görüldüğü gibi maliyet hesaplaması kullanıcı tarafından girilen verilere göre yapılmaktadır.

Hesap bölümünün geliştirilmesi

Gider Bölümünden (#2) sonra LinearLayout'a aşağıdaki kodu ekleyin:

<LinearLayout
    android_layout_width="match_parent"
    android_layout_height="match_parent"
    android_orientation="vertical"
    android_background="@color/colorAccent">
 
<! — TODO #3: Build Bill Section →
 
… 
</LinearLayout>

YAPILACAKLAR listesinden sonra LinearLayout'u kapatın ve ardından yeni kodu LinearLayout (#3) içine yerleştirerek ekleyin:

<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"/>

Uygulamanın ana görevi, restorandaki toplantılardaki her bir katılımcı için bireysel maliyetleri hesaplamak olduğu için, asıl rolü costPerPersonTextView oynuyor.

EditText girişi bir satırla sınırlar, bu parametre NumberDecimal inputType olarak ayarlanmalıdır.

Test için projeye başlıyoruz ve toplam hasarın (kırık bardak, tabak vb.) parametrelerini giriyoruz.

"Kişiler ve İpuçları" bölümünün geliştirilmesi

Bir bahşiş miktarı seçici eklemek için aşağıdaki kodu yeni bir LinearLayout bölümüne (#4) yapıştırın:

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

Bu kod parçası, bahşiş miktarını doğru bir şekilde hesaplamak için gereklidir. Varsayılan metin değeri 20'dir. ImageButtons, yazma izinlerine sahip bir klasörde simgelerle sağlanır.

Tüm bölümü kopyalayın ve aşağıdakileri (#5) ekleyin:

ImageButton kimlikleri (çıkarPeopleButton, addPeopleButton)
TextView kimlikleri (numberOfPeopleStaticText, numberOfPeopleTextView)
numberOfPeopleTextView için DefaultText (4 olmalıdır).

Artık uygulamaya başlarken fatura tutarını eklemek mümkün, Ekle/Çıkar butonları da çalışıyor ama şu ana kadar bir şey olmuyor.

Görünüm Ekle

MainActivity.kt'yi açın ve bunu initViews işlevine (#6) ekleyin:

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
 
}

düğmeleri bitirmek

Düğme tıklamaları için destek eklemek için View.OnClickListener'ı sınıf düzeyinde (#7) uygulayın:

sınıf MainActivity: AppCompatActivity(), View.OnClickListener {

Projeyi şu anda derlemek işe yaramayacak, birkaç adım daha gerçekleştirmeniz gerekiyor (# 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()
        }
    }

Düğmeler ve anahtarlar açısından, Kotlin her şeyi çok iyi organize etti! Tüm artırma ve eksiltme işlevlerine aşağıdaki kodu ekleyin
(#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()
        }
    }

Burada kod, artış fonksiyonlarını maksimum değerlerle (MAX_TIP & MAX_PEOPLE) korur. Ayrıca kod, azaltma fonksiyonlarını minimum değerlerle (MIN_TIP & MIN_PEOPLE) korur.

Şimdi düğmeleri initViews işlevindeki (#13) dinleyicilere bağlarız:

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

Artık toplam hasar, bahşiş ve toplantı katılımcılarının sayısını ekleyebilirsiniz. Peki, şimdi en önemli şey...

Maliyet bölümü

Bu kod maliyetleri hesaplar (#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)
 
}

Pekala, burada şirketteki insan sayısını hesaba katmayı ve ipucunu hesaplamayı mümkün kılan bir işlev çağrılır (#15):

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

Uygulamayı başlatıyoruz. Harika görünüyor ve çalışıyor. Ama daha iyi olabilir.

Fatura tutarını kaldırmaya ve ardından ipuçlarının veya arkadaşların sayısını artırmaya çalışırsanız, henüz sıfır maliyet kontrolü olmadığı için uygulama çökecektir. Ayrıca fatura tutarını değiştirmeye çalışırsanız ücretler güncellenmeyecektir.

Son adımlar

TextWatcher'ı (#16) ekleyin:

sınıf MainActivity: AppCompatActivity(), View.OnClickListener, TextWatcher {

Ardından billEditText dinleyicisini (#17) yerleştiriyoruz:

billEditText.addTextChangedListener(bu)

Ayrıca TextWatcher'ı (#18) çalıştırmak için kod ekleyin:

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

Eh, şimdi her şey çalışıyor! Tebrikler, Kotlin'de kendi "Bahşiş Hesaplayıcınızı" yazdınız.

Skillbox şunları önerir:

İki yıllık uygulamalı kurs "Ben bir PRO Web Geliştiricisiyim".

çevrimiçi kurs "C# geliştiricisi".

Uygulamalı yıl kursu "0'dan PRO'ya PHP geliştiricisi".

Kaynak: habr.com

Kotlin'de bir bahşiş hesaplayıcı oluşturmak: nasıl çalışır?