ড্র্যাগ করে ড্রপ করুন

Jetpack Compose-এ দুটি মডিফায়ার সহ ড্র্যাগ অ্যান্ড ড্রপ কাজ করে:

  • dragAndDropSource: ড্র্যাগ জেসচারের শুরুর পয়েন্ট হিসেবে কম্পোজ করার উপযুক্ত আইটেম নির্দিষ্ট করে
  • dragAndDropTarget: ড্রপ করা ডেটা গ্রহণ করে এমন একটি কম্পোজ করার উপযুক্ত আইটেম নির্দিষ্ট করে

যেমন, আপনার অ্যাপে ব্যবহারকারীদের কোনও ছবি টেনে আনার সুবিধা দিতে, একটি image composable তৈরি করুন এবং dragAndDropSource মডিফায়ার যোগ করুন। ড্রপ টার্গেট সেট-আপ করতে, আরেকটি কম্পোজ করা যায় এমন ছবি তৈরি করুন এবং dragAndDropTarget মডিফায়ার যোগ করুন।

মডিফায়ার একাধিক ড্র্যাগ সোর্স ও একাধিক ড্রপ টার্গেটে প্রয়োগ করা যেতে পারে।

মডিফায়ার, ClipData ব্যবহার করে দুই বা তার বেশি কম্পোজেবল আইটেমের মধ্যে ডেটা শেয়ার করার জন্য অ্যাপকে অনুমতি দেয়, যা View ইমপ্লিমেন্টেশনের সাথে ইন্টার-অপারেবল।

ড্র্যাগ সোর্স নির্দিষ্ট করুন

কোনও কম্পোনেন্টের মধ্যে ড্র্যাগ ইভেন্ট চালু করতে, dragAndDropSource মডিফায়ার যোগ করুন। এটি প্যারামিটার হিসেবে একটি ফাংশন নেয়। এই ফাংশনের মধ্যে, ট্রান্সফার করা যায় এমন ডেটা বোঝাতে DragAndDropTransferData ব্যবহার করুন। ডেটা রিমোট URI, ক্লিপবোর্ডে থাকা রিচ টেক্সট ডেটা, লোকাল ফাইল বা আরও অনেক কিছু হতে পারে, কিন্তু সেগুলিকে ClipData অবজেক্টে র‍্যাপ করতে হবে। প্লেন টেক্সট দাও, যেমন নিচে দেওয়া হল:

Modifier.dragAndDropSource { _ ->
    DragAndDropTransferData(
        ClipData.newPlainText(
            "image Url", url
        )
    )
}

অ্যাপের বর্ডার ক্রস করে ড্র্যাগ অ্যাকশন করার অনুমতি দিতে, DragAndDropTransferData কনস্ট্রাক্টর একটি flags আর্গুমেন্ট গ্রহণ করে। নিচে দেওয়া উদাহরণে, DRAG_FLAG_GLOBAL কনস্ট্যান্ট নির্দিষ্ট করে যে ডেটা একটি অ্যাপ থেকে অন্য অ্যাপে ড্র্যাগ করা যাবে:

Modifier.dragAndDropSource { _ ->
    DragAndDropTransferData(
        ClipData.newPlainText(
            "image Url", url
        ),
        flags = View.DRAG_FLAG_GLOBAL
    )
}

DragAndDropTransferData Android ভিউ সিস্টেমের সাথে মানানসই ফ্ল্যাগ গ্রহণ করে। উপলভ্য ফ্ল্যাগের সম্পূর্ণ তালিকা পেতে View কনস্ট্যান্টের তালিকা দেখুন।

ড্রপ ডেটা পাওয়া

ড্র্যাগ-অ্যান্ড-ড্রপ ইভেন্ট গ্রহণ করার জন্য কম্পোজ করার উপযুক্ত আইটেমকে dragAndDropTarget মডিফায়ার অ্যাসাইন করুন। মডিফায়ারের দুটি প্যারামিটার আছে: প্রথমটি ফিল্টার হিসেবে কাজ করে এবং মডিফায়ার যে ধরনের ডেটা গ্রহণ করতে পারে তা নির্দিষ্ট করে এবং দ্বিতীয়টি কলব্যাকে ডেটা ডেলিভার করে।

মনে রাখবেন যে কলব্যাক ইনস্ট্যান্স মনে রাখতে হবে। নিচের স্নিপেটে দেখানো হয়েছে কীভাবে কলব্যাক মনে রাখতে হয়:

val callback = remember {
    object : DragAndDropTarget {
        override fun onDrop(event: DragAndDropEvent): Boolean {
            // Parse received data
            return true
        }
    }
}

অন্যান্য অ্যাপ থেকে ডেটা গ্রহণ করতে, requestDragAndDropPermission ব্যবহার করে গ্রহণ করার সুবিধা চালু করুন এবং হয়ে গেলে সেটি ছেড়ে দিন:

val externalAppCallback = remember {
    object : DragAndDropTarget {
        override fun onDrop(event: DragAndDropEvent): Boolean {
            val permission =
                activity.requestDragAndDropPermissions(event.toAndroidDragEvent())
            // Parse received data
            permission?.release()
            return true
        }
    }
}

এটি মনে রাখা গুরুত্বপূর্ণ যে Compose কলব্যাক থেকে পাওয়া DragAndDropEvent, requestDragAndDropPermission মেথডের প্রত্যাশিত -এর থেকে আলাদা, তাই অনুমতি সংক্রান্ত অনুরোধে পাঠানোর আগে আপনাকে প্যারামিটারে toAndroidDragEvent() এক্সটেনশন ফাংশন কল করতে হবে।

পরের স্নিপেটে দেখানো হয়েছে যে কীভাবে ড্রপ করা সাধারণ টেক্সট ম্যানেজ করতে হয়:

Modifier.dragAndDropTarget(
    shouldStartDragAndDrop = { event ->
        event.mimeTypes().contains(ClipDescription.MIMETYPE_TEXT_PLAIN)
    }, target = callback // or externalAppCallback
)

ইভেন্ট ব্যবহার করা হয়ে গেলে কলব্যাক ফাংশন true রিটার্ন করবে অথবা ইভেন্ট প্রত্যাখ্যান করা হলে এবং পেরেন্ট কম্পোনেন্টে প্রোপাগেট না করলে false রিটার্ন করবে।

ড্র্যাগ-অ্যান্ড-ড্রপ ইভেন্ট ম্যানেজ করা

DragAndDropTarget ইন্টারফেসে ওভাররাইড কলব্যাক করে দেখুন যে কখন কোনও ড্র্যাগ-অ্যান্ড-ড্রপ ইভেন্ট শুরু, শেষ বা কোনও কম্পোনেন্টে প্রবেশ বা প্রস্থান করে। এর ফলে UI এবং অ্যাপের আচরণকে আরও ভালভাবে কন্ট্রোল করা যায়:

object : DragAndDropTarget {
    override fun onStarted(event: DragAndDropEvent) {
        // When the drag event starts
    }

    override fun onEntered(event: DragAndDropEvent) {
        // When the dragged object enters the target surface
    }

    override fun onEnded(event: DragAndDropEvent) {
        // When the drag event stops
    }

    override fun onExited(event: DragAndDropEvent) {
        // When the dragged object exits the target surface
    }

    override fun onDrop(event: DragAndDropEvent): Boolean = true
}

অতিরিক্ত রিসোর্স

কোডল্যাব: Compose-এ ড্র্যাগ-অ্যান্ড-ড্রপ