Android: Fade view in and out

Question

I need to display an image button that fades in and out (and in and out and so on...) The transparency can be set with setAlpha but how can I fade in and out? I mean I cannot do it on another thread because you need to do such things on the UI thread, right?

I guess it can be done with animations but I haven't found anything, because I don't have any experience with animations and don't really know what to search for...

Actually what I really want is to fade one image in and another one out but I guess the easiest way is to place the first image button below the second and just fade the second one. Or is there an easier way to do it?

You could use an animation, and create an animation `XML` file with your alpha transition, then set it to the `ImageButton` — kabuto178, May 28 '13 at 20:18

score 94 · Accepted Answer · answered Jun 24 '13 at 08:32

Here is the solution I'm using now, that works on API level lower than 12:

AlphaAnimation anim = new AlphaAnimation(1.0f, 0.0f);
anim.setDuration(1000);
anim.setRepeatCount(NUM_REPEATS);
anim.setRepeatMode(Animation.REVERSE);
button.startAnimation(anim);

score 28 · Answer 2 · answered May 28 '13 at 20:27

This is an animation we used in our project. Spinner is a view so you can change this with your imageview. So indeed 2 images on top of eachother, one visible one invisible. This is how we did it. Hope it helps.

    spinner.setVisibility(View.VISIBLE);
    spinner.setAlpha(0);

    spinner.animate().setDuration(200).alpha(1).setListener(new AnimatorListenerAdapter() {
        @Override
        public void onAnimationEnd(Animator animation) {
            spinner.setVisibility(View.VISIBLE);
        }
    });

     infoActivityContent.animate().setDuration(200).alpha(0).setListener(new AnimatorListenerAdapter() {
       @Override
       public void onAnimationEnd(Animator animation) {
            infoActivityContent.setVisibility(View.GONE);

       mainPresenter.logout();
       }
     });

this also needs API level 12 and I need 8. Anyway, I'll use it until I find something else. If I want to fade in and out infinitely (meaning that I need to start the fade-in-animation from within the fade-out-animation-end-listener) will it eventually result in a memory overflow? — DominicM, May 28 '13 at 21:36
No that normally shouldn't be a problem. They are all running on different threads and once the first one finishes all the memory it allocated will be freed. — David Maes, May 29 '13 at 09:38

score 6 · Answer 3 · answered May 28 '13 at 20:47

6

You have to read Crossfading Two Views from Android developers. In this tutorial is explained how to do what you want.

answered May 28 '13 at 20:47

Mario Kutlev

4,897
7
44
62

1

this looks very good but it requires API level 12 and I need level 8 (I forgot to mention that...) – DominicM May 28 '13 at 21:23

Abhilash Das · Answer 4 · 2018-11-22T14:52:47.193

4

in kotlin:

view.animate().alpha(1f).setDuration(1000)
            .setInterpolator(AccelerateInterpolator()).start()

You can add an AnimatorListenerAdapter in setListener to handle other view states.

edited Nov 22 '18 at 14:52

answered Nov 22 '18 at 06:36

Abhilash Das

1,388
1
16
22

nice solution. need to set the alpha of the view to 0f before executing this, however. `view.alpha = 0f` – AndroidDev Jun 04 '19 at 02:55
didn't get u... r u asking? – Abhilash Das Jun 06 '19 at 06:17
not asking. just pointing out that if your alpha doesn't start at something other than 1, this won't have any effect. – AndroidDev Jun 06 '19 at 18:46

msh · Answer 5 · 2013-05-28T21:13:22.437

You can make several sequential frames of your first image morphing into your second image and back, then define them as animation-list and start animation in onCreate

button_frames.xml:

   <?xml version="1.0" encoding="utf-8"?>
      <animation-list xmlns:android="http://schemas.android.com/apk/res/android" >
        <item android:drawable="@drawable/frame1" android:duration="100" />
        <item android:drawable="@drawable/frame2" android:duration="100" />
                   ....

layout:

  <ImageView android:id="@+id/button" 
       android:background="@drawable/button_frames"/>

OnCreate:

   ImageView button= (ImageView)findViewById(R.id.button);
   mAnimation = (AnimationDrawable) animationView.getBackground();
   button.postDelayed(new Runnable() {
       public void run() {
         mAnimation.start();
       }
   }, 100);

score -1 · Answer 6 · answered May 28 '13 at 20:29

-1

Implement Animation Class ( You can load it thru XML Or create it dynamically).

Then you can set it thru API setAnimation(Animation animation).

answered May 28 '13 at 20:29

Munish Katoch

517
3
6

Android: Fade view in and out

6 Answers6

Linked