Android基于Fresco实现圆角和圆形图片

圆角和圆形图片是我们常常使用的图片效果，在Android中实现这两种效果的方法有很多种，其中一种较为简单的方法就是使用Facebook开源的图片加载库Fresco。

Fresco是Facebook在2015年推出的一款开源的Android图片加载库，它具有高效、快速、低内存占用的特点，并且还支持图片的多样化加载，例如gif、webp等格式。Fresco的使用方法也非常简单，只需要在XML布局文件中添加SimpleDraweeView标签即可加载图片。

下面我们就分别介绍如何使用Fresco实现圆角和圆形图片效果。

一、实现圆角图片效果

1. 首先我们需要在项目的build.gradle文件中加入Fresco依赖：

dependencies {
    implementation 'com.facebook.fresco:fresco:2.0.0'
}

2. 在需要加载图片的XML布局文件中添加SimpleDraweeView标签，并设置需要加载的图片路径和占位图等属性：

<com.facebook.drawee.view.SimpleDraweeView
          android:id="@+id/imageView"
          android:layout_width="200dp"
          android:layout_height="200dp"
          fresco:placeholderImage="@drawable/placeholder"
          fresco:roundAsCircle="false"
          fresco:roundingBorderColor="@color/colorAccent"
          fresco:roundingBorderWidth="1dp"
          fresco:roundingBorderPadding="0dp"
          fresco:roundingBorderRadius="20dp"
          fresco:fadeDuration="300"
          fresco:actualImageScaleType="centerCrop"
          fresco:actualImageUri="@{imageUrl}" />

其中，fresco:roundingBorderRadius="20dp"表示设置圆角的半径为20dp，其他属性的作用如下：

- fresco:roundAsCircle="false"表示不设置圆形效果，而是实现圆角效果；

- fresco:roundingBorderColor="@color/colorAccent"表示圆角边框的颜色；

- fresco:roundingBorderWidth="1dp"表示圆角边框的宽度；

- fresco:roundingBorderPadding="0dp"表示圆角边框和图片之间的距离；

- fresco:fadeDuration="300"表示图片渐变加载的时间；

- fresco:actualImageScaleType="centerCrop"表示图片的缩放类型，不设置则默认为Fit。

3. 在代码中为SimpleDraweeView设置控制器，并加载图片：

SimpleDraweeView imageView = findViewById(R.id.imageView);
Uri uri = Uri.parse(imageUrl);
ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
            .setResizeOptions(new ResizeOptions(200, 200))
            .build();
RoundingParams roundingParams = RoundingParams.fromCornersRadius(20);
roundingParams.setBorderColor(getResources().getColor(R.color.colorAccent));
roundingParams.setBorderWidth(1);
roundingParams.setPadding(0);
roundingParams.setRoundAsCircle(false);
imageView.setHierarchy(new GenericDraweeHierarchyBuilder(getResources())
            .setRoundingParams(roundingParams)
            .build());
DraweeController controller = Fresco.newDraweeControllerBuilder()
            .setImageRequest(request)
            .setAutoPlayAnimations(true)
            .setOldController(imageView.getController())
            .build();
imageView.setController(controller);

其中，RoundingParams.fromCornersRadius(20)表示设置圆角半径为20，其他参数的作用如下：

- roundingParams.setRoundAsCircle(false)表示不设置圆形效果，而是实现圆角效果；

- roundingParams.setBorderColor(getResources().getColor(R.color.colorAccent))表示圆角边框的颜色；

- roundingParams.setBorderWidth(1)表示圆角边框的宽度；

- roundingParams.setPadding(0)表示圆角边框和图片之间的距离；

二、实现圆形图片效果

1. 在XML布局文件中添加SimpleDraweeView标签，并设置需要加载的图片路径和占位图等属性：

<com.facebook.drawee.view.SimpleDraweeView
          android:id="@+id/imageView"
          android:layout_width="200dp"
          android:layout_height="200dp"
          fresco:placeholderImage="@drawable/placeholder"
          fresco:roundAsCircle="true"
          fresco:fadeDuration="300"
          fresco:actualImageScaleType="centerCrop"
          fresco:actualImageUri="@{imageUrl}" />

其中，fresco:roundAsCircle="true"表示设置圆形效果，其他属性的作用同上方。

2. 在代码中为SimpleDraweeView设置控制器，并加载图片：

SimpleDraweeView imageView = findViewById(R.id.imageView);
Uri uri = Uri.parse(imageUrl);
ImageRequest request = ImageRequestBuilder.newBuilderWithSource(uri)
            .setResizeOptions(new ResizeOptions(200, 200))
            .build();
RoundingParams roundingParams = RoundingParams.asCircle();
imageView.setHierarchy(new GenericDraweeHierarchyBuilder(getResources())
            .setRoundingParams(roundingParams)
            .build());
DraweeController controller = Fresco.newDraweeControllerBuilder()
            .setImageRequest(request)
            .setAutoPlayAnimations(true)
            .setOldController(imageView.getController())
            .build();
imageView.setController(controller);

其中，RoundingParams.asCircle()表示设置圆形效果，其他参数同上方。

以上就是使用Fresco实现圆角和圆形图片效果的方法，Fresco也提供了其他丰富的功能，有兴趣的读者可以进一步了解。