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

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

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

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

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

ট্রানজিশন ক্লাসটি প্রসারিত করুন

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

কোটলিন

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() ফাংশনটির একটি বাস্তবায়ন দেখানো হয়েছে:

কোটলিন

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() ফাংশনের একটি বাস্তবায়ন দেখায়:

কোটলিন

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 ক্লাসটি দেখুন। প্রপার্টি অ্যানিমেটর সম্পর্কে আরও তথ্যের জন্য, Property animation দেখুন।

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

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