3 Temmuz 2020 Cuma

Kotlin-8 (Android Kotlin DatePicker & TimePicker - Kotlin ile Tarih Saat Diyaloğu)

Merhaba,

bu yazımda Android uygulamasında Kotlin ile DatePicker ve TimePicker nasıl ekleneceğini paylaşacağım. Aslında Android projelerinin içinde  hazır komponent şeklinde DatePicker ve TimePicker bulunmaktadır. Ancak burada geliştirilen uygulamada kotlin ile programatik bir şekilde DatePicker ve TimePicker diyaloğu örneklenmiştir. Uygulamada iki adet buton eklenmiştir. Bu butonlara basınca DatePicker ve TimePicker diyalog şeklinde gösterilmektedir. Daha sonra kullanıcın seçimi activity_main.xml'e eklenen textView lar aracılığıyla yine ekranda gösterilmektedir.

 

İlk olarak Android Studio aracılığıyla bir Kotlin projesi oluşturun.

 

Öncelikli olarak oluşturulan projede  activity_main.xml dosyasını LinearLayout olarak düzenleyin. Bu sayede ekrana eklenen componentler blok şeklinde gösterilecektir. activity_main.xml dosyasına 2 adet TextView ve 2 adet Button ekleyin. Butonlara tıklayınca DatePicker ve TimePicker açılacak, TextView larda ise seçilen değerler gösterilecektir.

activity_main.xml dosyasının içeriği aşağıdaki gibi olmalıdır.



<?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:gravity="center"
android:orientation="vertical"
tools:context=".MainActivity">

<TextView
android:id="@+id/dateTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:textSize="30dp" />

<TextView
android:id="@+id/timeTextView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:textSize="30dp" />

<Button
android:id="@+id/changeDateBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Change Date" />

<Button
android:id="@+id/changeTimeBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Change Time" />

</LinearLayout>


 

Uygulamanın sonraki adımlarında MainActivity.kt dosyasına geçilerek onCreate methodunda Date ve Time picker için TextView üzerinde varsayılan değer verilmiştir.



dateTextView!!.text = "--/--/----"
timeTextView!!.text = "--:--"

 

  

Yine hem TimePicker hem de DatePicker butonları için setOnClickListener methodları tanımlanarak içerisinde DatePicker ve TimePicker'ın dialog olarak gösterimi sağlanmıştır.

 

 DatePickerDialog.OnDateSetListener ile kullanıcının seçtiği tarih değeri alınarak TextView da gösterilmiştir.

 TimePickerDialog.OnTimeSetListener methodu ile de kullanıcının seçtiği zaman değeri yine TextView da gösterilmiştir.

 

MainActivity.kt dosyasının son hali aşağıdaki gibi olacaktır.



class MainActivity : AppCompatActivity() {

override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)

dateTextView!!.text = "--/--/----"
timeTextView!!.text = "--:--"

val now = Calendar.getInstance()

changeDateBtn.setOnClickListener {
val datePicker = DatePickerDialog(this,
DatePickerDialog.OnDateSetListener { view, year, month, dayOfMonth ->
dateTextView!!.text = "$dayOfMonth/$month/$year"
},
now.get(Calendar.YEAR), now.get(Calendar.MONTH), now.get(Calendar.DAY_OF_MONTH)
)
datePicker.show()
}

changeTimeBtn.setOnClickListener {

val timePicker = TimePickerDialog(this,
TimePickerDialog.OnTimeSetListener { view, hourOfDay, minute ->
timeTextView!!.text = "$hourOfDay:$minute"
},
now.get(Calendar.HOUR_OF_DAY),
now.get(Calendar.MINUTE), false)
timePicker.show()

}

}
}


 

 uygulamanın kaynak kodlarına aşağıdaki linkten ulaşabilirsiniz.

github: https://github.com/lvntyldz/tutorials/tree/master/kotlin-android-app-examples/08-date-time-picker 


Hiç yorum yok:

Yorum Gönder