Peb qhia koj yuav ua li cas los tsim ib daim ntawv thov yooj yim rau kev suav cov lus qhia hauv Kotlin. Ntau precisely, Kotlin 1.3.21, Android 4, Android Studio 3. Cov kab lus yuav nthuav, ua ntej ntawm tag nrho cov, rau cov neeg uas tab tom pib taug kev hauv Android daim ntawv thov kev loj hlob. Nws tso cai rau koj kom nkag siab txog dab tsi thiab nws ua haujlwm li cas hauv daim ntawv thov.
Lub laij lej no yuav los ua ke thaum koj xav tau suav cov lus qhia los ntawm lub tuam txhab uas txiav txim siab siv sijhawm hauv tsev noj mov lossis chaw noj mov. Tau kawg, tsis yog txhua tus ib txwm tso cov lus qhia rau cov neeg ua haujlwm; qhov no yog ntau dua ntawm Western kab lis kev cai, tab sis cov txheej txheem ntawm kev tsim cov ntawv thov no nthuav dav rau txhua qhov xwm txheej.
Peb nco qab: rau txhua tus neeg nyeem Habr - 10 ruble luv nqi thaum tso npe rau hauv ib chav kawm Skillbox siv Habr promo code.
Skillbox pom zoo: Cov chav kawm siv tau .
Nov yog qhov kev thov zoo li hauv kev ua haujlwm:
Koj nkag mus rau qhov xav tau feem pua ntawm tag nrho cov nyiaj, tus naj npawb ntawm cov neeg tuaj koom lub rooj sib tham, thiab tau txais cov txiaj ntsig - tus nqi ntawm cov lus qhia koj yuav tsum tawm mus.
Pib
Daim ntawv thov ua tiav interface zoo li no:
Thawj qhov kev txiav txim - . Qhib nws hauv Android Studio 3.0 lossis tom qab ntawd. Peb tsim thiab tso qhov project thiab pom ib qho screen dawb. Txhua yam zoo, yog li nws yuav tsum ua.
Cov neeg siv ua yeeb yam tau sau rau hauv qhov project hauv lub sijhawm ua kom txhua yam meej. Txhawm rau saib nws, qhib View -> Tool Windows -> TODO.
Peb kawm txog qhov project thiab qhib cov xim.xml los ntsuas cov xim palette. strings.xml muaj cov ntaub ntawv cov ntaub ntawv (kos npe), thiab styles.xml muaj ob peb font templates.
Kev txhim kho tus nqi seem
Qhib activity_main.xml thiab ntxiv cov cai hauv qab no rau 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"/>Tam sim no koj tuaj yeem tsim cov ntawv teev npe tseem ceeb lossis ua si nrog cov xim siv .
Tam sim no qhov project zoo li no:
Raws li koj tuaj yeem pom, cov nqi raug xam raws li cov ntaub ntawv nkag los ntawm tus neeg siv.
Kev loj hlob ntawm cov nyiaj seem
Ntxiv cov cai hauv qab no rau LinearLayout tom qab Cov Nqi Them Nqi (#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>Peb kaw LinearLayout tom qab cov npe TODOs, thiab tom qab ntawd ntxiv cov lej tshiab, muab tso rau hauv 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"/>Txij li lub luag haujlwm tseem ceeb ntawm daim ntawv thov yog suav tus nqi rau txhua tus neeg koom nrog hauv tsev noj mov sib sau ua ke, costPerPersonTextView ua lub luag haujlwm tseem ceeb.
EditText txwv cov tswv yim rau ib kab, qhov parameter no yuav tsum tau teem rau NumberDecimal inputType.
Peb tso tawm qhov project rau qhov kev xeem thiab nkag mus rau qhov tsis muaj kev puas tsuaj dav dav (khob khob, phaj, thiab lwm yam)
Kev txhim kho ntawm ntu "Cov Neeg thiab Cov Lus Qhia".
Txhawm rau ntxiv cov lus xaiv ntim ntim, muab cov lej hauv qab no rau hauv ntu LinearLayout tshiab (#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>Tshooj cai no yog tsim nyog los xam cov nqi lus kom raug. Lub neej ntawd tus nqi ntawv yog 20. ImageButtons yog muab nrog cov cim hauv daim nplaub tshev nrog kev tso cai sau ntawv.
Luam ntu tag nrho thiab ntxiv cov hauv qab no (#5):
- ImageButton ids (subtractPeopleButton, addPeopleButton)
- TextView ids(numberOfPeopleStaticText, numberOfPeopleTextView)
- DefaultText rau numberOfPeopleTextView (yuav tsum yog 4).
Tam sim no, thaum koj tso daim ntawv thov, muaj lub sijhawm los ntxiv cov nqi them nqi, cov khawm "Ntxiv / rho tawm" kuj ua haujlwm, tab sis tsis muaj dab tsi tshwm sim.
Ntxiv Views
Qhib MainActivity.kt thiab ntxiv qhov no rau initViews muaj nuj nqi (#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
}Ua kom tiav cov nyees khawm
Txhawm rau ntxiv kev txhawb nqa rau pob nyem, peb siv View.OnClickListener ntawm chav kawm (#7):
chav MainActivity: AppCompatActivity(), View.OnClickListener {
Nws yuav tsis tuaj yeem suav ua qhov project tam sim no; koj yuav tsum ua ob peb kauj ruam ntxiv (#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()
}
}
Hais txog cov nyees khawm thiab cov keyboards, Kotlin npaj txhua yam txias heev! Ntxiv cov cai hauv qab no rau txhua qhov increment thiab decrement functions
(#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()
}
}Ntawm no cov cai tiv thaiv cov increment functions nrog cov nqi siab tshaj (MAX_TIP & MAX_PEOPLE). Tsis tas li ntawd, cov cai tiv thaiv qhov kev txo qis ua haujlwm nrog qhov tsawg kawg nkaus (MIN_TIP & MIN_PEOPLE).
Tam sim no peb koom nrog cov nyees khawm nrog cov neeg mloog hauv initViews muaj nuj nqi (#13):
private fun initViews() {
...
addTipButton.setOnClickListener(this)
subtractTipButton.setOnClickListener(this)
addPeopleButton.setOnClickListener(this)
subtractPeopleButton.setOnClickListener(this)
//TODO #15: Bind EditText to TextWatcher
}
Tam sim no koj tuaj yeem ntxiv tag nrho cov kev puas tsuaj, cov lus qhia, thiab tus naj npawb ntawm cov neeg tuaj koom. Zoo, tam sim no qhov tseem ceeb tshaj plaws ...
Nqe lus suav
Cov cai no suav cov nqi (#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)
}Zoo, ntawm no yog ib txoj haujlwm hu ua uas ua rau nws muaj peev xwm coj mus rau hauv tus lej ntawm cov neeg hauv tuam txhab thiab suav cov lus qhia (#15):
private fun incrementTip() {
…
}
private fun decrementTip() {
…
}
private fun incrementPeople() {
…
}
private fun decrementPeople() {
…
}Cia peb pib daim ntawv thov. Nws zoo nkaus li thiab ua haujlwm zoo. Tab sis nws yuav zoo dua.
Yog tias koj sim tshem tawm cov nqi thiab tom qab ntawd nce cov lus qhia lossis cov phooj ywg, daim ntawv thov yuav poob vim tias tseem tsis tau kuaj xyuas tus nqi xoom. Ntxiv mus, yog tias koj sim hloov tus nqi ntawm cov nqi, cov nqi yuav tsis hloov kho.
Cov kauj ruam kawg
Ntxiv TextWatcher (#16):
chav MainActivity: AppCompatActivity(), View.OnClickListener, TextWatcher {
Ces peb embed tus billEditText listener (#17):
billEditText.addTextChangedListener(qhov no)
Ntxiv rau peb ntxiv cov cai rau ua tiav 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) {}
Zoo, tam sim no kiag li txhua yam ua haujlwm! Nrog koj zoo siab, koj tau sau koj tus kheej "Tip Calculator" hauv Kotlin.
Skillbox pom zoo:
- Ob xyoos xyaum xyaum .
- Hoob kawm online .
- Cov chav kawm xyaum ua ib xyoos .
Tau qhov twg los: www.hab.com