CircleImageView

最新推荐文章于 2024-06-04 09:41:55 发布

原创最新推荐文章于 2024-06-04 09:41:55 发布 · 487 阅读

0 ·

CC 4.0 BY-SA版权

Android 专栏收录该内容

24 篇文章

订阅专栏

CircleImageView是一款用于显示圆形头像图片的高效自定义视图组件，它基于RoundedImageView开发，并采用了Romain Guy推荐的技术。该组件通过BitmapShader实现圆形裁剪效果，避免了不必要的复制、裁剪路径和双次绘制等操作，适用于各种类型的Drawable资源，包括PicassoDrawable等。在使用过程中需要注意一些限制条件，例如ScaleType固定为CENTER_CROP，不能启用某些图片加载库的淡入动画。

github地址

CircleImageView

A fast circular ImageView perfect for profile images. This is based on RoundedImageView from Vince Mi which itself is based on techniques recommended by Romain Guy.

It uses a BitmapShader and does not:

create a copy of the original bitmap
use a clipPath (which is neither hardware accelerated nor anti-aliased)
use setXfermode to clip the bitmap (which means drawing twice to the canvas)

As this is just a custom ImageView and not a custom Drawable or a combination of both, it can be used with all kinds of drawables, i.e. a PicassoDrawable from Picasso or other non-standard drawables (needs some testing though).

Gradle

dependencies {
    ...
    compile 'de.hdodenhof:circleimageview:2.1.0'
}

Usage

<de.hdodenhof.circleimageview.CircleImageView
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/profile_image"
    android:layout_width="96dp"
    android:layout_height="96dp"
    android:src="@drawable/profile"
    app:civ_border_width="2dp"
    app:civ_border_color="#FF000000"/>

Limitations

The ScaleType is always CENTER_CROP and you'll get an exception if you try to change it. This is (currently) by design as it's perfectly fine for profile images.
Enabling adjustViewBounds is not supported as this requires an unsupported ScaleType
If you use an image loading library like Picasso or Glide, you need to disable their fade animations to avoid messed up images. For Picasso use the noFade() option, for Glide use dontAnimate(). If you want to keep the fadeIn animation, you have to fetch the image into a Target and apply a custom animation yourself when receiving the Bitmap.
Using a TransitionDrawable with CircleImageView doesn't work properly and leads to messed up images.