web-dev-qa-db-fra.com

Animation TextView - fondu en entrée, attente, fondu en sortie

Je fais une application de galerie d'images. J'ai actuellement une vue d'image avec une vue de texte en bas. Actuellement, il est simplement semi-transparent. Je veux le faire apparaître en fondu, attendre 3 secondes, puis disparaître à 90%. Apporter le focus ou charger une nouvelle image le fera répéter le cycle. J'ai lu une douzaine de pages et j'ai essayé quelques petites choses, sans succès. Tout ce que je reçois est un fondu entrant et un fondu instantané

21
Guy Cothal

Vous pouvez utiliser un objet d'animation supplémentaire (qui ne modifie pas son alpha) pour empêcher le fondu instantané, définissez animationListener pour votre effet de fondu et démarrez l'objet d'animation supplémentaire dans l'animation on Fin du fondu, puis vous commencez fondu à la fin de l'animation de l'objet d'animation supplémentaire, essayez le lien ci-dessous, cela vous aidera.

Effet de fondu automatique pour l'affichage de texte

3
kunmi
protected AlphaAnimation fadeIn = new AlphaAnimation(0.0f , 1.0f ) ; 
protected AlphaAnimation fadeOut = new AlphaAnimation( 1.0f , 0.0f ) ; 
txtView.startAnimation(fadeIn);
txtView.startAnimation(fadeOut);
fadeIn.setDuration(1200);
fadeIn.setFillAfter(true);
fadeOut.setDuration(1200);
fadeOut.setFillAfter(true);
fadeOut.setStartOffset(4200+fadeIn.getStartOffset());

Fonctionne parfaitement pour les fonds blancs. Sinon, vous devez changer de valeur lorsque vous instanciez la classe AlphaAnimation. Comme ça:

AlphaAnimation fadeIn = new AlphaAnimation( 1.0f , 0.0f ); 
AlphaAnimation fadeOut = new AlphaAnimation(0.0f , 1.0f ); 

Cela fonctionne avec un fond noir et une couleur de texte blanche.

51
Guy Cothal

C'est la solution que j'ai utilisée dans mon projet pour boucler l'animation de fondu d'entrée/de sortie sur TextViews:

private void setUpFadeAnimation(final TextView textView) {
    // Start from 0.1f if you desire 90% fade animation
    final Animation fadeIn = new AlphaAnimation(0.0f, 1.0f);
    fadeIn.setDuration(1000);
    fadeIn.setStartOffset(3000);
    // End to 0.1f if you desire 90% fade animation
    final Animation fadeOut = new AlphaAnimation(1.0f, 0.0f);
    fadeOut.setDuration(1000);
    fadeOut.setStartOffset(3000);

    fadeIn.setAnimationListener(new Animation.AnimationListener(){
        @Override
        public void onAnimationEnd(Animation arg0) {
            // start fadeOut when fadeIn ends (continue)
            textView.startAnimation(fadeOut);
        }

        @Override
        public void onAnimationRepeat(Animation arg0) {
        }

        @Override
        public void onAnimationStart(Animation arg0) {
        }
    });

    fadeOut.setAnimationListener(new Animation.AnimationListener(){
        @Override
        public void onAnimationEnd(Animation arg0) {
            // start fadeIn when fadeOut ends (repeat)
            textView.startAnimation(fadeIn);
        }

        @Override
        public void onAnimationRepeat(Animation arg0) {
        }

        @Override
        public void onAnimationStart(Animation arg0) {
        }
    });

    textView.startAnimation(fadeOut);
}

J'espère que cela pourrait aider!

8
Roses

Fonctions d'extension de Kotlin pour la réponse de Guy Cothal:

inline fun View.fadeIn(durationMillis: Long = 250) {
    this.startAnimation(AlphaAnimation(0F, 1F).apply {
        duration = durationMillis
        fillAfter = true
    })
}

inline fun View.fadeOut(durationMillis: Long = 250) {
    this.startAnimation(AlphaAnimation(1F, 0F).apply {
        duration = durationMillis
        fillAfter = true
    })
}
3
Bassam Helal

Je cherchais une solution à un problème similaire (TextView fade in/wait/fade out) et j'ai trouvé celui-ci (en fait, les documents officiels le soulignent aussi). Vous pouvez évidemment améliorer cela en ajoutant plus de paramètres.

public void showFadingText(String text){
    txtView.setText(text);
    Runnable endAction;
    txtView.animate().alpha(1f).setDuration(1000).setStartDelay(0).withEndAction(
            endAction = new Runnable() {
                public void run() {
                    txtView.animate().alpha(0f).setDuration(1000).setStartDelay(2000);
                }
            }
    );
}

À condition que txtView soit déclaré ailleurs avec alpha commençant à zéro.

0
galloper