مشاهده انیمیشن

روش نوشتن را امتحان کنید

Jetpack Compose ابزار رابط کاربری پیشنهادی برای اندروید است. یاد بگیرید که چگونه از انیمیشن‌ها در Compose استفاده کنید.

ویژگی‌های متحرک‌سازی →

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

یک انیمیشن tween می‌تواند مجموعه‌ای از تبدیل‌های ساده (موقعیت، اندازه، چرخش و شفافیت) را روی محتویات یک شیء View انجام دهد. بنابراین، اگر یک شیء TextView دارید، می‌توانید متن را حرکت دهید، بچرخانید، بزرگ یا کوچک کنید. اگر تصویر پس‌زمینه داشته باشد، تصویر پس‌زمینه به همراه متن تغییر شکل می‌دهد. animation package تمام کلاس‌های مورد استفاده در یک انیمیشن tween را ارائه می‌دهد.

یک توالی از دستورالعمل‌های انیمیشن، انیمیشن بین دو شیء (tween animation) را تعریف می‌کند که توسط XML یا کد اندروید تعریف می‌شود. همانند تعریف یک طرح‌بندی (layout)، یک فایل XML توصیه می‌شود زیرا خواناتر، قابل استفاده مجدد و قابل تعویض‌تر از کدنویسی مستقیم انیمیشن است. در مثال زیر، ما از XML استفاده می‌کنیم. (برای کسب اطلاعات بیشتر در مورد تعریف انیمیشن در کد برنامه خود، به جای XML، به کلاس AnimationSet و سایر زیرکلاس‌های Animation مراجعه کنید.)

دستورالعمل‌های انیمیشن، تبدیل‌هایی را که می‌خواهید انجام شوند، زمان انجام آنها و مدت زمان لازم برای اعمال آنها تعریف می‌کنند. تبدیل‌ها می‌توانند متوالی یا همزمان باشند - برای مثال، می‌توانید کاری کنید که محتویات یک TextView از چپ به راست حرکت کند و سپس ۱۸۰ درجه بچرخد، یا می‌توانید کاری کنید که متن همزمان حرکت کند و بچرخد. هر تبدیل مجموعه‌ای از پارامترهای خاص آن تبدیل را می‌گیرد (اندازه شروع و اندازه پایان برای تغییر اندازه، زاویه شروع و زاویه پایان برای چرخش و غیره)، و همچنین مجموعه‌ای از پارامترهای مشترک (به عنوان مثال، زمان شروع و مدت زمان). برای اینکه چندین تبدیل به طور همزمان انجام شوند، به آنها زمان شروع یکسانی بدهید. برای اینکه آنها را متوالی کنید، زمان شروع به علاوه مدت زمان تبدیل قبلی را محاسبه کنید.

فایل XML انیمیشن در دایرکتوری res/anim/ پروژه اندروید شما قرار دارد. این فایل باید یک عنصر ریشه داشته باشد: این عنصر می‌تواند یک عنصر <alpha> ، <scale> ، <translate> ، <rotate> ، interpolator یا عنصر <set> باشد که گروه‌هایی از این عناصر را در خود نگه می‌دارد (که ممکن است شامل یک <set> دیگر باشد). به طور پیش‌فرض، تمام دستورالعمل‌های انیمیشن به طور همزمان اعمال می‌شوند. برای اینکه آنها به ترتیب اجرا شوند، باید ویژگی startOffset را همانطور که در مثال زیر نشان داده شده است، مشخص کنید.

XML زیر از یکی از ApiDemos برای کشیدن، سپس چرخاندن و چرخاندن همزمان یک شیء View استفاده می‌شود.

<set android:shareInterpolator="false">
    <scale
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"
        android:fromXScale="1.0"
        android:toXScale="1.4"
        android:fromYScale="1.0"
        android:toYScale="0.6"
        android:pivotX="50%"
        android:pivotY="50%"
        android:fillAfter="false"
        android:duration="700" />
    <set android:interpolator="@android:anim/decelerate_interpolator">
        <scale
           android:fromXScale="1.4"
           android:toXScale="0.0"
           android:fromYScale="0.6"
           android:toYScale="0.0"
           android:pivotX="50%"
           android:pivotY="50%"
           android:startOffset="700"
           android:duration="400"
           android:fillBefore="false" />
        <rotate
           android:fromDegrees="0"
           android:toDegrees="-45"
           android:toYScale="0.0"
           android:pivotX="50%"
           android:pivotY="50%"
           android:startOffset="700"
           android:duration="400" />
    </set>
</set>

مختصات صفحه نمایش (که در این مثال استفاده نشده است) در گوشه بالا سمت چپ (0,0) قرار دارد و با پایین رفتن و به سمت راست افزایش می‌یابد.

برخی از مقادیر، مانند pivotX، می‌توانند نسبت به خود شیء یا نسبت به والد آن تعیین شوند. حتماً از قالب مناسب برای آنچه می‌خواهید استفاده کنید ("50" برای 50٪ نسبت به والد، یا "50٪" برای 50٪ نسبت به خودش).

شما می‌توانید با اختصاص یک Interpolator ، نحوه اعمال یک تبدیل را در طول زمان تعیین کنید. اندروید شامل چندین زیرکلاس Interpolator است که منحنی‌های سرعت مختلفی را مشخص می‌کنند: برای مثال، AccelerateInterpolator به یک تبدیل می‌گوید که با سرعت کم شروع شود و با سرعت زیاد ادامه یابد. هر کدام از این کلاس‌ها دارای یک مقدار ویژگی هستند که می‌توانند در XML اعمال شوند.

با ذخیره این XML با نام hyperspace_jump.xml در دایرکتوری res/anim/ پروژه، کد زیر به آن ارجاع داده شده و آن را از طرح‌بندی به یک شیء ImageView اعمال می‌کند.

کاتلین

AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump).also { hyperspaceJumpAnimation ->
    findViewById<ImageView>(R.id.spaceshipImage).startAnimation(hyperspaceJumpAnimation)
}

جاوا

ImageView spaceshipImage = (ImageView) findViewById(R.id.spaceshipImage);
Animation hyperspaceJumpAnimation = AnimationUtils.loadAnimation(this, R.anim.hyperspace_jump);
spaceshipImage.startAnimation(hyperspaceJumpAnimation);

به عنوان جایگزینی برای startAnimation() ، می‌توانید با Animation.setStartTime() زمان شروع انیمیشن را تعریف کنید، سپس با View.setAnimation() انیمیشن را به View اختصاص دهید.

برای اطلاعات بیشتر در مورد سینتکس XML، تگ‌ها و ویژگی‌های موجود، به منابع انیمیشن مراجعه کنید.

نکته: صرف نظر از اینکه انیمیشن شما چگونه حرکت می‌کند یا تغییر اندازه می‌دهد، مرزهای نمای (View) که انیمیشن شما را در خود جای می‌دهد، به طور خودکار برای تطبیق با آن تنظیم نمی‌شوند. با این حال، انیمیشن همچنان فراتر از مرزهای نمای خود ترسیم می‌شود و برش داده نمی‌شود. با این حال، اگر انیمیشن از مرزهای نمای والد فراتر رود، برش رخ می‌دهد .