टाइम पिकर

टाइम पिकर की मदद से उपयोगकर्ता समय चुन सकते हैं. आप समय लागू करने के लिए, TimePicker और TimeInput कंपोज़ेबल का इस्तेमाल करें पिकर की सुविधा का इस्तेमाल करें.

ध्यान दें: TimePicker और TimeInput एक्सपेरिमेंट के तौर पर उपलब्ध हैं. यहां बताई गई किसी भी समस्या के बारे में बताएं समस्या को ट्रैक करने वाला टूल.

प्रकार

टाइम पिकर दो तरह के होते हैं:

• डायल: इससे उपयोगकर्ता, हैंडल को डायल के आस-पास मूव करके समय सेट कर सकते हैं.
• इनपुट: इसकी मदद से उपयोगकर्ता, अपने कीबोर्ड का इस्तेमाल करके समय सेट कर सकते हैं.

नीचे दी गई इमेज में, बाईं ओर डायल टाइम पिकर का उदाहरण दिया गया है. दाईं ओर एक इनपुट समय पिकर:

पहली इमेज. डायल और इनपुट टाइम पिकर.

एपीआई प्लैटफ़ॉर्म

टाइम पिकर लागू करने के लिए, TimePicker या TimeInput का इस्तेमाल करें कंपोज़ेबल:

• TimePicker: यह सुविधा, डायल टाइम पिकर की सुविधा का इस्तेमाल करती है.
• TimeInput: यह इनपुट टाइम पिकर को लागू करता है.

ध्यान दें: ये अलग-अलग कॉम्पोनेंट दिखाते हैं. हालांकि, TimePicker और TimeInput अलग-अलग कॉम्पोनेंट दिखाते हैं पैरामीटर के हिसाब से, ये कंपोज़ेबल. इसलिए, वे बड़े पैमाने पर एक-दूसरे की जगह इस्तेमाल किया जा सकता है.

राज्य

TimePicker और TimeInput दोनों के लिए, आपको एक TimePickerState. इससे आपको दिखाई देने वाला डिफ़ॉल्ट रूप से चुना गया समय सेट करने में मदद मिलती है चुनने की सुविधा देता है. यह उस समय की जानकारी भी देता है जो उपयोगकर्ता ने पिकर.

डायलॉग

टाइम पिकर, डायलॉग बॉक्स में दिखते हैं. इस गाइड में दिए गए उदाहरणों में डायलॉग का इस्तेमाल नहीं किया गया है. डायलॉग बॉक्स का इस्तेमाल करने वाले उदाहरणों के लिए, टाइम पिकर के लिए डायलॉग गाइड देखें.

डायल टाइम पिकर

इस स्निपेट में, बेसिक डायल टाइम पिकर को लागू करने का तरीका बताया गया है.

@Composable
fun DialExample(
    onConfirm: () -> Unit,
    onDismiss: () -> Unit,
) {
    val currentTime = Calendar.getInstance()

    val timePickerState = rememberTimePickerState(
        initialHour = currentTime.get(Calendar.HOUR_OF_DAY),
        initialMinute = currentTime.get(Calendar.MINUTE),
        is24Hour = true,
    )

    Column {
        TimePicker(
            state = timePickerState,
        )
        Button(onClick = onDismiss) {
            Text("Dismiss picker")
        }
        Button(onClick = onConfirm) {
            Text("Confirm selection")
        }
    }
}
TimePickers.kt

इस स्निपेट में, यहां दी गई बातों का ध्यान रखें:

• Calendar.getInstance(), TimePickerState को मौजूदा वैल्यू से शुरू करता है समय.
  • इस उदाहरण में java.util.Calendar का इस्तेमाल किया गया है. Java चालू करें वैकल्पिक रूप से इस्तेमाल करने के लिए, आपके प्रोजेक्ट में 8+ एपीआई डिज़ाइन Android के सभी वर्शन पर java.time.LocalTime.
• TimePicker कंपोज़ेबल, टाइम पिकर को दिखाता है. यह टूल, पैरामीटर के तौर पर timePickerState.
• लागू करने के प्रोसेस में दो बटन शामिल होते हैं: पहला, चुने गए विकल्प की पुष्टि करने के लिए और पिकर खारिज करने के लिए दूसरा.

यह लागू होने का तरीका इस तरह दिखता है:

दूसरी इमेज. डायल टाइम पिकर.

इनपुट समय चुनने वाला विजेट

इस स्निपेट में बेसिक इनपुट स्टाइल टाइम पिकर को लागू करने का तरीका बताया गया है.

@Composable
fun InputExample(
    onConfirm: () -> Unit,
    onDismiss: () -> Unit,
) {
    val currentTime = Calendar.getInstance()

    val timePickerState = rememberTimePickerState(
        initialHour = currentTime.get(Calendar.HOUR_OF_DAY),
        initialMinute = currentTime.get(Calendar.MINUTE),
        is24Hour = true,
    )

    Column {
        TimeInput(
            state = timePickerState,
        )
        Button(onClick = onDismiss) {
            Text("Dismiss picker")
        }
        Button(onClick = onConfirm) {
            Text("Confirm selection")
        }
    }
}
TimePickers.kt

इस तरीके को लागू करते समय ध्यान रखने लायक ज़रूरी बातें:

• इसमें डायल टाइम पिकर भी पहले जैसा ही है. TimePicker के बजाय TimeInput के इस्तेमाल में अंतर है.
• timePickerState के लिए is24Hour पैरामीटर साफ़ तौर पर true पर सेट किया गया है. डिफ़ॉल्ट रूप से, यह वैल्यू false है.

यह लागू होने का तरीका इस तरह दिखता है:

तीसरी इमेज. इनपुट टाइम पिकर.

राज्य का इस्तेमाल करें

उपयोगकर्ता ने जो समय पिकर में चुना है उसका इस्तेमाल करने के लिए, आपके onConfirm फ़ंक्शन में सही TimePickerState. माता-पिता इसके बाद, कंपोज़ेबल TimePickerState.hour तक चुने गए समय को ऐक्सेस कर सकता है और TimePickerState.minute.

नीचे दिए गए स्निपेट में बताया गया है कि इसे कैसे किया जाए:

@Composable
fun DialUseStateExample(
    onConfirm: (TimePickerState) -> Unit,
    onDismiss: () -> Unit,
) {
    val currentTime = Calendar.getInstance()

    val timePickerState = rememberTimePickerState(
        initialHour = currentTime.get(Calendar.HOUR_OF_DAY),
        initialMinute = currentTime.get(Calendar.MINUTE),
        is24Hour = true,
    )

    Column {
        TimePicker(
            state = timePickerState,
        )
        Button(onClick = onDismiss) {
            Text("Dismiss picker")
        }
        Button(onClick = { onConfirm(timePickerState) }) {
            Text("Confirm selection")
        }
    }
}
TimePickers.kt

इसके बाद, कंपोज़ेबल को इस तरह कॉल किया जा सकता है:

var selectedTime: TimePickerState? by remember { mutableStateOf(null) }

// ...

DialUseStateExample(
    onDismiss = {
        showDialExample = false
    },
    onConfirm = {
            time ->
        selectedTime = time
        showDialExample = false
    },
)

// ...

if (selectedTime != null) {
    val cal = Calendar.getInstance()
    cal.set(Calendar.HOUR_OF_DAY, selectedTime!!.hour)
    cal.set(Calendar.MINUTE, selectedTime!!.minute)
    cal.isLenient = false
    Text("Selected time = ${formatter.format(cal.time)}")
} else {
    Text("No time selected.")
}

ज़्यादा जानकारी के लिए, स्निपेट में पूरा इंप्लिमेंटेशन देखें ऐप्लिकेशन है.

अन्य संसाधन

• TimePicker
• मटीरियल डिज़ाइन - टाइम पिकर