রচনা সহ ঘূর্ণমান ইনপুট

রোটারি ইনপুট বলতে আপনার ঘড়ির সেইসব অংশ থেকে আসা ইনপুটকে বোঝায় যা ঘোরে বা আবর্তন করে। গড়ে, ব্যবহারকারীরা তাদের ঘড়ির সাথে ইন্টারঅ্যাক্ট করতে মাত্র কয়েক সেকেন্ড ব্যয় করেন। আপনি রোটারি ইনপুট ব্যবহার করে আপনার ব্যবহারকারীকে দ্রুত বিভিন্ন কাজ সম্পন্ন করার সুযোগ দিয়ে তার ইউজার এক্সপেরিয়েন্স উন্নত করতে পারেন।

বেশিরভাগ ঘড়িতে রোটারি ইনপুটের তিনটি প্রধান উৎস হলো ঘূর্ণায়মান পাশের বোতাম (RSB), এবং একটি ফিজিক্যাল বেজেল বা টাচ বেজেল, যা স্ক্রিনের চারপাশে একটি বৃত্তাকার স্পর্শযোগ্য স্থান। যদিও ইনপুটের ধরনের উপর ভিত্তি করে প্রত্যাশিত আচরণ ভিন্ন হতে পারে, সমস্ত অপরিহার্য ইন্টারঅ্যাকশনের জন্য রোটারি ইনপুট সমর্থন করা নিশ্চিত করুন।

স্ক্রোল সূচক

বেশিরভাগ ব্যবহারকারীই আশা করেন যে অ্যাপগুলো স্ক্রল জেসচার সমর্থন করবে। স্ক্রিনে কন্টেন্ট স্ক্রল হওয়ার সময়, ঘূর্ণনমূলক ইন্টারঅ্যাকশনের প্রতিক্রিয়ায় ব্যবহারকারীদের ভিজ্যুয়াল ফিডব্যাক দিন। ভিজ্যুয়াল ফিডব্যাকের মধ্যে ভার্টিকাল স্ক্রলের জন্য স্ক্রলিং ইন্ডিকেটর অথবা পেজ ইন্ডিকেটর অন্তর্ভুক্ত থাকতে পারে।

ScalingLazyColumn , TransformingLazyColumn এবং Picker ডিফল্টভাবে স্ক্রল জেসচার সাপোর্ট করে, যদি আপনি এই কম্পোনেন্টগুলোকে AppScaffold এবং ScreenScaffold ভেতরে রাখেন এবং ScreenScaffold ও কম্পোনেন্টের (যেমন একটি TransformingLazyColumn ) মধ্যে লিস্ট স্টেট পাস করেন।

AppScaffold এবং ScreenScaffold Wear OS অ্যাপের জন্য মৌলিক লেআউট কাঠামো প্রদান করে এবং এতে আগে থেকেই একটি ডিফল্ট ইমপ্লিমেন্টেশনসহ স্ক্রল ইন্ডিকেটরের জন্য জায়গা রয়েছে। স্ক্রলিং প্রগ্রেস কাস্টমাইজ করতে, লিস্ট স্টেট অবজেক্টের উপর ভিত্তি করে একটি স্ক্রল ইন্ডিকেটর তৈরি করুন, যেমনটি নিম্নলিখিত কোড স্নিপেটে দেখানো হয়েছে: 

val listState = rememberTransformingLazyColumnState()
ScreenScaffold(
    scrollState = listState,
    scrollIndicator = {
        ScrollIndicator(state = listState)
    }
) {
    // ...
}
Rotary.kt

আপনি ScalingLazyColumnDefaults.snapFlingBehavior ব্যবহার করে ScalingLazyColumn জন্য একটি স্ন্যাপ বিহেভিয়ার কনফিগার করতে পারেন, যেমনটি নিম্নলিখিত কোড স্নিপেটে দেখানো হয়েছে: 

val listState = rememberScalingLazyListState()
ScreenScaffold(
    scrollState = listState,
    scrollIndicator = {
        ScrollIndicator(state = listState)
    }
) {

    val state = rememberScalingLazyListState()
    ScalingLazyColumn(
        modifier = Modifier.fillMaxWidth(),
        state = state,
        flingBehavior = ScalingLazyColumnDefaults.snapFlingBehavior(state = state)
    ) {
        // Content goes here
        // ...
    }
}
Rotary.kt

কাস্টম অ্যাকশন

আপনি আপনার অ্যাপে রোটারি ইনপুটের প্রতিক্রিয়া হিসেবে কাস্টম অ্যাকশনও তৈরি করতে পারেন। উদাহরণস্বরূপ, একটি মিডিয়া অ্যাপে জুম ইন ও আউট করতে বা ভলিউম নিয়ন্ত্রণ করতে রোটারি ইনপুট ব্যবহার করুন।

যদি আপনার কম্পোনেন্টটি ভলিউম কন্ট্রোলের মতো স্ক্রলিং ইভেন্টগুলো স্বাভাবিকভাবে সমর্থন না করে, তাহলে আপনি নিজেই স্ক্রল ইভেন্টগুলো পরিচালনা করতে পারেন।

প্রথম ধাপ হলো ভিউ মডেলে পরিচালিত একটি কাস্টম স্টেট এবং রোটারি স্ক্রল ইভেন্টগুলো প্রসেস করার জন্য একটি কাস্টম কলব্যাক তৈরি করা। 

class VolumeRange(
    val max: Int = 10,
    val min: Int = 0
)

private object VolumeViewModel {
    class MyViewModel : ViewModel() {
        private val _volumeState = mutableIntStateOf(0)
        val volumeState: State<Int>
            get() = _volumeState

        // ...
        fun onVolumeChangeByScroll(pixels: Float) {
            _volumeState.value = when {
                pixels > 0 -> minOf(volumeState.value + 1, VolumeRange().max)
                pixels < 0 -> maxOf(volumeState.value - 1, VolumeRange().min)
                else -> volumeState.value
            }
        }
    }
}
Rotary.kt

তারপর, ইভেন্টগুলো পাওয়ার পর কলব্যাকটি ব্যবহার করুন, যেমনটি নিচের কোড স্নিপেটে দেখানো হয়েছে। 

val focusRequester: FocusRequester = remember { FocusRequester() }
val volumeViewModel: VolumeViewModel.MyViewModel =
    viewModel()
val volumeState by volumeViewModel.volumeState

TransformingLazyColumn(
    modifier = Modifier
        .fillMaxSize()
        .onRotaryScrollEvent {
            volumeViewModel.onVolumeChangeByScroll(it.verticalScrollPixels)
            true
        }
        .focusRequester(focusRequester)
        .focusable(),
) {
    // You can use volumeState here, for example:
    item {
        Text("Volume: $volumeState")
    }
}
Rotary.kt

উল্লেখ্য যে, সরলতার স্বার্থে পূর্ববর্তী উদাহরণে এমন পিক্সেল মান ব্যবহার করা হয়েছে, যা বাস্তবে ব্যবহার করা হলে অতিরিক্ত সংবেদনশীল হওয়ার সম্ভাবনা রয়েছে।

{% হুবহু %} {% endverbatim %} {% হুবহু %} {% endverbatim %}