TimePicker Dialog has two mode spinner and clock ,Lets see an example .
XML Layout
- Create XML Layout activity_main.xml , this will be set as content view for launcher Activity (MainActivity.kt) .
- Add Button to your layout file
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".MainActivity" android:gravity="center_horizontal"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/selectedTime" android:textSize="22sp" android:gravity="center"/> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Select Time" android:id="@+id/selectTime"/> </LinearLayout>
TImePicker Dialog
- TimePickerDialog : Creates a new time picker dialog for the given date.
- TimeFormat : TimePickerDialog has a boolena is24HourView , whether to show 24 hour view or AM/PM .true to show 24Hr View , false to show AM/PM View
- TimePickerDialog.OnTimeSetListener is used to listen time select event .when user selects date onTimeSet callback is called .
val mTimePicker: TimePickerDialog val mcurrentTime = Calendar.getInstance() val hour = mcurrentTime.get(Calendar.HOUR_OF_DAY) val minute = mcurrentTime.get(Calendar.MINUTE) mTimePicker = TimePickerDialog(this, object : TimePickerDialog.OnTimeSetListener { override fun onTimeSet(view: TimePicker?, hourOfDay: Int, minute: Int) { selectedTime.setText(String.format("%d : %d", hourOfDay, minute)) } }, hour, minute, false)
TimePickerDialog Style .
accentColor of basetheme is applied to DialogHeader and button .
TimePickerDialog Mode .
TimePicker Dialog has two mode clock and spinner. use android:timePickerMode property to set the mode
<resources> <!-- Base application theme. --> <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar"> <!-- Customize your theme here. --> <item name="colorPrimary">@color/colorPrimary</item> <item name="colorPrimaryDark">@color/colorPrimaryDark</item> <item name="colorAccent">@color/colorAccent</item> <item name="android:timePickerStyle">@style/MyTimePickerTheme</item> </style> <style name="MyTimePickerTheme" parent="android:Widget.Material.Light.TimePicker"> <item name="android:timePickerMode">clock</item> </style> </resources>
1. Clock Mode
<item name="android:timePickerMode">clock</item>
2. Spinner Mode
<item name="android:timePickerMode">spinner</item>
Activity
- Create a koltin class MainActivity.kt and extend it to AppCompatActivity class .
- Override onCreate function and set the content of this MainActivity with above defined xml layout (activity_main.xml).
- On Button Click show TimePickerDialog.
package com.tutorialsbuzz.androidtimepicker import android.app.TimePickerDialog import android.os.Bundle import android.widget.TimePicker import androidx.appcompat.app.AppCompatActivity import kotlinx.android.synthetic.main.activity_main.* import java.util.* class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) val mTimePicker: TimePickerDialog val mcurrentTime = Calendar.getInstance() val hour = mcurrentTime.get(Calendar.HOUR_OF_DAY) val minute = mcurrentTime.get(Calendar.MINUTE) mTimePicker = TimePickerDialog(this, object : TimePickerDialog.OnTimeSetListener { override fun onTimeSet(view: TimePicker?, hourOfDay: Int, minute: Int) { selectedTime.setText(String.format("%d : %d", hourOfDay, minute)) } }, hour, minute, false) selectTime.setOnClickListener({ v -> mTimePicker.show() }) } }
No comments:
Post a Comment