Pemilih tanggal kalender

Pemilih tanggal kalender adalah kontrol drop-down yang dioptimalkan untuk memilih satu tanggal dari tampilan kalender di mana informasi kontekstual seperti hari dalam seminggu atau kepenuhan kalender penting. Anda dapat mengubah kalender untuk memberikan konteks tambahan atau membatasi tanggal yang tersedia.

Apakah ini kontrol yang tepat?

Gunakan pemilih tanggal kalender untuk memungkinkan pengguna memilih satu tanggal dari tampilan kalender kontekstual. Gunakan untuk hal-hal seperti memilih janji temu atau tanggal keberangkatan.

Untuk membiarkan pengguna memilih tanggal yang diketahui, seperti tanggal lahir, di mana konteks kalender tidak penting, pertimbangkan untuk menggunakan pemilih tanggal.

Untuk informasi selengkapnya tentang memilih kontrol yang tepat, lihat artikel Kontrol Tanggal dan Waktu.

Contoh

Titik entri menampilkan teks tempat penampung jika tanggal belum ditetapkan; jika tidak, ia menampilkan tanggal yang dipilih. Saat pengguna memilih titik entri, tampilan kalender diperluas bagi pengguna untuk membuat pilihan tanggal. Tampilan kalender melapisi UI lainnya; itu tidak mendorong UI lain keluar dari jalan.

Membuat pemilih tanggal kalender

Aplikasi Galeri WinUI 3 mencakup contoh interaktif dari sebagian besar kontrol, fitur, dan fungsi WinUI 3. Dapatkan aplikasi dari Microsoft Store atau dapatkan kode sumber di GitHub

<CalendarDatePicker x:Name="arrivalCalendarDatePicker" Header="Calendar"/>

CalendarDatePicker arrivalCalendarDatePicker = new CalendarDatePicker();
arrivalCalendarDatePicker.Header = "Calendar";

Pemilih tanggal kalender yang dihasilkan terlihat seperti ini:

Pemilih tanggal kalender memiliki CalendarView internal untuk memilih tanggal. Subset properti CalendarView, seperti IsTodayHighlighted dan FirstDayOfWeek, ada di CalendarDatePicker dan diteruskan ke CalendarView internal untuk memungkinkan Anda mengubahnya.

Namun, Anda tidak dapat mengubah SelectionMode dari CalendarView internal untuk mengizinkan beberapa pilihan. Jika Anda perlu mengizinkan pengguna memilih beberapa tanggal atau memerlukan kalender untuk selalu terlihat, pertimbangkan untuk menggunakan tampilan kalender alih-alih pemilih tanggal kalender. Lihat artikel Tampilan kalender untuk informasi selengkapnya tentang cara mengubah tampilan kalender.

Memilih tanggal

Gunakan properti Tanggal untuk mendapatkan atau mengatur tanggal yang dipilih. Secara default, properti Tanggal adalah null. Saat pengguna memilih tanggal dalam tampilan kalender, properti ini diperbarui. Pengguna dapat menghapus tanggal dengan mengklik tanggal yang dipilih dalam tampilan kalender untuk membatalkan pilihannya.

Anda dapat mengatur tanggal dalam kode Anda seperti ini.

myCalendarDatePicker.Date = new DateTime(1977, 1, 5);

Saat Anda mengatur Tanggal dalam kode, nilai dibatasi oleh properti MinDate dan MaxDate .

• Jika Tanggal lebih kecil dari MinDate, nilai diatur ke MinDate.
• Jika Tanggal lebih besar dari MaxDate, nilai diatur ke MaxDate.

Anda dapat menangani peristiwa DateChanged untuk diberi tahu saat nilai Tanggal telah berubah.

Mengatur teks header dan teks penanda tempat

Anda dapat menambahkan Header (atau label) dan Teks tempat penampung (atau watermark) ke pemilih tanggal kalender untuk memberi pengguna indikasi apa kegunaannya. Untuk mengkustomisasi tampilan header, Anda bisa mengatur properti HeaderTemplate alih-alih Header.

Teks tempat penampung default adalah "pilih tanggal". Anda dapat menghapus ini dengan mengatur properti PlaceholderText ke string kosong, atau Anda dapat menyediakan teks kustom seperti yang ditunjukkan di sini.

<CalendarDatePicker x:Name="arrivalCalendarDatePicker" Header="Arrival date"
                    PlaceholderText="Choose your arrival date"/>

UWP dan WinUI 2

API untuk kontrol ini ada di namespace Windows.UI.Xaml.Controls .

Sebaiknya gunakan WinUI 2 terbaru untuk mendapatkan gaya dan templat terbaru untuk semua kontrol. WinUI 2.2 atau yang lebih baru menyertakan templat baru untuk kontrol ini yang menggunakan sudut bulat. Untuk informasi selengkapnya, lihat Radius sudut.

Artikel terkait

• Kontrol tanggal dan waktu
• Tampilan kalender
• Pemilih tanggal
• Pemilih waktu