Wear OS-এ তালিকা তৈরি করা

Compose-এর মাধ্যমে চেষ্টা করুন
Wear OS-এ Jetpack Compose হল Wear OS-এর জন্য সাজেস্ট করা UI টুলকিট।

তালিকা ব্যবহারকারীদের Wear OS ডিভাইসে সহজেই পছন্দের সেট থেকে একটি আইটেম বেছে নিতে দেয়।

Wearable UI লাইব্রেরিতে WearableRecyclerView ক্লাস অন্তর্ভুক্ত থাকে, যা RecyclerView ইমপ্লিমেন্টেশনের মাধ্যমে পরে থাকা যায় এমন ডিভাইসের জন্য অপ্টিমাইজ করা তালিকা তৈরি করে। আপনি নতুন WearableRecyclerView কন্টেনার তৈরি করে আপনার ওয়্যারেবল অ্যাপে এই ইন্টারফেস ব্যবহার করতে পারবেন।

সহজ আইটেমের দীর্ঘ তালিকার জন্য WearableRecyclerView ব্যবহার করুন, যেমন অ্যাপ্লিকেশন লঞ্চার বা পরিচিতির তালিকা। প্রতিটি আইটেমে একটি ছোট স্ট্রিং এবং একটি সংশ্লিষ্ট আইকন থাকতে পারে। বিকল্প হিসেবে, প্রতিটি আইটেমে শুধু একটি স্ট্রিং বা আইকন থাকতে পারে।

মনে রাখবেন: জটিল লেআউট এড়িয়ে চলুন। ব্যবহারকারীদের কোনও আইটেম কী তা বোঝার জন্য শুধুমাত্র এক নজরে দেখতে হবে, বিশেষ করে হালকা ও ছোট ডিভাইসের সীমিত স্ক্রিন সাইজের ক্ষেত্রে।

আগে থেকে থাকা RecyclerView ক্লাসকে এক্সটেন্ড করার মাধ্যমে, WearableRecyclerView API ডিফল্ট হিসেবে একটি সোজা তালিকায় আইটেমের উল্লম্বভাবে স্ক্রল করা যায় এমন তালিকা দেখায়। এছাড়াও, আপনি WearableRecyclerView API ব্যবহার করে আপনার ওয়্যারেবল অ্যাপে কার্ভড লেআউট ও সার্কুলার স্ক্রলিং জেসচার চালু করতে পারবেন।

ছবি ১. Wear OS-এ ডিফল্ট তালিকা ভিউ।

এই নির্দেশিকা আপনাকে দেখায় কীভাবে WearableRecyclerView ক্লাস ব্যবহার করে আপনার Wear OS অ্যাপে তালিকা তৈরি করতে হয়, কীভাবে আপনার স্ক্রোলযোগ্য আইটেমগুলির জন্য একটি কার্ভড লেআউট বেছে নিতে হয় এবং স্ক্রোল করার সময় চিলড্রেনের চেহারা কীভাবে কাস্টমাইজ করতে হয়।

XML ব্যবহার করে কোনও অ্যাক্টিভিটিতে WearableRecyclerView যোগ করা

নিম্নলিখিত লেআউটটি কোনও অ্যাক্টিভিটিতে WearableRecyclerView যোগ করে:

<androidx.wear.widget.WearableRecyclerView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/recycler_launcher_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scrollbars="vertical" />

নিম্নলিখিত উদাহরণে দেখানো হয়েছে যে কীভাবে WearableRecyclerView কোনও অ্যাক্টিভিটিতে প্রয়োগ করা হয়:

Kotlin

class MainActivity : Activity() {

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

জাভা

public class MainActivity extends Activity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }
    ...
}

কার্ভড লেআউট তৈরি করুন

আপনার ওয়্যারেবল অ্যাপে স্ক্রল করা যায় এমন আইটেমের জন্য কার্ভড লেআউট তৈরি করতে, নিম্নলিখিত ধাপগুলি অনুসরণ করুন:

  • প্রাসঙ্গিক XML লেআউটে আপনার প্রধান কন্টেনার হিসেবে WearableRecyclerView ব্যবহার করুন।
  • setEdgeItemsCenteringEnabled(boolean) পদ্ধতি true-এ সেট করুন। এটি স্ক্রিনে তালিকার প্রথম ও শেষ আইটেমকে উল্লম্বভাবে মাঝখানে নিয়ে আসে।
  • স্ক্রিনে আইটেমের লেআউট সেট করতে WearableRecyclerView.setLayoutManager() পদ্ধতি ব্যবহার করুন।

Kotlin

wearableRecyclerView.apply {
    // To align the edge children (first and last) with the center of the screen.
    isEdgeItemsCenteringEnabled = true
    ...
    layoutManager = WearableLinearLayoutManager(this@MainActivity)
}

জাভা

// To align the edge children (first and last) with the center of the screen.
wearableRecyclerView.setEdgeItemsCenteringEnabled(true);
...
wearableRecyclerView.setLayoutManager(
                new WearableLinearLayoutManager(this));

স্ক্রল করার সময় চিলড্রেনের চেহারা কাস্টমাইজ করার জন্য আপনার অ্যাপের নির্দিষ্ট প্রয়োজনীয়তা থাকলে—যেমন, আইটেমগুলি কেন্দ্র থেকে স্ক্রল করে দূরে সরে যাওয়ার সময় আইকন এবং টেক্সট স্কেল করা— WearableLinearLayoutManager.LayoutCallback ক্লাস এক্সটেন্ড করুন এবং onLayoutFinished পদ্ধতি ওভাররাইড করুন।

নিম্নলিখিত কোড স্নিপেট থেকে আইটেমের স্ক্রলিং কাস্টমাইজ করার উদাহরণ দেখানো হয়েছে যাতে WearableLinearLayoutManager.LayoutCallback ক্লাস বাড়িয়ে সেন্টার থেকে আরও দূরে স্কেল করা যায়:

Kotlin

/** How much icons should scale, at most.  */
private const val MAX_ICON_PROGRESS = 0.65f

class CustomScrollingLayoutCallback : WearableLinearLayoutManager.LayoutCallback() {

    private var progressToCenter: Float = 0f

    override fun onLayoutFinished(child: View, parent: RecyclerView) {
        child.apply {
            // Figure out % progress from top to bottom.
            val centerOffset = height.toFloat() / 2.0f / parent.height.toFloat()
            val yRelativeToCenterOffset = y / parent.height + centerOffset

            // Normalize for center.
            progressToCenter = Math.abs(0.5f - yRelativeToCenterOffset)
            // Adjust to the maximum scale.
            progressToCenter = Math.min(progressToCenter, MAX_ICON_PROGRESS)

            scaleX = 1 - progressToCenter
            scaleY = 1 - progressToCenter
        }
    }
}

জাভা

public class CustomScrollingLayoutCallback extends WearableLinearLayoutManager.LayoutCallback {
    /** How much icons should scale, at most. */
    private static final float MAX_ICON_PROGRESS = 0.65f;

    private float progressToCenter;

    @Override
    public void onLayoutFinished(View child, RecyclerView parent) {

        // Figure out % progress from top to bottom.
        float centerOffset = ((float) child.getHeight() / 2.0f) / (float) parent.getHeight();
        float yRelativeToCenterOffset = (child.getY() / parent.getHeight()) + centerOffset;

        // Normalize for center.
        progressToCenter = Math.abs(0.5f - yRelativeToCenterOffset);
        // Adjust to the maximum scale.
        progressToCenter = Math.min(progressToCenter, MAX_ICON_PROGRESS);

        child.setScaleX(1 - progressToCenter);
        child.setScaleY(1 - progressToCenter);
    }
}

Kotlin

wearableRecyclerView.layoutManager =
        WearableLinearLayoutManager(this, CustomScrollingLayoutCallback())

জাভা

CustomScrollingLayoutCallback customScrollingLayoutCallback =
                new CustomScrollingLayoutCallback();
wearableRecyclerView.setLayoutManager(
                new WearableLinearLayoutManager(this, customScrollingLayoutCallback));