Universal Image Loader using 2 displayer

Question

How can I add a FadeInBitmapDisplayer AND a RoundedBitmapDisplayer to my Image?

This is my DisplayImageOptions

options = new DisplayImageOptions.Builder()
.showStubImage(R.drawable.appwidget
.cacheInMemory().displayer(new FadeInBitmapDisplayer(1500))
.build();

And is it possible somehow to only use the FadeIn Effect once? And if it's loaded and I scroll down my list and scroll back up again it does not FadeIn a second time?

Thanks alot in advance!

Answer 1

How can I add a FadeInBitmapDisplayer AND a RoundedBitmapDisplayer to my Image?

No way in current version. You can create your own displayer (extend BitmapDisplayer) and copy code from FadeInBitmapDisplayer and RoundedBitmapDisplayer into your class.

And is it possible somehow to only use the FadeIn Effect once?

Almost everything is possible :) But it will be not so convenient.

You can keep displayed images URLs in some map (Map<String, Boolean> = [Image URL<->isDisplayed]) and check this map before imageLoader.displayImage(...) call. If image for current URL is in Map (i.e. image was displayed) then use options with only RoundedBitmapDisplayer. If image for current URL isn't in Map then use options with FadeInBitmapDisplayer+RoundedBitmapDisplayer displayer.

Answer 2

How can I add a FadeInBitmapDisplayer AND a RoundedBitmapDisplayer to my Image?

Also had this problem. I used NOSTRA's great suggestion and here is my custom class:

public class FadeInRoundedBitmapDisplayer extends RoundedBitmapDisplayer {

    int durationMillis;
    String noRoundedCornersTag;

    public FadeInRoundedBitmapDisplayer(int durationMillis, int roundPixels,
            String noRoundedCornersTag) {
        super(roundPixels);
        this.durationMillis = durationMillis;
        this.noRoundedCornersTag = noRoundedCornersTag;
    }

    @Override
    public Bitmap display(Bitmap bitmap, ImageView imageView,
            LoadedFrom loadedFrom) {
        imageView.setImageBitmap((imageView.getTag() != null && imageView
                .getTag().equals(noRoundedCornersTag)) ? bitmap : super
                .display(bitmap, imageView, loadedFrom));

        animate(imageView, durationMillis);

        return bitmap;
    }

    public static void animate(ImageView imageView, int durationMillis) {
        AlphaAnimation fadeImage = new AlphaAnimation(0, 1);
        fadeImage.setDuration(durationMillis);
        fadeImage.setInterpolator(new DecelerateInterpolator());
        imageView.startAnimation(fadeImage);
    }

}

You can pass a String noRoundedCornersTag to the constructor. This enables you to give single imageViews in your XML layout that tag to skip the corner radius procedure (good for background images etc.), for example:

<ImageView
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:tag="@string/no_rounded_corners_tag" />

A constructor call would look like this:

new FadeInRoundedBitmapDisplayer(Constants.IMAGE_FADING_TIME,
  getResources().getDimension(R.dimen.image_corner_radius),
  getResources().getString(R.string.no_rounded_corners_tag))

Answer 3

I had to update @saschoar solution as it was not working with the current Universal Image Loader version (1.9.4). The solution is quite similar. Take a look:

public class FadeInRoundedBitmapDisplayer extends RoundedBitmapDisplayer {

    int durationMillis;

    public FadeInRoundedBitmapDisplayer(int durationMillis, int roundPixels) {

        super(roundPixels);
        this.durationMillis = durationMillis;
    }

    @Override
    public void display(Bitmap bitmap, ImageAware imageAware, LoadedFrom loadedFrom) {

        super.display(bitmap, imageAware, loadedFrom);

        animate(imageAware.getWrappedView(), durationMillis);
    }

    public static void animate(View imageView, int durationMillis) {

        AlphaAnimation fadeImage = new AlphaAnimation(0, 1);
        fadeImage.setDuration(durationMillis);
        fadeImage.setInterpolator(new DecelerateInterpolator());
        imageView.startAnimation(fadeImage);
    }
}

You can use this solution to define the DisplayImageOptions in this way:

    DisplayImageOptions displayImageOptions = new DisplayImageOptions.Builder()
        .displayer(new FadeInRoundedBitmapDisplayer(3000, 1000))
        .build();

    ImageLoader imageLoader = ImageLoader.getInstance();
    imageLoader.displayImage(imageUrl, imageView, displayImageOptions);