我可以使用幻灯片有重叠图标的CircleImage像在Facebook信使？

Question

我正在寻找一个图书馆，可以帮助我使我的课程图像视图类似于在Facebook Messenger (带有z蓝色信使图标或灰色Facebook图标)。他们是怎么想出来的？能用幻灯片来做吗？如果没有，那又用什么呢？

Answer 1

1.我建议您通过Facebook查看壁画图像管理库，这是一种相对于其他图像加载库来说非常棒和成熟的壁画。

2.壁画采用SimpleDraweeView作为自定义图像视图，支持Rounded Corners and Circles 链接，支持动画(.gif，.webp)和普通图像(.jpg，.png)。

3.壁画采用3层体系结构( BITMAP_MEMORY_CACHE、ENCODED_MEMORY_CACHE和DISK_CACHE)处理图像的所有缓存。它还减少了OOM(内存不足)问题。当视图中的图像超出屏幕时，它会自动回收位图，从而释放内存。

Answer 2

使用CircleImageView/CircularImageView/RoundedImageView是不建议的，我们有很多报道问题的人与他们在一起主要是因为他们将位图从绘图中破解出来，这与幻灯片最基本的特性不兼容：.crossFade()，而且GIF动画可能会与它们断绝关系。

正确的幻灯片方法是使用转换，您可以在这里找到一个足够好的转换：https://stackoverflow.com/a/25806229/253468

滑动4.0将有一个内置的CircleCrop转换。

叠加图标

还可以通过转换添加叠加图标：

// .transform(new CircleTransform(context)), new StatusTransform(context, user.getStatus()))
public static class StatusTransform extends BitmapTransformation {
    private final Status status;
    public StatusTransform(Context context, Status status) {
        super(context);
        this.status = status;
    }

    @Override protected Bitmap transform(BitmapPool pool, Bitmap toTransform, int outWidth, int outHeight) {
        int w = toTransform.getWidth(), h = toTransform.getHeight();
        Bitmap result = pool.get(w, h, Bitmap.Config.ARGB_8888);
        if (result == null) {
            result = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
        }
        Canvas canvas = new Canvas(result);
        canvas.drawBitmap(toTransform);
        switch(status) {
            case Online:
                canvas.draw*(online graphics);
                break;
            case Offline:
                canvas.draw*(offline graphics);
                break;
        }
        return result;
    }

    @Override public String getId() {
        return getClass().getName() + status;
    }
}

或者简单地拥有两个ImageView：

<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="@dimen/user_profile_size"
    android:layout_height="@dimen/user_profile_size"
    >
    <ImageView
        android:id="@id/user_profile"
        android:layout_width="@dimen/user_profile_size"
        android:layout_height="@dimen/user_profile_size"
        />
    <ImageView
        android:id="@id/user_status"
        android:layout_width="@dimen/user_status_size"
        android:layout_height="@dimen/user_status_size"
        android:layout_gravity="bottom|end"
        />
</FrameLayout>

两者都有优点和相反之处:转换结果可以缓存，所以如果你有3个状态，幻灯片将存储每个用户的配置文件图像3次，用一个小图标，所以它可能只会被应用一次，然后它只是解码缓存的PNG (而不是JPEG，因为圆圈强制透明度)。对于两个ImageViews，您必须有两个滑动载重线(或者一个幻灯片和一个setImageResource)，绘制和布局可能会稍微慢一些。因此，您可以使用这两种方法将处理器时间交换到磁盘空间。使用ImageView方法，您还可以动态地处理状态更改之间的转换，并始终显示状态，即使当配置文件图像由于网络不良而缓慢加载时也是如此。

如果发生转换，如果transform方法的代码发生变化，则需要使缓存失效，这可以通过以下方法实现：

.signature(ApplicationVersionSignature.obatain(context)) // every release
// or
.signature(new StringSignature(String.valueOf( System.currentTimeMillies() / (10 * 60 * 1000) ))) // every 10 minutes

或者，这种失效可以以某种方式内置到getId()方法中。

Answer 3

如果您的目标是只有一个CircleImage，请尝试这样做：

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.widget.ImageView;

public class RoundedImageView extends ImageView
{
    public RoundedImageView(Context context)
    {
        super(context);
    }

    public RoundedImageView(Context context, @Nullable AttributeSet attrs)
    {
        super(context, attrs);
    }

    public RoundedImageView(Context context, @Nullable AttributeSet attrs, int defStyle)
    {
        super(context, attrs, defStyle);
    }

    public RoundedImageView(Context context, @Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes)
    {
        super(context, attrs, defStyleAttr, defStyleRes);
    }

    public static Bitmap getCroppedBitmap(Bitmap bmp, int radius)
    {
        Bitmap sbmp;

        if (bmp.getWidth() != radius || bmp.getHeight() != radius)
        {
            float smallest = Math.min(bmp.getWidth(), bmp.getHeight());
            float factor = smallest / radius;
            sbmp = Bitmap.createScaledBitmap(bmp, (int) (bmp.getWidth() / factor), (int) (bmp.getHeight() / factor), false);
        }
        else
        {
            sbmp = bmp;
        }

        Bitmap output = Bitmap.createBitmap(radius, radius,
                Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(output);

        final int color = 0xffa19774;
        final Paint paint = new Paint();
        final Rect rect = new Rect(0, 0, radius, radius);

        paint.setAntiAlias(true);
        paint.setFilterBitmap(true);
        paint.setDither(true);
        canvas.drawARGB(0, 0, 0, 0);
        paint.setColor(Color.parseColor("#BAB399"));
        canvas.drawCircle(radius / 2 + 0.7f,
                radius / 2 + 0.7f, radius / 2 + 0.1f, paint);
        paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
        canvas.drawBitmap(sbmp, rect, rect, paint);

        return output;
    }

    @Override
    protected void onDraw(Canvas canvas)
    {
        Drawable drawable = getDrawable();

        if (drawable == null)
        {
            return;
        }

        if (getWidth() == 0 || getHeight() == 0)
        {
            return;
        }
        Bitmap b = ((BitmapDrawable) drawable).getBitmap();
        Bitmap bitmap = b.copy(Bitmap.Config.ARGB_8888, true);

        int w = getWidth(), h = getHeight();

        Bitmap roundBitmap = getCroppedBitmap(bitmap, w);
        canvas.drawBitmap(roundBitmap, 0, 0, null);
    }
}

在您的布局中，您可以使用以下内容：

<mypkg.example.RoundedImageView
    android:id="@+id/roundimg"
    android:layout_width="54dp"
    android:layout_height="54dp"
    android:layout_gravity="center"/>

通过编程你可以设置一个字母..。

Rect textBounds = new Rect();
String text = "N"
Bitmap bitmap = Bitmap.createBitmap(imageView.getLayoutParams().width, imageView.getLayoutParams().height, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(bitmap);
canvas.drawColor(Color.DKGRAY);
TextPaint p = new TextPaint();
p.setColor(Color.WHITE);
p.setTextSize(imageView.getLayoutParams().height / 2);
p.setAntiAlias(true);
p.setTextAlign(Paint.Align.LEFT);
p.getTextBounds(text, 0, text.length(), textBounds);

int cx = imageView.getLayoutParams().width / 2;
int cy = imageView.getLayoutParams().height / 2;
canvas.drawText(text, cx - textBounds.exactCenterX(), cy - textBounds.exactCenterY(), p);

imageView.setImageBitmap(bitmap);

或者是图像..。

// image grabbed from an input stream
Bitmap photo = BitmapFactory.decodeStream(inputStream);
imageView.setImageBitmap(photo);

这个有用吗？更多信息和信用在这里如何在Android中创建循环ImageView？