Fade In Fade Out Android-анімація на Java


148

Я хочу мати 2-секундну анімацію ImageView, яка витрачає 1000 м зникання, а потім 1000 м зникає.

Ось що я поки що маю у своєму конструкторі ImageView:

Animation fadeIn = new AlphaAnimation(0, 1);
fadeIn.setDuration(1000);

Animation fadeOut = new AlphaAnimation(1, 0);
fadeOut.setStartOffset(1000);
fadeOut.setDuration(1000);

AnimationSet animation = new AnimationSet(true);
animation.addAnimation(fadeIn);
animation.addAnimation(fadeOut);
this.setAnimation(animation);

Коли я запускаю цю анімацію, нічого не з’являється. Однак, коли я видаляю одну з альфа-анімацій, поведінка працює так, як очікувалося.

Я вже спробував:

  • Всі мислимі комбінації setFillBefore, setFillAfterі setFillEnabled.
  • Додавання LinearInterpolatorдо AnimationSet.

1
Так, ви можете в’янути зображення в і зовні! Цей підручник повинен зробити трюк. sankarganesh-info-exchange.blogspot.com/2011/04/…
Адам Шторм

У цьому підручнику описано метод, що використовує XML. Чи знаєте ви, як досягти того ж, використовуючи Java?
орач

Ну, я не поруч зі своїм комп'ютером програмування, тому я не можу перевірити цей код, але ви можете встановити атрибути xml у Java. це оригінальний код: android: interpolator = "@ android: anim / accelerate_interpolator" android: fromAlpha = "0.0" android: toAlpha = "1.0" android: duration = "300" /> \ n, тож ви можете, ймовірно, MyTween.setDurationg (300) MyTween.fromAlpha (0.0) MyTween (1.0)
Адам Шторм

Відповіді:


258

З'ясував власну проблему. Рішення опинилося на основі інтерполяторів.

Animation fadeIn = new AlphaAnimation(0, 1);
fadeIn.setInterpolator(new DecelerateInterpolator()); //add this
fadeIn.setDuration(1000);

Animation fadeOut = new AlphaAnimation(1, 0);
fadeOut.setInterpolator(new AccelerateInterpolator()); //and this
fadeOut.setStartOffset(1000);
fadeOut.setDuration(1000);

AnimationSet animation = new AnimationSet(false); //change to false
animation.addAnimation(fadeIn);
animation.addAnimation(fadeOut);
this.setAnimation(animation);


Якщо ви використовуєте Kotlin

val fadeIn = AlphaAnimation(0f, 1f)
fadeIn.interpolator = DecelerateInterpolator() //add this
fadeIn.duration = 1000

val fadeOut = AlphaAnimation(1f, 0f)
fadeOut.interpolator = AccelerateInterpolator() //and this
fadeOut.startOffset = 1000
fadeOut.duration = 1000

val animation = AnimationSet(false) //change to false
animation.addAnimation(fadeIn)
animation.addAnimation(fadeOut)
this.setAnimation(animation)

1
Що робити, якщо ви хочете зробити 5 або 6 завмирання вхід / вихід, з дійсно невеликими затримками, як 100 для кожного, ви можете використати щось подібне? Я спробував, але це не дуже рідко. Метою було, наприклад, імітувати колбу, яка не працює належним чином, і мерехтіти.
Чай

спробуйте і зателефонуйте це.setAnimation у циклі
Джонатан

Я думав, що я вимикаю останній bg img і зникаю в поточному, але ця відповідь надихає мене на те, що мені потрібно лише згасати в поточному bg img і згасати в поточному, тому що AlphaAnimation не може зникнути / вимкнути два різних зображення .
macio.Jun

8
Я не думаю, що вам потрібно мати дві незалежні анімації ... Я думаю, ви могли б мати одну анімацію та встановити параметр: fadeInOut.setRepeatMode (Animation.REVERSE);
RoundSparrow hilltx

По-друге: якщо ви хотіли повторити, не потрібно дзвонити в цикл, як сказав @jonney. використовуйте fadeInOut.setRepeatCount (6) - змініть 6 на те, скільки ви хочете повторити. Набагато менше накладних витрат, щоб дозволити рідному коду C ++ в Android робити все це, а не дзвонити в цикл Java.
RoundSparrow hilltx

137

Я знаю, що на це вже відповіли, але .....

<?xml version="1.0" encoding="utf-8"?> 
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromAlpha="1.0" 
    android:toAlpha="0.0" 
    android:duration="1000"    
    android:repeatCount="infinite" 
    android:repeatMode="reverse"
    />

Швидкий і простий спосіб швидко зробити зникнення і вимикання за допомогою самостійного повторення. Насолоджуйтесь

РЕДАКТУВАТИ : У своїй діяльності додайте це:

yourView.startAnimation(AnimationUtils.loadAnimation(co‌​ntext, R.anim.yourAnimation));

6
+1 Тому що за допомогою цієї відповіді я міг зробити послідовність зникнення, зникнення та зникнення (просто встановивши repeatCount = "2"). Я не міг поєднати анімацію, як пропонує прийнята відповідь.
ElYeante

1
Після оголошення цього alphaресурсу, як я можу ним користуватися ?. Спасибі
zozelfelfo

1
zozelfelfo це просто анімація xml, тому завантажте її в код, а потім зателефонуйте startAnimation на будь-який вигляд, який ви хочете, щоб це вплинуло.
Конрад Вінковський

@KonradWinkowski Метод startAnimation вимагає об’єкт Animation як аргумент! що мені до нього передати?
Ахмад Ватані

Для тих, хто шукає більш повну відповідь: viewToAnimate.startAnimation(AnimationUtils.loadAnimation(context, R.anim.fade_in_out)де в папці анімації в розділі res є файл fade_in_out.xml.
Кріс Найт

32
viewToAnimate.animate().alpha(1).setDuration(1000).setInterpolator(new DecelerateInterpolator()).withEndAction(new Runnable() {
    @Override
    public void run() {
        viewToAnimate.animate().alpha(0).setDuration(1000).setInterpolator(new AccelerateInterpolator()).start();
    }
}).start();

4
Elegante для зефіру!
LETs

26

Ось моє рішення з використанням AnimatorSet, яке здається трохи надійнішим, ніж AnimationSet.

// Custom animation on image
ImageView myView = (ImageView)splashDialog.findViewById(R.id.splashscreenImage);

ObjectAnimator fadeOut = ObjectAnimator.ofFloat(myView, "alpha",  1f, .3f);
fadeOut.setDuration(2000);
ObjectAnimator fadeIn = ObjectAnimator.ofFloat(myView, "alpha", .3f, 1f);
fadeIn.setDuration(2000);

final AnimatorSet mAnimationSet = new AnimatorSet();

mAnimationSet.play(fadeIn).after(fadeOut);

mAnimationSet.addListener(new AnimatorListenerAdapter() {
    @Override
    public void onAnimationEnd(Animator animation) {
        super.onAnimationEnd(animation);
        mAnimationSet.start();
    }
});
mAnimationSet.start();

Мені довелося використовувати ObjectAnimator замість анімації, щоб отримати робоче рішення, тому що з якоїсь причини, коли я запускав AlphaAnimation, він запускався двічі і робив якесь дивне мерехтіння.
Андрій Оробатор

елегантне рішення
Влад

Ну, це занадто пізно, але я думаю, що це може допомогти деякій, добросердно зрозумілій анімації, перш ніж використовувати її знову на тому ж
огляді

21

Ще одна альтернатива:

Не потрібно визначати 2 анімації для fadeIn та fadeOut . fadeOut - зворотний бік fadeIn .

Отже, ви можете це зробити з Animation.REVERSE, як це:

AlphaAnimation alphaAnimation = new AlphaAnimation(0.0f, 1.0f);
alphaAnimation.setDuration(1000);
alphaAnimation.setRepeatCount(1);
alphaAnimation.setRepeatMode(Animation.REVERSE);
view.findViewById(R.id.imageview_logo).startAnimation(alphaAnimation);

потім onAnimationEnd :

alphaAnimation.setAnimationListener(new Animation.AnimationListener() {
    @Override
        public void onAnimationStart(Animation animation) {
            //TODO: Run when animation start
        }

        @Override
        public void onAnimationEnd(Animation animation) {
            //TODO: Run when animation end
        }

        @Override
        public void onAnimationRepeat(Animation animation) {
            //TODO: Run when animation repeat
        }
    });

12

Оскільки я вірю у силу XML (для макетів), це еквівалент прийнятої відповіді , але суто як анімаційний ресурс:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:interpolator/accelerate_decelerate"
    android:fillAfter="true">
    <alpha
        android:fromAlpha="0"
        android:toAlpha="1"
        android:duration="1000" />
    <alpha
        android:fromAlpha="1"
        android:toAlpha="0"
        android:duration="1000"
        android:startOffset="1000"/>
</set>

Це fillAfterозначає, що зникнення залишається після завершення анімації. Як ви здогадаєтесь, interpolatorобробляє інтерполяцію анімації. Ви також можете використовувати інші типи інтерполяторів, наприклад, лінійний або перевернутий.

Не забудьте запустити анімацію на свій погляд:

yourView.startAnimation(AnimationUtils.loadAnimation(co‌​ntext, R.anim.fade));

@KGCybeX немає проблем, радий, що можу допомогти :)
DarkCygnus

1
Дуже корисна та чиста. Для мене прекрасно працює.
Фернандо Барбоса

9

Ось що я використовував для вицвітання / перегляду поглядів, сподіваюся, це комусь допоможе.

private void crossFadeAnimation(final View fadeInTarget, final View fadeOutTarget, long duration){
    AnimatorSet mAnimationSet = new AnimatorSet();
    ObjectAnimator fadeOut = ObjectAnimator.ofFloat(fadeOutTarget, View.ALPHA,  1f, 0f);
    fadeOut.addListener(new Animator.AnimatorListener() {
        @Override
        public void onAnimationStart(Animator animation) {
        }

        @Override
        public void onAnimationEnd(Animator animation) {
            fadeOutTarget.setVisibility(View.GONE);
        }

        @Override
        public void onAnimationCancel(Animator animation) {
        }

        @Override
        public void onAnimationRepeat(Animator animation) {
        }
    });
    fadeOut.setInterpolator(new LinearInterpolator());

    ObjectAnimator fadeIn = ObjectAnimator.ofFloat(fadeInTarget, View.ALPHA, 0f, 1f);
    fadeIn.addListener(new Animator.AnimatorListener() {
        @Override
        public void onAnimationStart(Animator animation) {
            fadeInTarget.setVisibility(View.VISIBLE);
        }

        @Override
        public void onAnimationEnd(Animator animation) {}

        @Override
        public void onAnimationCancel(Animator animation) {}

        @Override
        public void onAnimationRepeat(Animator animation) {}
    });
    fadeIn.setInterpolator(new LinearInterpolator());
    mAnimationSet.setDuration(duration);
    mAnimationSet.playTogether(fadeOut, fadeIn);
    mAnimationSet.start();
}

Якось це єдина відповідь, яка включає налаштування видимості, приємно
Лука

8

Анімаційні набори взагалі не працюють так, як очікувалося. Врешті-решт я відмовився і застосував постDelayed () класу Handler для анімації послідовностей.


8

Якщо ви використовуєте Animator для створення анімації, ви можете

anim (каталог) -> fade_out.xml

<?xml version="1.0" encoding="UTF-8"?>
<objectAnimator
    android:propertyName="alpha"
    android:valueFrom="0"
    android:valueTo="1"
    xmlns:android="http://schemas.android.com/apk/res/android"/>

В яві

Animator animator = AnimatorInflater.loadAnimator(context, R.animator.fade_out);
animator.setTarget(the_view_you_want_to_animation);
animator.setDuration(1000);
animator.start();

Інший спосіб змусити анімацію згасати лише за допомогою Java-коду

ObjectAnimator fadeOut = ObjectAnimator.ofFloat(the_view_you_want_to_animation, "alpha",  1f, 0);
fadeOut.setDuration(2000);
fadeOut.start();

у каталозі anim * not animator
kosas

4

Ви також можете використовувати animationListener, приблизно так:

fadeIn.setAnimationListener(new AnimationListener() {
    @Override
    public void onAnimationEnd(Animation animation) {
        this.startAnimation(fadeout);
    }
});

0

Мені дуже подобається рішення Віталія Зінченкоса, оскільки воно було коротким.

Ось ще більш коротка версія в kotlin для простого зникнення

viewToAnimate?.alpha = 1f
viewToAnimate?.animate()
             ?.alpha(0f)
             ?.setDuration(1000)
             ?.setInterpolator(DecelerateInterpolator())
             ?.start()
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.