মেটেরিয়াল ডিজাইন অ্যাপে অ্যাক্টিভিটি ট্রানজিশন, মোশন এবং সাধারণ এলিমেন্টের মধ্যে ট্রান্সফর্মেশনের মাধ্যমে বিভিন্ন স্টেটের মধ্যে ভিজ্যুয়াল কানেকশন প্রদান করে। আপনি প্রবেশ ও প্রস্থান ট্রানজিশন এবং অ্যাক্টিভিটির মধ্যে শেয়ার করা এলিমেন্টের ট্রানজিশনের জন্য কাস্টম অ্যানিমেশন নির্দিষ্ট করতে পারেন।
ছবি ১. শেয়ার করা এলিমেন্ট সহ ট্রানজিশন।
- enter ট্রানজিশন নির্ধারণ করে যে কোনও অ্যাক্টিভিটিতে ভিউ কীভাবে
দৃশ্যে প্রবেশ করে। যেমন,
explodeএন্টার ট্রানজিশনে, ভিউগুলি বাইরে থেকে দৃশ্যে প্রবেশ করে এবং স্ক্রিনের কেন্দ্রের দিকে উড়ে যায়। - একটি এক্সিট ট্রানজিশন নির্ধারণ করে যে কোনও অ্যাক্টিভিটিতে ভিউ কীভাবে দৃশ্য থেকে
বেরিয়ে যায়। যেমন,
explodeএক্সিট ট্রানজিশনে, ভিউগুলি কেন্দ্র থেকে দূরে দৃশ্য থেকে বেরিয়ে যায়। - শেয়ার করা এলিমেন্ট ট্রানজিশন নির্ধারণ করে যে দুটি অ্যাক্টিভিটির মধ্যে শেয়ার করা ভিউ
কীভাবে এই অ্যাক্টিভিটিগুলির মধ্যে ট্রানজিশন করে। যেমন,
দুটি অ্যাক্টিভিটিতে যদি একই ছবি আলাদা আলাদা পজিশন ও সাইজে থাকে, তাহলে
changeImageTransformশেয়ার করা এলিমেন্ট ট্রানজিশন, এইসব অ্যাক্টিভিটির মধ্যে ছবিকে মসৃণভাবে ট্রান্সলেট ও স্কেল করে।
Android-এ এইসব প্রবেশ ও প্রস্থান ট্রানজিশন কাজ করে:
explode: দৃশ্যের কেন্দ্র থেকে ভিউকে ভিতরের দিকে বা বাইরের দিকে সরায়।slide: দৃশ্যের কোনও একটি প্রান্ত থেকে ভিউ ভিতরে বা বাইরে নিয়ে যায়।fade: দৃশ্যের অস্বচ্ছতা পরিবর্তন করে, দৃশ্য থেকে কোনও ভিউ যোগ করে বা সরিয়ে দেয়।
Visibility ক্লাসকে এক্সটেন্ড করে এমন যেকোনও ট্রানজিশন এন্টার বা এক্সিট ট্রানজিশন হিসেবে কাজ করে।
আরও তথ্যের জন্য, Transition
ক্লাসের জন্য API রেফারেন্স দেখুন।
Android-এ এইসব শেয়ার করা এলিমেন্ট ট্রানজিশনও কাজ করে:
changeBounds: টার্গেট ভিউয়ের লেআউট বাউন্ডে পরিবর্তন অ্যানিমেট করে।changeClipBounds: টার্গেট ভিউয়ের ক্লিপ বাউন্ডে পরিবর্তন অ্যানিমেট করে।changeTransform: টার্গেট ভিউয়ের স্কেল ও রোটেশনে পরিবর্তন অ্যানিমেট করে।changeImageTransform: টার্গেট ছবির সাইজ ও স্কেলে পরিবর্তন অ্যানিমেট করে।
আপনার অ্যাপে অ্যাক্টিভিটি ট্রানজিশন চালু করলে, ডিফল্ট ক্রস-ফেডিং ট্রানজিশন, অ্যাক্টিভিটি শুরু ও শেষ হওয়ার মধ্যে অ্যাক্টিভেট হয়।
ছবি ২. একটি শেয়ার করা এলিমেন্ট সহ সিন ট্রানজিশন।
শেয়ার করা এলিমেন্ট ব্যবহার করে অ্যাক্টিভিটির মধ্যে অ্যানিমেশন দেখায় এমন স্যাম্পেল কোডের জন্য, ActivitySceneTransitionBasic দেখুন।
সিস্টেম ভার্সন চেক করুন
অ্যাক্টিভিটি ট্রানজিশন API, Android 5.0 (API 21) এবং তার পরবর্তী ভার্সনে উপলভ্য। Android-এর আগের ভার্সনের সাথে কম্প্যাটিবিলিটি বজায় রাখতে, এইসব ফিচারের জন্য API কল করার আগে
রানটাইমে সিস্টেম version চেক করুন:
Kotlin
// Check if we're running on Android 5.0 or higher if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { // Apply activity transition } else { // Swap without transition }
জাভা
// Check if we're running on Android 5.0 or higher if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { // Apply activity transition } else { // Swap without transition }
কাস্টম ট্রানজিশন নির্দিষ্ট করুন
প্রথমে, আপনি যখন মেটেরিয়াল থিম থেকে উত্তরাধিকার সূত্রে প্রাপ্ত একটি স্টাইল সংজ্ঞায়িত করেন তখন android:windowActivityTransitions
অ্যাট্রিবিউটের সাথে উইন্ডো কন্টেন্ট ট্রানজিশন চালু করুন। এছাড়াও, আপনি স্টাইল সংজ্ঞায়
প্রবেশ, প্রস্থান এবং শেয়ার করা এলিমেন্ট ট্রানজিশন নির্দিষ্ট করতে পারবেন:
<style name="BaseAppTheme" parent="android:Theme.Material"> <!-- enable window content transitions --> <item name="android:windowActivityTransitions">true</item> <!-- specify enter and exit transitions --> <item name="android:windowEnterTransition">@transition/explode</item> <item name="android:windowExitTransition">@transition/explode</item> <!-- specify shared element transitions --> <item name="android:windowSharedElementEnterTransition"> @transition/change_image_transform</item> <item name="android:windowSharedElementExitTransition"> @transition/change_image_transform</item> </style>
এই উদাহরণে change_image_transform ট্রানজিশন এইভাবে ব্যাখ্যা করা হয়েছে:
<!-- res/transition/change_image_transform.xml --> <!-- (see also Shared Transitions below) --> <transitionSet xmlns:android="http://schemas.android.com/apk/res/android"> <changeImageTransform/> </transitionSet>
changeImageTransform এলিমেন্টটি
ChangeImageTransform ক্লাসের সাথে সম্পর্কিত। আরও তথ্যের জন্য, Transition-এর জন্য API
রেফারেন্স দেখুন।
পরিবর্তে আপনার কোডে উইন্ডো কন্টেন্ট ট্রানজিশন চালু করতে, Window.requestFeature() ফাংশন কল করুন:
Kotlin
// Inside your activity (if you did not enable transitions in your theme) with(window) { requestFeature(Window.FEATURE_ACTIVITY_TRANSITIONS) // Set an exit transition exitTransition = Explode() }
জাভা
// Inside your activity (if you did not enable transitions in your theme) getWindow().requestFeature(Window.FEATURE_ACTIVITY_TRANSITIONS); // Set an exit transition getWindow().setExitTransition(new Explode());
আপনার কোডে ট্রানজিশন নির্দিষ্ট করতে, Transition অবজেক্টের সাথে এইসব ফাংশন কল করুন:
Window.setEnterTransition()Window.setExitTransition()Window.setSharedElementEnterTransition()Window.setSharedElementExitTransition()
setExitTransition() এবং
setSharedElementExitTransition() ফাংশন কলিং অ্যাক্টিভিটির জন্য এক্সিট
ট্রানজিশন নির্ধারণ করে। setEnterTransition() এবং
setSharedElementEnterTransition() ফাংশন কল করা অ্যাক্টিভিটির জন্য
এন্টার ট্রানজিশন নির্ধারণ করে।
ট্রানজিশনের সম্পূর্ণ প্রভাব পেতে, আপনাকে অবশ্যই কলিং এবং কল করা অ্যাক্টিভিটি উভয় ক্ষেত্রেই উইন্ডো কন্টেন্ট ট্রানজিশন চালু করতে হবে। অন্যথায়, কলিং অ্যাক্টিভিটি এক্সিট ট্রানজিশন শুরু করে, কিন্তু তারপর আপনি উইন্ডো ট্রানজিশন দেখতে পান—যেমন স্কেল বা ফেড।
যত তাড়াতাড়ি সম্ভব এন্টার ট্রানজিশন শুরু করতে, কল করা অ্যাক্টিভিটিতে
Window.setAllowEnterTransitionOverlap()
ফাংশন ব্যবহার করুন। এর ফলে আপনি আরও নাটকীয় এন্ট্রি ট্রানজিশন দেখতে পাবেন।
ট্রানজিশন ব্যবহার করে অ্যাক্টিভিটি শুরু করুন
আপনি যদি ট্রানজিশন চালু করেন এবং কোনও অ্যাক্টিভিটির জন্য এক্সিট ট্রানজিশন সেট করেন, তাহলে আপনি অন্য অ্যাক্টিভিটি চালু করলে ট্রানজিশনটি অ্যাক্টিভেট হয়, যেমন:
Kotlin
startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(this).toBundle())
জাভা
startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(this).toBundle());
আপনি দ্বিতীয় অ্যাক্টিভিটির জন্য এন্টার ট্রানজিশন সেট করলে, অ্যাক্টিভিটি শুরু হওয়ার সময় সেই ট্রানজিশনও
অ্যাক্টিভেট হয়। আপনি অন্য অ্যাক্টিভিটি শুরু করার সময় ট্রানজিশন বন্ধ করতে, null বিকল্পের বান্ডেল প্রদান করুন।
শেয়ার করা এলিমেন্টের মাধ্যমে অ্যাক্টিভিটি শুরু করা
শেয়ার করা এলিমেন্ট আছে এমন দুটি অ্যাক্টিভিটির মধ্যে স্ক্রিন ট্রানজিশন অ্যানিমেশন তৈরি করতে, নিম্নলিখিত ধাপগুলি অনুসরণ করুন:
- আপনার থিমে উইন্ডো কন্টেন্ট ট্রানজিশন চালু করুন।
- আপনার স্টাইলে শেয়ার করা এলিমেন্ট ট্রানজিশন নির্দিষ্ট করুন।
- XML রিসোর্স হিসেবে আপনার ট্রানজিশন নির্ধারণ করুন।
android:transitionNameঅ্যাট্রিবিউট ব্যবহার করে দুটি লেআউটের শেয়ার করা এলিমেন্টের জন্য একটি সাধারণ নাম অ্যাসাইন করুন।ActivityOptions.makeSceneTransitionAnimation()ফাংশন ব্যবহার করুন।
Kotlin
// Get the element that receives the click event val imgContainerView = findViewById<View>(R.id.img_container) // Get the common element for the transition in this activity val androidRobotView = findViewById<View>(R.id.image_small) // Define a click listener imgContainerView.setOnClickListener( { val intent = Intent(this, Activity2::class.java) // Create the transition animation - the images in the layouts // of both activities are defined with android:transitionName="robot" val options = ActivityOptions .makeSceneTransitionAnimation(this, androidRobotView, "robot") // Start the new activity startActivity(intent, options.toBundle()) })
জাভা
// Get the element that receives the click event final View imgContainerView = findViewById(R.id.img_container); // Get the common element for the transition in this activity final View androidRobotView = findViewById(R.id.image_small); // Define a click listener imgContainerView.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { Intent intent = new Intent(this, Activity2.class); // Create the transition animation - the images in the layouts // of both activities are defined with android:transitionName="robot" ActivityOptions options = ActivityOptions .makeSceneTransitionAnimation(this, androidRobotView, "robot"); // Start the new activity startActivity(intent, options.toBundle()); } });
আপনার কোডে তৈরি করা শেয়ার করা ডায়নামিক ভিউয়ের জন্য, দুটি অ্যাক্টিভিটিতেই
View.setTransitionName() ফাংশন ব্যবহার করে
একটি সাধারণ এলিমেন্টের নাম উল্লেখ করুন।
দ্বিতীয় অ্যাক্টিভিটি শেষ করার সময় সিন ট্রানজিশন অ্যানিমেশন রিভার্স করতে, Activity.finish()-এর পরিবর্তে
Activity.finishAfterTransition()
ফাংশন কল করুন।
একাধিক শেয়ার করা এলিমেন্ট সহ অ্যাক্টিভিটি শুরু করুন
একাধিক শেয়ার করা এলিমেন্ট আছে এমন দুটি অ্যাক্টিভিটির মধ্যে দৃশ্য ট্রানজিশন অ্যানিমেশন তৈরি করতে, android:transitionName অ্যাট্রিবিউট সহ দুটি লেআউটে শেয়ার করা এলিমেন্টগুলি সংজ্ঞায়িত করুন—অথবা দুটি অ্যাক্টিভিটিতেই
View.setTransitionName() ফাংশন ব্যবহার করুন—এবং
নিম্নলিখিতভাবে একটি
ActivityOptions
অবজেক্ট তৈরি করুন:
Kotlin
// Rename the Pair class from the Android framework to avoid a name clash import android.util.Pair as UtilPair ... val options = ActivityOptions.makeSceneTransitionAnimation(this, UtilPair.create(view1, "agreedName1"), UtilPair.create(view2, "agreedName2"))
জাভা
ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(this, Pair.create(view1, "agreedName1"), Pair.create(view2, "agreedName2"));