Imageloader四种图片显示（圆形，淡入，圆角，修饰）使用

这一长篇我们来看这四种图片显示在代码中如何使用，以开源组件中的例子为准。

先看一组圆形和淡入动画的效果

 这个淡入为了能看清效果我的时间改成了10s;

圆角的效果图：

 

1.圆形图片的使用

    
    
options = new DisplayImageOptions.Builder()
					.showImageOnLoading(R.drawable.ic_stub)
					.showImageForEmptyUri(R.drawable.ic_empty)
					.showImageOnFail(R.drawable.ic_error)
					.cacheInMemory(true)
					.cacheOnDisk(true)
					.considerExifParams(true)
					.displayer(new CircleBitmapDisplayer(Color.WHITE, 5))
					.build();

其它的参数就网上的说明比较多，只说下关于圆图片：

displayer ( new CircleBitmapDisplayer ( Color . WHITE , 5 ))

圆边为白色5个像素。然后调用下面的语句

    
    
ImageLoader.getInstance().displayImage(url, imageView, options);

如果要在圆形的图片上加一个淡入和效果

     
     
private ImageLoadingListener animateFirstListener = new AnimateFirstDisplayListener();
ImageLoader.getInstance().displayImage(url, imageView, options, animateFirstListener);   
private static class AnimateFirstDisplayListener extends SimpleImageLoadingListener {
        static final List<String> displayedImages = Collections.synchronizedList(new LinkedList<String>());
        @Override
        public void onLoadingComplete(String imageUri, View view, Bitmap loadedImage) {
            if (loadedImage != null) {
                ImageView imageView = (ImageView) view;
                boolean firstDisplay = !displayedImages.contains(imageUri);
                if (firstDisplay) {
                    FadeInBitmapDisplayer.animate(imageView, 500);
                    displayedImages.add(imageUri);
                }
            }
        }
    }

解释一下动画的监听

onLoadingComplete图片加载完成的方法

在方法里面先判断图片不为空，然后判断图片url不存在集合中是第一次显示 ，然后调用 FadeInBitmapDisplayer . animate ( imageView , 500 );

具体的实现过程可以看上一片代码分析中的 FadeInBitmapDisplayer类。动画显示之后氢这个图加放已经显示的集合中

2.圆角图片的显示

     
     
	options = new DisplayImageOptions.Builder()
					.showImageOnLoading(R.drawable.ic_stub)
					.showImageForEmptyUri(R.drawable.ic_empty)
					.showImageOnFail(R.drawable.ic_error)
					.cacheInMemory(true)
					.cacheOnDisk(true)
					.considerExifParams(true)
					.bitmapConfig(Bitmap.Config.RGB_565)
					.displayer(new RoundedBitmapDisplayer(20))
					.build();
    ImageLoader.getInstance().displayImage(url, imageView, options);

和圆形的过种一样把 CircleBitmapDisplayer ( Color . WHITE , 5 )换成 new RoundedBitmapDisplayer ( 20 ),圆角的半径20像素

3.图片修饰

我们先看一组正常情况的图片

 

下面看一下修饰过的图

除去不一们的圆角还有一个地方，仔细发现哦

     
     
	options = new DisplayImageOptions.Builder()
					.showImageOnLoading(R.drawable.ic_stub)
					.showImageForEmptyUri(R.drawable.ic_empty)
					.showImageOnFail(R.drawable.ic_error)
					.cacheInMemory(true)
					.cacheOnDisk(true)
					.considerExifParams(true)
					.bitmapConfig(Bitmap.Config.RGB_565)
					.displayer(new RoundedVignetteBitmapDisplayer(20,20))
					.build();
		}

使用和圆角的没有区别。实现有理请对照上一片 RoundedVignetteBitmapDisplayer类的分析。

如果我们要使用多效果叠加就可以对控件中的类进行重写，然后使用自己的类进行显示。

如果写的的有什么不对的地请指出，共同进步。