If you're a fan of fitness trackers or wearables, chances are you've already seen a step counter app in action. But have you ever wanted to build one yourself? In this complete tutorial, we’ll walk you through creating your very own Step Counter app for Wear OS using Jetpack Compose, Android’s modern UI toolkit.
We’ll use Jetpack Compose, ViewModel, and the step detector sensor provided by the Android operating system. Whether you’re just getting started with Compose or looking for a wearable-specific project, this is the perfect guide for you.
🔧 What We’ll Build
We’ll create a minimal yet functional Wear OS app that:
- Detects and displays your steps using the step detector sensor.
- Reactively updates the UI with the current step count.
- Handles activity recognition permission.
- Follows best practices with ViewModel and state handling in Compose.
🧰 Tools & Tech Stack
- Jetpack Compose – UI toolkit
- ViewModel – Logic holder across configuration changes
- SensorManager – Access to step detector
- Wear OS Emulator or Physical Watch – To test
- Kotlin – Our primary programming language
🛠 Step 1: Create a New Wear OS Project
Open Android Studio and select New Project > Empty Wear OS Compose Activity.
- Make sure to select:
- Kotlin
- Minimum SDK: API 26 (Android 8.0 Oreo) or higher
- Name your app something like StepTrackerWear
After the project is created, clean up your MainActivity.kt and theme if needed.
📦 Step 2: Add Required Dependencies
In your build.gradle(:app), ensure these dependencies are present:
// ViewModel for Compose
implementation("androidx.lifecycle:lifecycle-viewmodel-compose:2.9.0")
// ViewModel for Android application (used with Application context)
implementation("androidx.lifecycle:lifecycle-viewmodel:2.9.0")
// If you use LiveData or lifecycle-aware components (optional)
implementation("androidx.lifecycle:lifecycle-livedata-ktx:2.9.0")
Sync your project after making changes.
🧠 Step 3: Create the ViewModel for Step Tracking
We'll create a StepCounterViewModel that listens to the step sensor and holds the step count using mutableIntStateOf.
class StepCounterViewModel(application: Application) : AndroidViewModel(application), SensorEventListener {
private val sensorManager = application.getSystemService(Context.SENSOR_SERVICE) as SensorManager
private val stepSensor = sensorManager.getDefaultSensor(Sensor.TYPE_STEP_COUNTER)
private val _steps = mutableIntStateOf(0)
val steps: IntState get() = _steps // ✅ Correct
private var initialSteps: Float = -1f
fun startTracking() {
stepSensor?.let {
sensorManager.registerListener(this, it, SensorManager.SENSOR_DELAY_UI)
}
}
override fun onSensorChanged(event: SensorEvent?) {
event?.let {
if (initialSteps < 0) {
initialSteps = it.values[0]
}
_steps.intValue = (it.values[0] - initialSteps).toInt()
}
}
override fun onAccuracyChanged(sensor: Sensor?, accuracy: Int) {}
}
🎓 Why mutableIntStateOf instead of mutableStateOf(0)?
Jetpack Compose introduced specialized state types like IntState for primitive types. It's more efficient and prevents unnecessary recompositions or boxing of values.
🎨 Step 4: Create the UI Screen with Compose
Now, let’s design a minimal user interface that shows the step count in real-time.
@Composable
fun StepCounterScreen(viewModel: StepCounterViewModel) {
val steps by viewModel.steps
val stepGoal = 5000
val progress = steps / stepGoal.toFloat()
Scaffold(
timeText = { TimeText() }
) {
Box(modifier = Modifier.fillMaxSize(), contentAlignment = Alignment.Center) {
Column(horizontalAlignment = Alignment.CenterHorizontally) {
Spacer(Modifier.height(18.dp))
Text("Steps", style = MaterialTheme.typography.title3)
Text("$steps", style = MaterialTheme.typography.display1)
Text("www.codingbihar.com")
CircularProgressIndicator(
progress = progress.coerceAtMost(1f),
modifier = Modifier
.padding(16.dp)
.size(100.dp),
strokeWidth = 8.dp
)
Text("Goal: $stepGoal", style = MaterialTheme.typography.title3)
}
}
}
}
This UI centers the step count and label on the screen, using Wear Compose’s layout components.
🔐 Step 5: Request ACTIVITY_RECOGNITION Permission
Step counting is considered sensitive data, so Android requires runtime permission on API 29+ (Android 10+).
Add this to your AndroidManifest.xml:
Now in your MainActivity, request it if not granted:<uses-permission android:name="android.permission.ACTIVITY_RECOGNITION" />
private val PERMISSION_REQUEST_CODE = 1001
🏗 Step 6: Finalize the MainActivity
Here’s the complete MainActivity.kt setup:
class MainActivity : ComponentActivity() {
private lateinit var viewModel: StepCounterViewModel
override fun onCreate(savedInstanceState: Bundle?) {
installSplashScreen()
super.onCreate(savedInstanceState)
viewModel = ViewModelProvider(
this,
ViewModelProvider.AndroidViewModelFactory.getInstance(application)
)[StepCounterViewModel::class.java]
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.TIRAMISU &&
ContextCompat.checkSelfPermission(this, android.Manifest.permission.ACTIVITY_RECOGNITION)
!= PackageManager.PERMISSION_GRANTED) {
ActivityCompat.requestPermissions(
this,
arrayOf(android.Manifest.permission.ACTIVITY_RECOGNITION),
1001
)
}
viewModel.startTracking()
setTheme(android.R.style.Theme_DeviceDefault)
setContent {
StepCounterScreen(viewModel)
}
}
}
Output:
🎯 Optional Enhancements
Now that the base app is ready, here are some ideas to make it even better:
🔘 Add a Goal Tracker
Set a daily step goal and use a circular progress indicator to visualize progress.
🧠 Add Persistent History
Use DataStore or Room to store step counts per day and show a history screen.
🎉 Celebrate Milestones
Use ConfettiCompose or Lottie animations to celebrate when a user hits a goal.
📱 Testing Tips
To test step detection in the Wear OS emulator, go to:
Extended Controls > Sensors > Virtual Sensors > Step Counter
You can simulate steps to check your app’s response.
On a real device, simply start walking and check the live step updates!
🏁
You’ve just built your own Step Counter App for Wear OS using Jetpack Compose! This app reads sensor data, manages permission, and displays updates in real time using modern Android architecture components.
This was a great beginner-friendly wearable project. With just a few more steps, you can turn this into a full fitness tracking app.
💡 What's Next?
If you’d like a follow-up tutorial on:
- Adding charts to show step trends
- Tracking steps while the app is closed
- Building a full health dashboard app
