কাস্টম ট্রানজিশন অ্যানিমেশন তৈরি করুন

Compose-এর মাধ্যমে চেষ্টা করুন
Jetpack Compose হল Android-এর জন্য সাজেস্ট করা UI টুলকিট। Compose-এ কীভাবে অ্যানিমেশন যোগ করতে হয় তা জানুন।

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

কাস্টম ট্রানজিশন, যেমন বিল্ট-ইন ট্রানজিশনের ধরন, শুরু ও শেষ দৃশ্যের চাইল্ড ভিউতে অ্যানিমেশন প্রয়োগ করে। তবে, বিল্ট-ইন ট্রানজিশনের ধরনের মতো নয়, আপনাকে কোড দিতে হবে যা প্রপার্টি ভ্যালু ক্যাপচার করে এবং অ্যানিমেশন তৈরি করে। এছাড়াও, আপনি অ্যানিমেশনের জন্য টার্গেট ভিউয়ের সাবসেট নির্ধারণ করতে চাইতে পারেন।

এই পৃষ্ঠা থেকে আপনি জানতে পারবেন কীভাবে প্রপার্টি ভ্যালু ক্যাপচার করতে হয় এবং কাস্টম ট্রানজিশন তৈরি করার জন্য অ্যানিমেশন জেনারেট করতে হয়।

Transition ক্লাস এক্সটেন্ড করা

কাস্টম ট্রানজিশন তৈরি করতে, আপনার প্রোজেক্টে এমন একটি ক্লাস যোগ করুন যা Transition ক্লাসকে এক্সটেন্ড করে এবং নিম্নলিখিত স্নিপেটে দেখানো ফাংশনগুলিকে ওভাররাইড করে:

Kotlin

class CustomTransition : Transition() {

    override fun captureStartValues(transitionValues: TransitionValues) {}

    override fun captureEndValues(transitionValues: TransitionValues) {}

    override fun createAnimator(
        sceneRoot: ViewGroup,
        startValues: TransitionValues?,
        endValues: TransitionValues?
    ): Animator? {}

}

জাভা

public class CustomTransition extends Transition {

    @Override
    public void captureStartValues(TransitionValues values) {}

    @Override
    public void captureEndValues(TransitionValues values) {}

    @Override
    public Animator createAnimator(ViewGroup sceneRoot,
                                   TransitionValues startValues,
                                   TransitionValues endValues) {}
}

এইসব ফাংশন কীভাবে ওভাররাইড করতে হয় তা নিম্নলিখিত বিভাগে ব্যাখ্যা করা হয়েছে।

ক্যাপচার ভিউ প্রপার্টি ভ্যালু

ট্রানজিশন অ্যানিমেশন, প্রপার্টি অ্যানিমেশন ওভারভিউ-এ বর্ণনা করা প্রপার্টি অ্যানিমেশন সিস্টেম ব্যবহার করে। প্রপার্টি অ্যানিমেশন নির্দিষ্ট সময়সীমা জুড়ে শুরুর ভ্যালু থেকে শেষের ভ্যালু পর্যন্ত ভিউ প্রপার্টি পরিবর্তন করে, তাই অ্যানিমেশন তৈরি করতে ফ্রেমওয়ার্কের কাছে প্রপার্টির শুরুর ও শেষের ভ্যালু দুটিই থাকতে হবে।

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

শুরুর ভ্যালু ক্যাপচার করুন

ফ্রেমওয়ার্কে স্টার্টিং ভিউ ভ্যালু পাস করতে, captureStartValues(transitionValues) ফাংশন প্রয়োগ করুন। ফ্রেমওয়ার্ক শুরুর দৃশ্যের প্রতিটি ভিউয়ের জন্য এই ফাংশন কল করে। ফাংশন আর্গুমেন্ট হল একটি TransitionValues অবজেক্ট যাতে ভিউয়ের রেফারেন্স এবং একটি Map ইনস্ট্যান্স থাকে যেখানে আপনি নিজের পছন্দমতো ভিউ ভ্যালু স্টোর করতে পারবেন। আপনার ইমপ্লিমেন্টেশনে, এইসব প্রপার্টি ভ্যালু ফিরিয়ে আনুন এবং ম্যাপে সেগুলি স্টোর করার মাধ্যমে ফ্রেমওয়ার্কে ফেরত পাঠান।

প্রপার্টি ভ্যালুর জন্য কী যাতে অন্য TransitionValues কীয়ের সাথে কনফ্লিক্ট না করে তা নিশ্চিত করতে, নিম্নলিখিত নামকরণ স্কিম ব্যবহার করুন:

package_name:transition_name:property_name

নিম্নলিখিত স্নিপেট captureStartValues() ফাংশনের প্রয়োগ দেখায়:

Kotlin

class CustomTransition : Transition() {

    // Define a key for storing a property value in
    // TransitionValues.values with the syntax
    // package_name:transition_class:property_name to avoid collisions
    private val PROPNAME_BACKGROUND = "com.example.android.customtransition:CustomTransition:background"

    override fun captureStartValues(transitionValues: TransitionValues) {
        // Call the convenience method captureValues
        captureValues(transitionValues)
    }

    // For the view in transitionValues.view, get the values you
    // want and put them in transitionValues.values
    private fun captureValues(transitionValues: TransitionValues) {
        // Get a reference to the view
        val view = transitionValues.view
        // Store its background property in the values map
        transitionValues.values[PROPNAME_BACKGROUND] = view.background
    }

    ...

}

জাভা

public class CustomTransition extends Transition {

    // Define a key for storing a property value in
    // TransitionValues.values with the syntax
    // package_name:transition_class:property_name to avoid collisions
    private static final String PROPNAME_BACKGROUND =
            "com.example.android.customtransition:CustomTransition:background";

    @Override
    public void captureStartValues(TransitionValues transitionValues) {
        // Call the convenience method captureValues
        captureValues(transitionValues);
    }


    // For the view in transitionValues.view, get the values you
    // want and put them in transitionValues.values
    private void captureValues(TransitionValues transitionValues) {
        // Get a reference to the view
        View view = transitionValues.view;
        // Store its background property in the values map
        transitionValues.values.put(PROPNAME_BACKGROUND, view.getBackground());
    }
    ...
}

শেষের ভ্যালু ক্যাপচার করুন

ফ্রেমওয়ার্কটি শেষ দৃশ্যে প্রতিটি টার্গেট ভিউয়ের জন্য একবার captureEndValues(TransitionValues) ফাংশন কল করে। অন্যান্য সব ক্ষেত্রে, captureEndValues(), captureStartValues()-এর মতোই কাজ করে।

নিম্নলিখিত কোড স্নিপেট captureEndValues() ফাংশনের প্রয়োগ দেখায়:

Kotlin

override fun captureEndValues(transitionValues: TransitionValues) {
    captureValues(transitionValues)
}

জাভা

@Override
public void captureEndValues(TransitionValues transitionValues) {
    captureValues(transitionValues);
}

এই উদাহরণে, captureStartValues() এবং captureEndValues() ফাংশন দুটিই ভ্যালু ফিরিয়ে আনতে এবং স্টোর করতে captureValues()-কে ইনভোক করে। captureValues() যে ভিউ প্রপার্টি রিস্টোর করে তা একই, তবে শুরু ও শেষের দৃশ্যে এর আলাদা আলাদা ভ্যালু আছে। ফ্রেমওয়ার্ক, কোনও ভিউয়ের শুরু ও শেষের অবস্থার জন্য আলাদা ম্যাপ মেইনটেইন করে।

কাস্টম অ্যানিমেটর তৈরি করুন

শুরুর দৃশ্যে এবং শেষের দৃশ্যে কোনও ভিউয়ের অবস্থার মধ্যে পরিবর্তন অ্যানিমেট করতে, createAnimator() ফাংশন ওভাররাইড করে একটি অ্যানিমেটর প্রদান করুন। ফ্রেমওয়ার্ক এই ফাংশন কল করলে, এটি সিন রুট ভিউ এবং TransitionValues অবজেক্ট পাস করে, যার মধ্যে আপনার ক্যাপচার করা শুরু ও শেষের ভ্যালু থাকে।

ফ্রেমওয়ার্ক কতবার createAnimator() ফাংশন কল করবে তা নির্ভর করে শুরু ও শেষের দৃশ্যের মধ্যে কতগুলি পরিবর্তন হয়েছে তার উপর।

যেমন, কাস্টম ট্রানজিশন হিসেবে ফেড-আউট বা ফেড-ইন অ্যানিমেশন প্রয়োগ করা। শুরুর দৃশ্যে পাঁচটি টার্গেট থাকলে, যার মধ্যে দুটি শেষ দৃশ্যে সরিয়ে দেওয়া হয় এবং শেষ দৃশ্যে শুরুর দৃশ্যের তিনটি টার্গেট এবং একটি নতুন টার্গেট থাকলে, ফ্রেমওয়ার্ক createAnimator()-কে ছয়বার কল করে। তিনটি কল, দুটি দৃশ্য অবজেক্টেই থাকে এমন টার্গেটের ফেড-আউট ও ফেড-ইন অ্যানিমেট করে। আরও দুটি কল শেষ দৃশ্য থেকে সরানো টার্গেটের ফেড-আউট অ্যানিমেট করে। একটি কল শেষ দৃশ্যে নতুন টার্গেটের ফেড-ইন অ্যানিমেট করে।

শুরু ও শেষ, দুটি দৃশ্যের ক্ষেত্রেই টার্গেট ভিউয়ের জন্য ফ্রেমওয়ার্ক startValues ও endValues আর্গুমেন্ট, দুটির জন্যই TransitionValues অবজেক্ট প্রদান করে। টার্গেট ভিউয়ের জন্য যা শুধুমাত্র শুরু বা শেষের দৃশ্যে থাকে, ফ্রেমওয়ার্ক সংশ্লিষ্ট আর্গুমেন্টের জন্য TransitionValues অবজেক্ট এবং অন্যটির জন্য null প্রদান করে।

আপনি কাস্টম ট্রানজিশন তৈরি করার সময় createAnimator(ViewGroup, TransitionValues, TransitionValues) ফাংশন প্রয়োগ করতে, Animator অবজেক্ট তৈরি করতে আপনার ক্যাপচার করা ভিউ প্রপার্টি ভ্যালু ব্যবহার করুন এবং ফ্রেমওয়ার্কে এটি ফিরিয়ে দিন। প্রয়োগের উদাহরণ দেখতে, CustomTransition স্যাম্পেলে ChangeColor ক্লাস দেখুন। প্রপার্টি অ্যানিমেটর সম্পর্কে আরও তথ্যের জন্য, প্রপার্টি অ্যানিমেশন দেখুন।

কাস্টম ট্রানজিশন প্রয়োগ করুন

কাস্টম ট্রানজিশন বিল্ট-ইন ট্রানজিশনের মতোই কাজ করে। ট্রানজিশন প্রয়োগ করুন-এ যেমন বর্ণনা করা হয়েছে, ট্রানজিশন ম্যানেজার ব্যবহার করে আপনি কাস্টম ট্রানজিশন প্রয়োগ করতে পারবেন।