یک فعالیت را با استفاده از یک انیمیشن شروع کنید

انتقال فعالیت در برنامه‌های طراحی مواد، ارتباطات بصری بین حالت‌های مختلف را از طریق حرکت و تبدیل بین عناصر مشترک فراهم می‌کند. شما می توانید انیمیشن های سفارشی را برای انتقال ورود و خروج و برای انتقال عناصر مشترک بین فعالیت ها مشخص کنید.

شکل 1 . انتقالی با عناصر مشترک

  • یک انتقال ورود تعیین می کند که چگونه نماها در یک فعالیت وارد صحنه می شوند. برای مثال، در explode enter transition، نماها از بیرون وارد صحنه می شوند و به سمت داخل به سمت مرکز صفحه پرواز می کنند.
  • یک انتقال خروجی نحوه خروج نماهای یک فعالیت از صحنه را تعیین می کند. به عنوان مثال، در انتقال خروجی explode ، نماها به دور از مرکز از صحنه خارج می شوند.
  • یک انتقال عناصر مشترک تعیین می‌کند که چگونه نماهایی که بین دو فعالیت مشترک هستند، بین این فعالیت‌ها انتقال می‌یابند. به عنوان مثال، اگر دو اکتیویتی در موقعیت‌ها و اندازه‌های مختلف تصویر یکسانی داشته باشند، تغییر عنصر اشتراک‌گذاری شده changeImageTransform تصویر را به راحتی بین این فعالیت‌ها ترجمه و مقیاس می‌کند.

اندروید از این ترانزیشن های ورود و خروج پشتیبانی می کند:

  • explode : نماها را به داخل یا خارج از مرکز صحنه حرکت می دهد.
  • slide : نماها را به داخل یا خارج از یکی از لبه های صحنه منتقل می کند.
  • fade : با تغییر شفافیت یک نما را از صحنه اضافه یا حذف می کند.

هر انتقالی که کلاس Visibility را گسترش دهد به عنوان انتقال ورود یا خروج پشتیبانی می شود. برای اطلاعات بیشتر، به مرجع API برای کلاس Transition مراجعه کنید.

Android همچنین از این انتقال عناصر مشترک پشتیبانی می کند:

  • changeBounds : تغییرات در مرزهای چیدمان نماهای هدف را متحرک می کند.
  • changeClipBounds : تغییرات در محدوده کلیپ نماهای هدف را متحرک می کند.
  • changeTransform : تغییرات در مقیاس و چرخش نماهای هدف را متحرک می کند.
  • changeImageTransform : تغییرات در اندازه و مقیاس تصاویر هدف را متحرک می کند.

وقتی انتقال فعالیت را در برنامه خود فعال می‌کنید، انتقال پیش‌فرض متقاطع بین فعالیت‌های ورودی و خروجی فعال می‌شود.

شکل 2. انتقال صحنه با یک عنصر مشترک.

برای نمونه کدی که با استفاده از عناصر مشترک بین فعالیت‌ها متحرک می‌شود، به ActivitySceneTransitionBasic مراجعه کنید.

نسخه سیستم را بررسی کنید

APIهای انتقال فعالیت در Android نسخه 5.0 (API 21) و بالاتر در دسترس هستند. برای حفظ سازگاری با نسخه های قبلی اندروید، قبل از اینکه API ها را برای هر یک از این ویژگی ها فراخوانی کنید، version سیستم را در زمان اجرا بررسی کنید:

کاتلین

// 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
}

انتقال های سفارشی را مشخص کنید

ابتدا، وقتی سبکی را تعریف می‌کنید که از موضوع Material به ارث می‌رسد، انتقال محتوای پنجره را با ویژگی 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 است. برای اطلاعات بیشتر، به مرجع API برای Transition مراجعه کنید.

برای فعال کردن انتقال محتوای پنجره در کد خود، تابع Window.requestFeature() را فراخوانی کنید:

کاتلین

// 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 فراخوانی کنید:

توابع setExitTransition() و setSharedElementExitTransition() انتقال خروجی را برای فعالیت فراخوانی تعریف می کنند. توابع setEnterTransition() و setSharedElementEnterTransition() انتقال enter را برای فعالیت فراخوانی شده تعریف می کنند.

برای دریافت اثر کامل یک انتقال، باید انتقال محتوای پنجره را در هر دو فعالیت فراخوانی و فراخوانی شده فعال کنید. در غیر این صورت، فعالیت فراخوانی انتقال خروج را شروع می‌کند، اما سپس انتقال‌های پنجره را می‌بینید - مانند مقیاس یا محو شدن.

برای شروع هرچه زودتر انتقال enter، از تابع Window.setAllowEnterTransitionOverlap() در اکتیویتی فراخوانده شده استفاده کنید. این به شما امکان می دهد تا انتقال های ورود چشمگیرتری داشته باشید.

یک فعالیت را با استفاده از انتقال شروع کنید

اگر انتقال‌ها را فعال کنید و یک انتقال خروجی را برای یک فعالیت تنظیم کنید، هنگامی که فعالیت دیگری را راه‌اندازی می‌کنید، انتقال فعال می‌شود، به شرح زیر:

کاتلین

startActivity(intent,
              ActivityOptions.makeSceneTransitionAnimation(this).toBundle())

جاوا

startActivity(intent,
              ActivityOptions.makeSceneTransitionAnimation(this).toBundle());

اگر برای دومین اکتیویتی یک انتقال وارد کنید، این انتقال نیز با شروع فعالیت فعال می شود. برای غیرفعال کردن انتقال‌ها هنگام شروع فعالیت دیگری، یک بسته گزینه‌های null ارائه کنید.

یک فعالیت را با یک عنصر مشترک شروع کنید

برای ایجاد انیمیشن انتقال صفحه بین دو فعالیت که دارای یک عنصر مشترک هستند، موارد زیر را انجام دهید:

  1. انتقال محتوای پنجره را در طرح زمینه خود فعال کنید.
  2. یک انتقال عناصر مشترک را در سبک خود مشخص کنید.
  3. انتقال خود را به عنوان یک منبع XML تعریف کنید.
  4. با ویژگی android:transitionName یک نام مشترک به عناصر مشترک در هر دو طرح بندی اختصاص دهید.
  5. از تابع ActivityOptions.makeSceneTransitionAnimation() استفاده کنید.

کاتلین

// 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.finishAfterTransition() را به جای Activity.finish() فراخوانی کنید.

یک فعالیت را با چندین عنصر مشترک شروع کنید

برای ایجاد انیمیشن انتقال صحنه بین دو اکتیویتی که بیش از یک عنصر مشترک دارند، عناصر به اشتراک گذاشته شده را در هر دو طرح بندی با ویژگی android:transitionName تعریف کنید—یا از تابع View.setTransitionName() در هر دو فعالیت استفاده کنید—و یک شی ActivityOptions به عنوان ایجاد کنید. به شرح زیر است:

کاتلین

// 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"));