Android TimePicker Using Kotlin With Example

Hello Readers! In this post, we are going to learn about android timePicker using kotlin in any android application. We will also learn about different attributes of android timePicker that can be used to customise this widget.


Tutorialwing Kotlin TimePicker Output Android TimePicker Using Kotlin

Tutorialwing Kotlin TimePicker Output

Getting Started

Android timePicker can be defined as below –

TimePicker is widget to select time in either 24-hour format or AM/PM format

Different Attributes of Android TimePicker Widget

Attributes of android TimePicker widget are –

Sr. XML Attributes Description
1 android:timePickerMode Defines look of the TimePicker widget

Some of the popular attributes of TimePicker inherited from FrameLayout are –

Sr. XML Attributes Description
1 android:foregroundGravity Sets the gravity of the foreground drawable
2 android:measureAllChildren When measuring, It specifies whether to measure all children or only those that are in visible or invisible state

Some of the popular attributes of TimePicker inherited from ViewGroup are –

Sr. XML Attributes Description
1 android:animationCache Specifies whether layout animations should create a drawing cache for their children.
2 android:layoutAnimation Specifies the layout animation to use the first time the ViewGroup is laid out
3 android:layoutMode Specifies the layout mode

Some of the popular attributes of TimePicker inherited from View are –

Sr. XML Attributes Description
1 android:background Specifies background of the view
2 android:clickable Specifies whether view is clickable or not
3 android:fadeScrollbars Specifies whether scrollbar should fade out when not in use or not
4 android:fitsSystemWindows Specifies whether to adjust view layout according to system windows
5 android:id Specifies id of the view
6 android:minHeight Specifies minimum height
7 android:minWidth Specifies minimum width
8 android:padding Specifies padding of the view
9 android:paddingBottom Specifies padding to bottom of the view
10 android:paddingEnd Specifies padding to end of the view
11 android:visibility Specifies visibility of the view

Example of Android TimePicker Using Kotlin

At first, we will create android application. Then, we will use timePicker using kotlin in the application.

1. Creating New Project in Kotlin

Follow steps below to create new project. Please ignore the steps if you have already created the project.

Step Description
1. Open Android Studio.
2. Go to File => New => New Project. Write application name as TimePicker. Then, check Include Kotlin Support and click next button.
3. Select minimum SDK you need. However, we have selected 17 as minimum SDK. Then, click next button
4. Then, select Empty Activity => click next => click finish.
5. You will get a newly created project successfully if you have followed steps properly.

Since we have a project now, we will modify xml and other files to use timePicker using kotlin in the application.

2. Modify values folder

Open res/values/strings.xml file. Then, add below code into it.

	<string name="app_name">TimePicker</string>
	<string name="selected_time">The selected time is:</string>

3. Use TimePicker Widget in xml file

Open src/main/res/layout/activity_main.xml file and add below code into it.

<?xml version="1.0" encoding="utf-8"?>




In activity_main.xml, we have defined timePicker and textView widgets in this file. Now, we will access these widgets in kotlin file to perform some operations on it.

4. Access TimePicker Widget in Kotlin file

Open src/main/java/com.tutorialwing.timepicker/MainActivity.kt file and add below code into it.

package com.tutorialwing.timepicker

import android.os.Bundle
import android.view.View
import android.widget.TextView
import android.widget.TimePicker

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {


    private fun getSelectedTime() {
        val textView = findViewById<TextView>(
        val timePicker = findViewById<TimePicker>(
        timePicker.setOnTimeChangedListener { _, hourOfDay, minute ->
            var hourOfDay = hourOfDay

            var format = ""
            when {
                hourOfDay == 0 -> {
                    hourOfDay += 12
                    format = "AM"
                hourOfDay == 12 -> format = "PM"
                hourOfDay > 12 -> {
                    hourOfDay -= 12
                    format = "PM"
                else -> format = "AM"

            if (textView != null) {
                val hour = if (hourOfDay < 10) "0" + hourOfDay else hourOfDay
                val min = if (minute < 10) "0" + minute else minute

                val text = getString(R.string.selected_time) + " " + hour + " : " + min + " " + format
                textView.text = text
                textView.visibility = View.VISIBLE

We have accessed textView and timePicker using kotlin file (i.e. MainActivity.kt file). Then, we have set time change listener to show selected time in textView. There are also some calculation to get the time in proper format.

Since AndroidManifest.xml file is very important in any android application, we are also going to see the content inside this file.

AndroidManifest.xml file

Code inside main/AndroidManifest.xml file is as below.

<?xml version="1.0" encoding="utf-8"?>
<manifest package="com.tutorialwing.timepicker"

		<activity android:name=".MainActivity">
				<action android:name="android.intent.action.MAIN"/>

				<category android:name="android.intent.category.LAUNCHER"/>


When we run the program, we will get output as shown above.

That’s end of our tutorial on Android TimePicker using Kotlin.