Many of us have used the step counter on our phones while we go for walk or run. It counts the total steps that the user has walked and displays it on the screen. The other name for the step counter is a pedometer. But have you ever thought about how can an app count our steps? What is the coding behind the working of this app? Let’s find the answer to these questions by making one.
What are we going to build in this article?
We will be building an application that displays the steps that the user has walked. We will use TextView in our XML file which will show the step count and a heading on the screen, and one ImageView for displaying the circle around the text. When the user will tap for a long time on the screen it will get reset to 0. A sample GIF is given below to get an idea about what we are going to do in this article. Note that we are going to implement the application using the Kotlin language.
Step by Step Implementation
Step 1: Create a New Project
To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Kotlin as the programming language.
Step 2: Working with AndroidManifest.xml for taking permission from the user
Navigate to the app/manifests/AndroidManifest.xml and write the code given below in the manifest for taking the user permission for Activity Recognition:
Step 3: Adding a drawable resource file
Navigate to app/res/drawable and right-click on the drawable folder and go to New/Drawable Resource File.
Name the file as the circle and with the default settings, click on the ok button.
Step 4: Working with drawable resource file
In this step, we will add the code to the resource file. We are making a circular stroke to use it, in the ImageView in the main XML file of the app. Below is the code for the circle.xml resource file that we made It in the previous step.
Step 5: Working with the activity_main.xml file
Navigate to the app/res/layout/activity_main.xml and add the below code to that file. Below is the code for the activity_main.xml file.
Step 6: Working with the MainActivity.kt file
Go to the MainActivity.kt file and refer to the following code. Below is the code for the MainActivity.kt file. Comments are added inside the code to understand the code in more detail.
Now run the app and see the output of the code below:
Note: We have to allow the permission required for the app by going to app settings and then enabling it. It will not count the steps in the emulator, you have to use a real android device to test it.