সময় বাছাইকারী

টাইম পিকার ব্যবহারকারীদের সময় নির্বাচন করার একটি উপায় প্রদান করে। আপনার অ্যাপে একটি টাইম পিকার বাস্তবায়ন করতে আপনি 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")
        }
    }
}

এই কোড অংশে নিম্নলিখিত বিষয়গুলো বিবেচনা করুন:

  • Calendar.getInstance() বর্তমান সময় দিয়ে TimePickerState ইনিশিয়ালাইজ করে।
    • এই উদাহরণে java.util.Calendar ব্যবহার করা হয়েছে। সব অ্যান্ড্রয়েড সংস্করণে বিকল্প হিসেবে java.time.LocalTime ব্যবহার করার জন্য আপনার প্রোজেক্টে Java 8+ API desugaring সক্রিয় করুন।
  • 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")
        }
    }
}

এই বাস্তবায়নের ক্ষেত্রে লক্ষণীয় গুরুত্বপূর্ণ বিষয়গুলো হলো:

  • এর গঠনটি মূলত ডায়াল টাইম পিকারের মতোই, তবে প্রধান পার্থক্য হলো 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")
        }
    }
}

তারপর আপনি কম্পোজেবলটিকে এইভাবে কল করতে পারেন:

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.")
}

আরও বিস্তারিত জানতে, স্নিপেটস অ্যাপে সম্পূর্ণ বাস্তবায়নটি দেখুন।

অতিরিক্ত সম্পদ