Dokunma Sayacı Oluşturma
Canlı güncellemeler için durumu bir düğmeye bağlayın.
Dokunma Sayacı Oluşturma, CoddyKit'te ücretsiz bir Jetpack Compose Academy dersidir. Bu, 4 dersinin 3. dersidir. Aşağıdan dersin tamamını ücretsiz okuyabilir, sonra tarayıcıda yerleşik kod editörü ve 7/24 yapay zeka koçu ile uygulamalı olarak pratik yapabilirsin. Bu, Jetpack Compose Academy öğrenme yolunun bir parçasıdır ve ilerlemeniz web ve CoddyKit uygulaması arasında senkronize olur. Jetpack Compose Academy kursu toplamda 4 dersten oluşur.
Bu dersin bazı bölümleri henüz çevrilmemiş olup İngilizce olarak gösterilmektedir.
Our Goal
Let's build a tiny tap counter: a number on screen and a button that increases it with every tap. 🙂
Start With the State
First declare the state that will change. The counter starts at zero and lives inside the Composable for now.
var count by remember { mutableStateOf(0) }Show the Count
Read the state in a Text so it always displays the current value. Reading it here subscribes the Text to changes.
Text("Count: " + count)Add the Button
A Button needs an onClick action. Inside it we will change the state, which is what makes the UI react.
Button(onClick = { }) {
Text("Tap me")
}Increment on Tap
In onClick, bump the counter. Changing the state tells Compose to recompose anything that reads count.
Button(onClick = { count++ }) {
Text("Tap me")
}Stack Them in a Column
Place the text above the button using a Column, which lays out its children vertically, top to bottom.
Column {
Text("Count: " + count)
Button(onClick = { count++ }) { Text("Tap me") }
}How the Loop Works
Tap fires onClick, count changes, Compose recomposes the Text, and you instantly see the new number. That is the full cycle.
Add a Reset Button
Want a fresh start? Add a second button whose onClick sets count back to zero. Reset is just another state change.
Button(onClick = { count = 0 }) {
Text("Reset")
}React to the Value
Because the UI is a function of state, you can style it from count, like showing a message once it passes ten taps.
if (count > 10) Text("Wow, keep going!")Wrap It in a Function
Put everything in a reusable Composable named TapCounter. Now you can drop your counter anywhere in the app.
@Composable
fun TapCounter() {
var count by remember { mutableStateOf(0) }
}You Built Interactivity
That simple loop of state to UI to event to state is the heart of every interactive Compose screen you will ever write.
Quick Check
What makes the displayed number update after a tap?
Recap
You wired state to a Text and a Button to build a live tap counter, your first truly interactive Compose screen. Great work! 🎉
Sıkça Sorulan Sorular
“Dokunma Sayacı Oluşturma” dersi ücretsiz mi?
Evet — “Dokunma Sayacı Oluşturma” dersin tüm metni burada web'de ücretsiz olarak okunabilir. Etkileşimli olarak pratik yapmak (yerleşik kod editörü ve 7/24 yapay zeka koçu) ve Jetpack Compose Academy kursunun geri kalanını açmak için CoddyKit PRO'ya yükselt. Jetpack Compose Academy kursu toplamda 4 dersten oluşur.
“Dokunma Sayacı Oluşturma” dersinde ne öğreneceğim?
Canlı güncellemeler için durumu bir düğmeye bağlayın. Jetpack Compose Academy ile uygulamalı kodu tarayıcıda doğrudan çalıştırarak pratik yaparsın ve 7/24 yapay zeka koçu dersi çalışırken sorularını yanıtlar.
Jetpack Compose Academy öğrenmeye başlamak için deneyim gerekli mi?
Önceden deneyim gerekmez. CoddyKit'te Jetpack Compose Academy, başlangıçtan ileri seviyeye kadar yapılandırıldığı için buradan başlayabilir veya başından başlayıp kendi hızında ilerleme yapabilirsin. Bu, 4 dersinin 3. dersidir.
“Dokunma Sayacı Oluşturma” dersi ne kadar sürer?
Çoğu CoddyKit dersi yaklaşık 5–10 dakika sürer. Her biri kısa ve etkileşimli olduğu için sabit ilerleme yaparsın ve web ile uygulama arasında tam olarak bıraktığın yerden devam edebilirsin.
Bu Jetpack Compose Academy dersinde kod yazıp çalıştırabilir miyim?
Evet. Her Jetpack Compose Academy dersi yerleşik bir kod editörü içerir, bu sayede tarayıcıda gerçek kod yazıp çalıştırabilir ve anlık yapay zeka geri bildirimi alırsın — yerel kurulum gerekli değildir.
Bu kursun tüm dersleri
- remember ve mutableStateOf
- Yeniden Oluşturma: Yeniden Çizimi Tetikleyen Nedir
- Dokunma Sayacı Oluşturma
- Döndürme Boyunca rememberSaveable