انیمیشن RecyclerView with animation in Android Studio

RecyclerView with animation

انیمیشن RecyclerView with animation ، عرض سلام خدمت کاربران گرامی سایت خانه اندروید قصد داریم در این آموزش انیمیشن توی recyclerview آموزش بدیم ، خدمتون تا یاد بگیرد چطور ایتم های مورد نظرتون به دلخواه وقتی کاربر اسکرول می کند RecyclerView with animation نمایش دهید و در ادامه با ما همراه باشید تا این آموزش رو به پایان برسونیم.

توی آموزش قبل مربوط به دریافت اطلاعات از سمت سرور نمایش اطلاعات توسط recyclerview و کارد ویو  رو آموزش دادیم.حالا می پردازیم به اینکه وقتی اطلاعاتی دریافت شد از سمت سرور با یک انیمیشن  RecyclerView with animation خاصی نمایش داده بشه و وقتی کاربر اسکرول می کند این انیمیشن رو بیشتر حس کنه و اپلیکیشن ما قشنگ بشه و افکت زیبایی رو به خودش بگیره.

حتما دانلود کنید : نمایش اطلاعات از سمت سرور JsonArrayRequest Volley اندروید استودیو

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

لطفا دقت کنید سورس کد ها رو در پکیج مربوط به کلاس Adapter و سپس در متد onBindViewHolder بنویسید:

سورس کد اول مربوط به انیمیشن در Recyclerview :

لطفا متغییر زیر را به صورت عمومی در بالای کلاس adapter ایجاد کنید.

int lastPosition = -1;

حال تابع زیر را خارج از onBindViewHolder بنویسید :

protected void setAnimation(View viewToAnimate, int position) {
    if (position > lastPosition) {
        ScaleAnimation anim = new ScaleAnimation(0.0f, 1.0f, 0.0f, 1.0f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
        anim.setDuration(new Random().nextInt(501));
        viewToAnimate.startAnimation(anim);
        lastPosition = position;
    }
}

سپس در متد onBindviewHolder تابع را فراخوانی کنید.

setAnimation(holder.itemView, position);

سورس کد بالا به صورت کامل همراه با نحوه فراخوانی.

@Override
public void onBindViewHolder(viewholder holder, int position) {
  setAnimation(holder.itemView, position);

}
protected void setAnimation(View viewToAnimate, int position) {
    if (position > lastPosition) {
        ScaleAnimation anim = new ScaleAnimation(0.0f, 1.0f, 0.0f, 1.0f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
        anim.setDuration(new Random().nextInt(501));
        viewToAnimate.startAnimation(anim);
        lastPosition = position;
    }
}

سورس کد دوم مربوط به انیمیشن در RecyClerView :

مراحل رو با دقت با من پیش بیایید تا به خوبی بتونید از برنامه ای خودتون اجرا بگیردو انیمیشن رو بتونید ست کنید.

مرحله اول : لطفا روی Res کلیک راست کنید سپس ایجاد کردن یک Directory را انتخاب کنید (new Directory) حال نامی را با عنوان anim به این پوشه اختصاص بدین. و حالا روی همون پوشه anim کلیک راست کنید Animation Resource file را انتخاب کنید سپس نام را با عنوان up_from_bottom اختصاص بدین.

حال سورس کد زیر را کامل بنویسید. و یا کپی کنید.

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:shareInterpolator="@android:anim/decelerate_interpolator">
    <translate
        android:fromXDelta="35%" android:toXDelta="0%"
        android:fromYDelta="75%" android:toYDelta="0%"
        android:duration="400" />
</set>

حالا لطفا توی متد onBindViewHolder لطفا سورس کد زیر را بنویسید و برنامه خودتون رو اجرا کنید.

if(position >lastPosition) {

    Animation animation = AnimationUtils.loadAnimation(context,
            R.anim.up_from_bottom);
    holder.itemView.startAnimation(animation);
    lastPosition = position;
}

انیمیشن سوم که مشابه انیمیشن بالاست سورس کدش که می تونید up_from_bottom.xml رو سورس کد قبلی رو حذف و سورس کد جدیدی رو جایگزین کنید و سپس اجرا بگیرن.

<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/bounce_interpolator">
    <translate
        android:duration="1500"
        android:fromYDelta="-150%p"
        android:toYDelta="0"
        />
</set>

انمیشن چهارم مشابه انیمیشن قبل به جای سورس کد up_from_bottom.xml سورس کد زیر را قرار بدید و اجرا بگیرد.

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
   android:interpolator="@android:anim/anticipate_overshoot_interpolator">
   <translate
       android:fromYDelta="-50%p"
       android:toYDelta="0"
       android:duration="2000"
       />
</set>