Vytvoření kalkulačky spropitného v Kotlin: jak to funguje?
Ukážeme vám, jak vytvořit jednoduchou aplikaci pro výpočet spropitného v Kotlinu. Přesněji Kotlin 1.3.21, Android 4, Android Studio 3. Článek bude zajímavý především pro ty, kteří začínají svou cestu ve vývoji aplikací pro Android. Umožňuje vám pochopit, co a jak funguje uvnitř aplikace.
Taková kalkulačka je užitečná, když potřebujete spočítat množství spropitného od společnosti, která se rozhodne strávit čas v restauraci nebo kavárně. Samozřejmě ne každý a ne vždy nechá čaj pro číšníky, to je spíše západní tradice, ale proces vývoje takové aplikace je každopádně zajímavý.
Připomínáme:pro všechny čtenáře "Habr" - sleva 10 000 rublů při zápisu do jakéhokoli kurzu Skillbox pomocí propagačního kódu "Habr".
Zadáte požadované procento z celkové částky, počet účastníků schůzky a získáte výsledek – množství spropitného, které stojí za to opustit.
Začínáme
Celé rozhraní aplikace vypadá takto:
První akce - projektová základna ke stažení. Otevřete jej v Android Studiu 3.0 nebo novějším. Stavíme a spouštíme projekt a vidíme bílou obrazovku. Vše je v pořádku, jak má být.
Uživatelské akce jsou v projektu zapsány v chronologickém pořadí, aby bylo vše jasné. Chcete-li jej zobrazit, otevřete Zobrazit -> Nástrojová okna -> Úkol.
Prostudujeme projekt a otevřeme colours.xml, abychom vyhodnotili barevnou paletu. strings.xml obsahuje textová data (titulky) a styles.xml obsahuje několik šablon písem.
Vývoj nákladové sekce
Otevřete activity_main.xml a přidejte níže uvedený kód do LinearLayout (#1):
Protože hlavním úkolem aplikace je vypočítat individuální náklady pro každého z účastníků setkání v restauraci, hlavní roli hraje costPerPersonTextView.
EditText omezuje vstup na jeden řádek, tento parametr musí být nastaven na NumberDecimal inputType.
Spustíme projekt na zkoušku a zadáme parametry celkového poškození (rozbité šálky, talíře atd.)
Vývoj sekce "Lidé a tipy".
Chcete-li přidat volič výše spropitného, vložte níže uvedený kód do nové sekce LinearLayout (#4):
Tento kód je nutný k přesnému výpočtu výše spropitného. Výchozí textová hodnota je 20. Tlačítka ImageButton jsou vybavena ikonami ve složce s oprávněním k zápisu.
Zkopírujte celou sekci a přidejte následující (#5):
ID ImageButton (subtractPeopleButton, addPeopleButton)
ID TextView (numberOfPeopleStaticText, numberOfPeopleTextView)
DefaultText for numberOfPeopleTextView (mělo by být 4).
Nyní při spuštění aplikace je možné přičíst částku faktury, fungují i tlačítka Přidat / Odečíst, ale zatím se nic neděje.
Přidat zobrazení
Otevřete MainActivity.kt a přidejte to do funkce initViews (#6):
Co se týče tlačítek a přepínačů, Kotlin má vše zorganizované velmi cool! Přidejte níže uvedený kód do všech funkcí zvýšení a snížení
(#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()
}
}
Zde kód chrání inkrementační funkce s maximálními hodnotami (MAX_TIP & MAX_PEOPLE). Kromě toho kód chrání dekrementační funkce s minimálními hodnotami (MIN_TIP & MIN_PEOPLE).
Nyní připojíme tlačítka k posluchačům ve funkci initViews (#13):
private fun initViews() {
...
addTipButton.setOnClickListener(this)
subtractTipButton.setOnClickListener(this)
addPeopleButton.setOnClickListener(this)
subtractPeopleButton.setOnClickListener(this)
//TODO #15: Bind EditText to TextWatcher
}
Nyní můžete přidat celkové poškození, tipy a počet účastníků schůzky. No a teď to nejdůležitější...
Sekce nákladů
Tento kód vypočítá náklady (#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)
}
Zde se volá funkce, která umožňuje vzít v úvahu počet lidí ve společnosti a vypočítat spropitné (#15):
private fun incrementTip() {
…
}
private fun decrementTip() {
…
}
private fun incrementPeople() {
…
}
private fun decrementPeople() {
…
}
Spouštíme aplikaci. Vypadá a funguje skvěle. Ale mohlo by to být lepší.
Pokud se pokusíte odstranit částku účtu a poté zvýšit počet rad nebo přátel, aplikace se zhroutí, protože zatím neexistuje kontrola nulových nákladů. Navíc, pokud se pokusíte změnit fakturovanou částku, poplatky nebudou aktualizovány.
Závěrečné kroky
Přidat TextWatcher (#16):
class MainActivity: AppCompatActivity(), View.OnClickListener, TextWatcher {
Poté vložíme posluchače billEditText (#17):
billEditText.addTextChangedListener(toto)
Plus přidat kód pro spuštění 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) {}
No, teď už vše funguje! Gratulujeme, napsali jste svou vlastní „Tipovací kalkulačku“ v Kotlinu.