رفتن به مطلب

انیمیشن دادن به آیتم های RecyclerView


مجید آرتا

ارسال‌های توصیه شده

سلام

روز دانشجو رو به همه بیکاران آینده تبریک عرض می کنم :DD:

امیدوارم حالتون خوب باشه و خلاصه سرما خورده باشین اساسی :دی

 

یکی از مواردی که باعث میشه برنامه هامون کمی جلوه بهتری داشته باشه همین انیمیشن هاست که در قسمت های مختلفی از برنامه اعمال می کنیم.

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

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

 

کدهای کلاسمون  »

public class AnimationUtils {
        private static int counter = 0;

        public static void scaleXY(RecyclerView.ViewHolder holder) {
            holder.itemView.setScaleX(0);
            holder.itemView.setScaleY(0);

            PropertyValuesHolder propx = PropertyValuesHolder.ofFloat("scaleX", 1);
            PropertyValuesHolder propy = PropertyValuesHolder.ofFloat("scaleY", 1);

            ObjectAnimator animator = ObjectAnimator.ofPropertyValuesHolder(holder.itemView, propx, propy);


            animator.setDuration(800);
            animator.start();
        }

        public static void scaleX(RecyclerView.ViewHolder holder) {
            holder.itemView.setScaleX(0);

            PropertyValuesHolder propx = PropertyValuesHolder.ofFloat("scaleX", 1);

            ObjectAnimator animator = ObjectAnimator.ofPropertyValuesHolder(holder.itemView, propx);


            animator.setDuration(800);
            animator.start();
        }

        public static void scaleY(RecyclerView.ViewHolder holder) {
            holder.itemView.setScaleY(0);

            PropertyValuesHolder propy = PropertyValuesHolder.ofFloat("scaleY", 1);

            ObjectAnimator animator = ObjectAnimator.ofPropertyValuesHolder(holder.itemView, propy);

            animator.setDuration(800);
            animator.start();
        }

        public static void animate(RecyclerView.ViewHolder holder, boolean goesDown) {

            YoYo.with(Techniques.RubberBand)
                    .duration(1000)
                    .playOn(holder.itemView);
//        AnimatorSet animatorSet = new AnimatorSet();
//        ObjectAnimator animatorScaleX = ObjectAnimator.ofFloat(holder.itemView, "scaleX" ,0.5F, 0.8F, 1.0F);
//        ObjectAnimator animatorScaleY = ObjectAnimator.ofFloat(holder.itemView, "scaleY", 0.5F, 0.8F, 1.0F);
//        ObjectAnimator animatorTranslateY = ObjectAnimator.ofFloat(holder.itemView, "translationY", goesDown == true ? 300 : -300, 0);
//        ObjectAnimator animatorTranslateX = ObjectAnimator.ofFloat(holder.itemView, "translationX", -50, 50, -30, 30, -20, 20, -5, 5, 0);
//        animatorSet.playTogether(animatorTranslateX, animatorTranslateY, animatorScaleX, animatorScaleY);
//        animatorSet.setInterpolator(new AnticipateInterpolator());
//        animatorSet.setDuration(1000);
//        animatorSet.start();

        }

        public static void animateToolbarDroppingDown(View containerToolbar) {

            containerToolbar.setRotationX(-90);
            containerToolbar.setAlpha(0.2F);
            containerToolbar.setPivotX(0.0F);
            containerToolbar.setPivotY(0.0F);
            Animator alpha = ObjectAnimator.ofFloat(containerToolbar, "alpha", 0.2F, 0.4F, 0.6F, 0.8F, 1.0F).setDuration(4000);
            Animator rotationX = ObjectAnimator.ofFloat(containerToolbar, "rotationX", -90, 60, -45, 45, -10, 30, 0, 20, 0, 5, 0).setDuration(8000);
            AnimatorSet animatorSet = new AnimatorSet();
            animatorSet.setInterpolator(new DecelerateInterpolator());
            animatorSet.playTogether(alpha, rotationX);
            animatorSet.start();
        }

        /**
         * Courtesy: Vladimir Topalovic
         *
         * @param holder
         * @param goesDown
         */
        public static void animate1(RecyclerView.ViewHolder holder, boolean goesDown) {
            int holderHeight = holder.itemView.getHeight();
            holder.itemView.setPivotY(goesDown == true ? 0 : holderHeight);
            AnimatorSet animatorSet = new AnimatorSet();
            ObjectAnimator animatorTranslateY = ObjectAnimator.ofFloat(holder.itemView, "translationY", goesDown == true ? 300 : -300, 0);
            ObjectAnimator scaleY = ObjectAnimator.ofFloat(holder.itemView, "scaleY", 1f, 0.4f, 1f);
            ObjectAnimator scaleX = ObjectAnimator.ofFloat(holder.itemView, "scaleX", 1f, 1.3f, 1f);
            animatorTranslateY.setInterpolator(new AccelerateInterpolator());
            scaleY.setInterpolator(new OvershootInterpolator());
            scaleX.setInterpolator(new OvershootInterpolator());
            animatorSet.play(animatorTranslateY).before(scaleY).before(scaleX);
            animatorSet.setDuration(700);
            animatorSet.start();
        }

        /**
         * Courtesy: Vladimir Topalovic
         *
         * @param holder
         * @param goesDown
         */
        public static void animateSunblind(RecyclerView.ViewHolder holder, boolean goesDown) {
            int holderHeight = holder.itemView.getHeight();
            holder.itemView.setPivotY(goesDown == true ? 0 : holderHeight);
            holder.itemView.setPivotX(holder.itemView.getHeight());
            AnimatorSet animatorSet = new AnimatorSet();
            ObjectAnimator animatorTranslateY = ObjectAnimator.ofFloat(holder.itemView, "translationY", goesDown == true ? 300 : -300, 0);
            ObjectAnimator animatorRotation = ObjectAnimator.ofFloat(holder.itemView, "rotationX", goesDown == true ? -90f : 90, 0f);
            ObjectAnimator animatorScaleX = ObjectAnimator.ofFloat(holder.itemView, "scaleX", 0.5f, 1f);
            animatorSet.playTogether(animatorTranslateY, animatorRotation, animatorScaleX);
            animatorSet.setInterpolator(new DecelerateInterpolator(1.1f));
            animatorSet.setDuration(1000);
            animatorSet.start();
        }

        /**
         * Courtesy: Vladimir Topalovic
         *
         * @param holder
         * @param goesDown
         */
        public static void animateScatter(RecyclerView.ViewHolder holder, boolean goesDown) {
            counter = ++counter % 4;
            int holderHeight = holder.itemView.getHeight();
            int holderWidth = holder.itemView.getWidth();
            View holderItemView = holder.itemView;
            holderItemView.setPivotY(goesDown == true ? 0 : holderHeight);
            holderItemView.setPivotX(holderWidth / 2);
            AnimatorSet animatorSet = new AnimatorSet();
            ObjectAnimator animatorTranslateY = ObjectAnimator.ofFloat(holderItemView, "translationY", goesDown == true ? 300 : -300, 0);
            ObjectAnimator animatorTranslateX = ObjectAnimator.ofFloat(holderItemView, "translationX", counter == 1 || counter == 3 ? holderWidth : -holderWidth, 0);
            ObjectAnimator animatorScaleX = ObjectAnimator.ofFloat(holderItemView, "scaleX", counter == 1 || counter == 2 ? 0 : 2, 1f);
            ObjectAnimator animatorScaleY = ObjectAnimator.ofFloat(holderItemView, "scaleY", counter == 1 || counter == 2 ? 0 : 2, 1f);
            ObjectAnimator animatorAlpha = ObjectAnimator.ofFloat(holderItemView, "alpha", 0f, 1f);
            animatorAlpha.setInterpolator(new AccelerateInterpolator(1.5f));
            animatorSet.playTogether(animatorAlpha, animatorScaleX, animatorScaleY, animatorTranslateX, animatorTranslateY);
            animatorSet.setDuration(800).setInterpolator(new DecelerateInterpolator(1.1f));
            animatorSet.start();
        }

//        ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(holder.itemView, "translationY", (positive == true ? 200.0F : -200.F), 0F);
//        objectAnimator.setInterpolator(new DecelerateInterpolator());
//        objectAnimator.setDuration(1000);
//        objectAnimator.start();
//        YoYo.with(Techniques.StandUp).duration(800).playOn(holder.itemView);
//        AnimatorSet animatorSet = new AnimatorSet();
//        Animator scaleVertical = ObjectAnimator.ofFloat(holder.itemView,"scaleY",1.0F,0.8F,1.2F,1.4F,1.6F,1.4F,1.2F,0.8F,1.0F).setDuration(2000);
//        Animator rotateY = ObjectAnimator.ofFloat(holder.itemView,"rotationY",0,5,10,15,20,25,30,25,20,15,10,5,0).setDuration(2000);
//        //ObjectAnimator.ofFloat(holder.itemView,"scaleY",1.0F,0.8F,1.2F,1.4F,1.6F,1.4F,1.2F,0.8F,1.0F).setDuration(2000)
//        //ObjectAnimator.ofFloat(holder.itemView,"rotationY",0,5,10,15,20,25,30,25,20,15,10,5,0).setDuration(2000);
//
//        animatorSet.playTogether(rotateY, scaleVertical);
//        animatorSet.start();


//
    }

خب این کلاس از کتابخونه های مختلفی استفاده کرده که نیازه توی گریدل این هارو کامپایل کنیم ( به قول بچه ها سینکشون کنیم )

این 3 تا خط کد رو توی فایل dependencies  قرارشون بدین و Sync  کنید.

    compile 'com.nineoldandroids:library:2.4.0'
    compile 'com.daimajia.easing:library:1.0.1@aar'
    compile 'com.daimajia.androidanimations:library:1.1.3@aar'

 

در ادامه نحوه استفاده از این کلاس »

 - خب ابتدا توی کلاس آداپتر به صورت عمومی یا پابلیک یک متغییر Integer  تعریف می کنیم

private int mPreviousPosition = 0;

 - کار بعدی که فقط نوشتن یک شرط ساده با یک خط کد کارمون انجام میشه و این شرط رو باید در متد onBindViewHolder بنویسیم.

     if (position > mPreviousPosition) {
            AnimationUtils.animate1(holder,true);
        } else {
            AnimationUtils.animate1(holder, false);
        }
        mPreviousPosition = position;

اون position  هم مربوط به تابع onBindViewHolder  میشه و ما تعریف نکردیم!

خب این کلاس چندین Animation  داره که بنده به عنوان مثال animate1  رو نوشتم.دلیل اینکه دوبار این کد نوشته شده این هستش هر دو جهت یعنی بالا و پایین باهم آیتم ها دارای انیمیشن باشن.

 

نمونه »

Animation.gif

 

خب آموزش تا همینجا به اتمام میرسه

ان شاءالله که مورد استفاده باشه.

 

لینک ارسال
به اشتراک گذاری در سایت های دیگر

  • 1 سال بعد...
در در 1395/09/16, 14:56:28، مجید آرتا گفته است :

Hello

Congratulations to all future unemployed students :DD:

I hope you're fine and you've gotten cold

 

One of the things that makes your app work a bit better is the animations that we use in different parts of the program.

Most of the programs we create are forced to use RecyclerView, and it's good to be able to use it better and more beautifully.

During a little search I could find a class with simple animations, and so it came to work, and if you like, you can open this class.

 

Classmate Codes »


public class AnimationUtils {
        private static int counter = 0;

        public static void scaleXY(RecyclerView.ViewHolder holder) {

            PropertyValuesHolder propx = PropertyValuesHolder.ofFloat("scaleX", 1);
            PropertyValuesHolder propy = PropertyValuesHolder.ofFloat("scaleY", 1);

            ObjectAnimator animator = ObjectAnimator.ofPropertyValuesHolder(holder.itemView, propx, propy);


            animator.setDuration(800);
            animator.start();

        public static void scaleX(RecyclerView.ViewHolder holder) {


            ObjectAnimator animator = ObjectAnimator.ofPropertyValuesHolder(holder.itemView, propx);



        public static void scaleY(RecyclerView.ViewHolder holder) {


            ObjectAnimator animator = ObjectAnimator.ofPropertyValuesHolder(holder.itemView, propy);


        public static void animate(RecyclerView.ViewHolder holder, boolean goesDown) {

            YoYo.with(Techniques.RubberBand)
                    .duration(1000)
                    .playOn(holder.itemView);
//        AnimatorSet animatorSet = new AnimatorSet();
//        ObjectAnimator animatorScaleX = ObjectAnimator.ofFloat(holder.itemView, "scaleX" ,0.5F, 0.8F, 1.0F);
//        ObjectAnimator animatorScaleY = ObjectAnimator.ofFloat(holder.itemView, "scaleY", 0.5F, 0.8F, 1.0F);
//        ObjectAnimator animatorTranslateY = ObjectAnimator.ofFloat(holder.itemView, "translationY", goesDown == true ? 300 : -300, 0);
//        ObjectAnimator animatorTranslateX = ObjectAnimator.ofFloat(holder.itemView, "translationX", -50, 50, -30, 30, -20, 20, -5, 5, 0);
//        animatorSet.playTogether(animatorTranslateX, animatorTranslateY, animatorScaleX, animatorScaleY);
//        animatorSet.setInterpolator(new AnticipateInterpolator());
//        animatorSet.setDuration(1000);
//        animatorSet.start();


        public static void animateToolbarDroppingDown(View containerToolbar) {

            containerToolbar.setRotationX(-90);
            containerToolbar.setAlpha(0.2F);
            containerToolbar.setPivotX(0.0F);
            containerToolbar.setPivotY(0.0F);
            Animator alpha = ObjectAnimator.ofFloat(containerToolbar, "alpha", 0.2F, 0.4F, 0.6F, 0.8F, 1.0F).setDuration(4000);
            Animator rotationX = ObjectAnimator.ofFloat(containerToolbar, "rotationX", -90, 60, -45, 45, -10, 30, 0, 20, 0, 5, 0).setDuration(8000);
            AnimatorSet animatorSet = new AnimatorSet();
            animatorSet.setInterpolator(new DecelerateInterpolator());
            animatorSet.playTogether(alpha, rotationX);
            animatorSet.start();

         * Courtesy: Vladimir Topalovic
         * @param holder
         * @param goesDown
        public static void animate1(RecyclerView.ViewHolder holder, boolean goesDown) {
            holder.itemView.setPivotY(goesDown == true ? 0 : holderHeight);
            ObjectAnimator animatorTranslateY = ObjectAnimator.ofFloat(holder.itemView, "translationY", goesDown == true ? 300 : -300, 0);
            ObjectAnimator scaleY = ObjectAnimator.ofFloat(holder.itemView, "scaleY", 1f, 0.4f, 1f);
            ObjectAnimator scaleX = ObjectAnimator.ofFloat(holder.itemView, "scaleX", 1f, 1.3f, 1f);
            animatorTranslateY.setInterpolator(new AccelerateInterpolator());
            scaleY.setInterpolator(new OvershootInterpolator());
            scaleX.setInterpolator(new OvershootInterpolator());
            animatorSet.play(animatorTranslateY).before(scaleY).before(scaleX);
            animatorSet.setDuration(700);
            animatorSet.start();

         * Courtesy: Vladimir Topalovic
         * @param holder
         * @param goesDown
        public static void animateSunblind(RecyclerView.ViewHolder holder, boolean goesDown) {
            holder.itemView.setPivotY(goesDown == true ? 0 : holderHeight);
            AnimatorSet animatorSet = new AnimatorSet();
            ObjectAnimator animatorTranslateY = ObjectAnimator.ofFloat(holder.itemView, "translationY", goesDown == true ? 300 : -300, 0);
            ObjectAnimator animatorRotation = ObjectAnimator.ofFloat(holder.itemView, "rotationX", goesDown == true ? -90f : 90, 0f);
            ObjectAnimator animatorScaleX = ObjectAnimator.ofFloat(holder.itemView, "scaleX", 0.5f, 1f);
            animatorSet.playTogether(animatorTranslateY, animatorRotation, animatorScaleX);
            animatorSet.setInterpolator(new DecelerateInterpolator(1.1f));
            animatorSet.setDuration(1000);
            animatorSet.start();

         * Courtesy: Vladimir Topalovic
         * @param holder
         * @param goesDown
        public static void animateScatter(RecyclerView.ViewHolder holder, boolean goesDown) {
            counter = ++counter % 4;
            int holderWidth = holder.itemView.getWidth();
            View holderItemView = holder.itemView;
            holderItemView.setPivotY(goesDown == true ? 0 : holderHeight);
            AnimatorSet animatorSet = new AnimatorSet();
            ObjectAnimator animatorTranslateY = ObjectAnimator.ofFloat(holderItemView, "translationY", goesDown == true ? 300 : -300, 0);
            ObjectAnimator animatorTranslateX = ObjectAnimator.ofFloat(holderItemView, "translationX", counter == 1 || counter == 3 ? holderWidth : -holderWidth, 0);
            ObjectAnimator animatorScaleX = ObjectAnimator.ofFloat(holderItemView, "scaleX", counter == 1 || counter == 2 ? 0 : 2, 1f);
            ObjectAnimator animatorScaleY = ObjectAnimator.ofFloat(holderItemView, "scaleY", counter == 1 || counter == 2 ? 0 : 2, 1f);
            ObjectAnimator animatorAlpha = ObjectAnimator.ofFloat(holderItemView, "alpha", 0f, 1f);
            animatorAlpha.setInterpolator(new AccelerateInterpolator(1.5f));
            animatorSet.playTogether(animatorAlpha, animatorScaleX, animatorScaleY, animatorTranslateX, animatorTranslateY);
            animatorSet.setDuration(800).setInterpolator(new DecelerateInterpolator(1.1f));
            animatorSet.start();

//        ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(holder.itemView, "translationY", (positive == true ? 200.0F : -200.F), 0F);
//        objectAnimator.setInterpolator(new DecelerateInterpolator());
//        objectAnimator.setDuration(1000);
//        objectAnimator.start();
//        YoYo.with(Techniques.StandUp).duration(800).playOn(holder.itemView);
//        AnimatorSet animatorSet = new AnimatorSet();
//        Animator scaleVertical = ObjectAnimator.ofFloat(holder.itemView,"scaleY",1.0F,0.8F,1.2F,1.4F,1.6F,1.4F,1.2F,0.8F,1.0F).setDuration(2000);
//        Animator rotateY = ObjectAnimator.ofFloat(holder.itemView,"rotationY",0,5,10,15,20,25,30,25,20,15,10,5,0).setDuration(2000);
//        animatorSet.playTogether(rotateY, scaleVertical);
//        animatorSet.start();

Well, this class uses a variety of libraries to compile the grid in this grid (as children say)

Type these 3 lines of code in your dependencies file and sync.


    compile 'com.nineoldandroids:library:2.4.0'
    compile 'com.daimajia.easing:library:1.0.1@aar'
    compile 'com.daimajia.androidanimations:library:1.1.3@aar'

 

Continue how to use this class »

 Well, first, in the class of the adapter, we define the Integer variable publicly or publicly


private int mPreviousPosition = 0;

 - The next task is just to write a simple condition with our code line and this condition must be written in the onBindViewHolder method.


     if (position > mPreviousPosition) {
            AnimationUtils.animate1(holder,true);
        } else {
            AnimationUtils.animate1(holder, false);
        mPreviousPosition = position;

That position also relates to the onBindViewHolder function, and we did not define it!

Well, this class has several animations, which I wrote to animate, for example. Because this code is written twice, both upper and lower order items are animated.

 

Sample "

Animation.gif

 

Well, the training is up to now

Allah used to be.

 

wow good job.do you have lib?

 

لینک ارسال
به اشتراک گذاری در سایت های دیگر

در 17 ساعت قبل، Javad25564 گفته است :

یه درخواست دارم.میشه فارسی بنویسید این کاربر درخواست چی دادند.ممنون میشم

سلام  داداش. به چه کارت میاد؟ با گوچل ترنسلیت ترجمه کرده تایپک خودمون رو. بعدش پاین تشکر کرده و کتابخونه رو درخواست کرده. 

لینک ارسال
به اشتراک گذاری در سایت های دیگر

در 7 ساعت قبل، vistamobile گفته است :

سلام  داداش. به چه کارت میاد؟ با گوچل ترنسلیت ترجمه کرده تایپک خودمون رو. بعدش پاین تشکر کرده و کتابخونه رو درخواست کرده. 

من میخوام اطلاعاتم‌بالاتر بره.اگه موردی هست ماهم باخبر بشیم.یه روزی به کارمون میاد

لینک ارسال
به اشتراک گذاری در سایت های دیگر

بایگانی شده

این موضوع بایگانی و قفل شده و دیگر امکان ارسال پاسخ نیست.

  • کاربران آنلاین در این صفحه   0 کاربر

    • هیچ کاربر عضوی،در حال مشاهده این صفحه نیست.
×
×
  • اضافه کردن...