Einblenden Ausblenden Android-Animation in Java


148

Ich möchte eine 2-Sekunden-Animation einer ImageView haben, die 1000 ms einblendet und dann 1000 ms ausblendet.

Folgendes habe ich bisher in meinem ImageView-Konstruktor:

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

Wenn ich diese Animation ausführe, wird nichts angezeigt. Wenn ich jedoch eine der Alpha-Animationen entferne, funktioniert das Verhalten wie erwartet.

Dinge, die ich bereits versucht habe:

  • Jede denkbare Kombination aus setFillBefore, setFillAfterund setFillEnabled.
  • Hinzufügen eines LinearInterpolatorzum AnimationSet.

1
Ja, Sie können Bilder ein- und ausblenden! Dieses Tutorial sollte den Trick machen. sankarganesh-info-exchange.blogspot.com/2011/04/…
Adam Storm

Dieses Tutorial beschreibt eine Methode mit XML. Wissen Sie, wie Sie mit Java dasselbe erreichen können?
Pflüger

Nun, ich bin nicht neben meinem Programmiercomputer, daher kann ich diesen Code nicht testen, aber Sie können XML-Attribute in Java festlegen. Dies ist der ursprüngliche Code: android: interpolator = "@ android: anim / beschleunigen_interpolator" android: fromAlpha = "0.0" android: toAlpha = "1.0" android: duration = "300" /> \ n, so dass Sie wahrscheinlich MyTween.setDurationg können (300) MyTween.fromAlpha (0.0) MyTween (1.0)
Adam Storm

Antworten:


258

Ich habe mein eigenes Problem herausgefunden. Die Lösung basierte schließlich auf Interpolatoren.

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


Wenn Sie Kotlin verwenden

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
Was ist, wenn Sie 5 oder 6 Ein- / Ausblendungen mit wirklich kleinen Verzögerungen wie jeweils 100 ausführen möchten, könnten Sie so etwas verwenden? Ich habe es versucht, aber es ist nicht wirklich flüssig. Ziel war es, beispielsweise eine Glühbirne zu simulieren, die nicht richtig funktioniert, und zu funkeln.
Chayy

Versuchen Sie, this.setAnimation in einer Schleife aufzurufen
Jonathan

Ich dachte, ich blende das letzte bg img aus und verblasse im aktuellen, aber diese Antwort inspiriert mich, dass ich nur das aktuelle bg img einblenden und das aktuelle ausblenden muss, da AlphaAnimation nicht zwei verschiedene imgs ausblenden kann .
Macio.Juni

8
Ich glaube nicht, dass Sie zwei unabhängige Animationen benötigen ... Ich denke, Sie könnten eine einzige Animation haben und den Parameter festlegen: fadeInOut.setRepeatMode (Animation.REVERSE);
RoundSparrow Hilltx

Zweitens: Wenn Sie wiederholen möchten, müssen Sie keine Schleife aufrufen, wie @jonney sagte. Verwenden Sie fadeInOut.setRepeatCount (6) - ändern Sie 6 so, dass es so viele sind, wie Sie möchten, dass es wiederholt wird. Viel weniger Aufwand, damit der native C ++ - Code in Android all dies erledigt, anstatt eine Java-Schleife aufzurufen.
RoundSparrow Hilltx

136

Ich weiß, dass dies bereits beantwortet wurde, aber .....

<?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"
    />

Schnelle und einfache Möglichkeit zum schnellen Ein- und Ausblenden mit einer Selbstwiederholung. Genießen

BEARBEITEN : Fügen Sie in Ihrer Aktivität Folgendes hinzu:

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

6
+1 Weil ich mit dieser Antwort eine Folge von Einblenden, Ausblenden und Einblenden machen könnte (setze einfach repeatCount = "2"). Ich konnte Animationen nicht verketten, wie es die akzeptierte Antwort vorschlägt.
ElYeante

1
alphaWie kann ich diese Ressource nach der Deklaration verwenden? Danke
zozelfelfo

1
zozelfelfo es ist nur eine Animations-XML, also lade sie in Code und rufe dann startAnimation für jede Ansicht auf, die sie beeinflussen soll.
Konrad Winkowski

@KonradWinkowski startAnimation-Methode benötigt Animationsobjekt als Argument! Was soll ich weitergeben?
Ahmad Vatani

Für diejenigen, die nach einer vollständigeren Antwort suchen: viewToAnimate.startAnimation(AnimationUtils.loadAnimation(context, R.anim.fade_in_out)Wo befindet sich eine Datei fade_in_out.xml im Animationsordner unter res.
Chris Knight

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 für Marshmallow!
LETs

26

Hier ist meine Lösung mit AnimatorSet, die etwas zuverlässiger zu sein scheint als 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();

Ich musste einen ObjectAnimator anstelle einer Animation verwenden, um eine funktionierende Lösung zu erhalten, da diese aus irgendeinem Grund, wenn ich eine AlphaAnimation startete, zweimal ausgeführt wurde und ein seltsames Flackern verursachte.
Andrew Orobator

elegante Lösung
Vlad

Nun, es ist zu spät, aber ich denke, dies könnte einigen helfen, freundlich klare Animation, bevor Sie es wieder auf die gleiche Ansicht verwenden ..
Bhavesh Moradiya

21

Eine andere Alternative:

Für fadeIn und fadeOut müssen keine 2 Animationen definiert werden . fadeOut ist umgekehrt zu fadeIn .

So können Sie dies mit Animation.REVERSE wie folgt tun :

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

dann 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

Da ich an die Leistungsfähigkeit von XML (für Layouts) glaube, entspricht dies der akzeptierten Antwort , jedoch nur als Animationsressource:

<?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>

Damit fillAftersoll die Überblendung nach Abschluss der Animation erhalten bleiben. Die interpolatorHandles Interpolation der Animationen, wie Sie sich vorstellen können. Sie können auch andere Arten von Interpolatoren verwenden, z. B. Linear oder Overshoot.

Stellen Sie sicher, dass Sie Ihre Animation in Ihrer Ansicht starten:

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

@KGCybeX kein Problem, froh, dass ich helfen konnte :)
DarkCygnus

1
Sehr hilfsbereit und sauber. Funktioniert perfekt für mich.
Fernando Barbosa

9

Hier ist, was ich verwendet habe, um Ansichten ein- und auszublenden. Ich hoffe, dies hilft jemandem.

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();
}

Irgendwie ist dies die einzige Antwort, die das Einstellen der Sichtbarkeit beinhaltet, nett
Luke

8

AnimationSets scheinen überhaupt nicht wie erwartet zu funktionieren. Am Ende gab ich auf und benutzte das postDelayed () der Handler-Klasse, um Animationen zu sequenzieren.


8

Wenn Sie Animator zum Erstellen von Animationen verwenden, können Sie dies tun

anim (Verzeichnis) -> 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"/>

In Java

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

Eine andere Möglichkeit, Animationen nur mit Java-Code auszublenden, ist

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

im Verzeichnis anim * nicht
animator

4

Sie können auch animationListener verwenden, ungefähr so:

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

0

Ich mag die Vitaly Zinchenkos- Lösung sehr, da sie kurz war.

Hier ist eine noch kürzere Version in Kotlin zum einfachen Ausblenden

viewToAnimate?.alpha = 1f
viewToAnimate?.animate()
             ?.alpha(0f)
             ?.setDuration(1000)
             ?.setInterpolator(DecelerateInterpolator())
             ?.start()
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.