android - 带圆角和内阴影的 ImageView

Question

我需要制作一个带有圆角和内阴影的缩略图 View 。通常我用 9 个补丁制作 ImageView 帧，到目前为止这对我很有帮助，但是这次我需要的效果需要在图像顶部(而不仅仅是在它周围)绘制内部阴影。这导致我扩展 ImageView 类并覆盖 onDraw() 方法。

public class ThumbnailImageView extends ImageView {

经过许多教程(感谢 StackOverflow!)，我最终得到了 onDraw() 方法的代码:

@Override
protected void onDraw(Canvas canvas) {
    if (mBitmap == null) {
        return;
    }

    int radius = 4;
    int padding = 2;
    int bleed = 2;
    RectF frame = new RectF(padding, padding, getWidth() - padding, getHeight() - padding);

    mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    mPaint.setColor(0xFF000000);
    canvas.drawRoundRect(frame, radius, radius, mPaint);

    Shader bitmapShader = new BitmapShader(mBitmap, TileMode.CLAMP, TileMode.CLAMP);
    mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    mPaint.setColor(0xFF000000);
    mPaint.setMaskFilter(new BlurMaskFilter(bleed, Blur.INNER));
    mPaint.setShader(bitmapShader);
    canvas.drawRoundRect(frame, radius, radius, mPaint);
}

我基本上在做的是首先绘制一个黑色圆角矩形，然后在其顶部绘制一个带有渐变边缘(使用 BlurMaskFilter)的圆角位图。结果就是我想要的: mBitmap 值在 ImageView 构造函数中初始化，如下所示:

mDrawable = getDrawable();
if (mDrawable != null) {
    mBitmap = ((BitmapDrawable) mDrawable).getBitmap();
}

问题是我完全覆盖了 onDraw()(没有调用 super.onDraw())，所以我必须将所有图像预缩放到所需的缩略图大小(例如 96x96)，否则只有左上角绘制图像的一角。当我将以下 xml 值分配给 ThumbnailImageView 时，我希望能够利用框架所做的所有缩放:

android:id="@+id/thumb"
android:layout_width="96dp"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="fitCenter"

为此，我认为我应该以某种方式调用 super.onDraw()，同时获得我需要的效果。我设法通过向 Canvas 添加剪切路径来获得圆角矩形，但我找不到添加内部阴影的方法。这是新的 onDraw() 代码:

@Override
protected void onDraw(Canvas canvas) {
    int radius = 4;
    int padding = 4;        
    RectF frame = new RectF(padding, padding, getWidth() - padding, getHeight() - padding);
    Path clipPath = new Path();
    clipPath.addRoundRect(frame, radius, radius, Path.Direction.CW);
    canvas.clipPath(clipPath);
    super.onDraw(canvas);
    // add inner shadow
}

我可以看到两种选择:

1) 正确预缩放 ImageView 的位图。但是最好的地方在哪里呢？在它的构造函数中？在框架似乎正在做的 onDraw() 方法中？该框架是否甚至可以调整任何位图的大小，或者是否有另一种方法可以在 Canvas 上绘制缩放图像而不会影响性能？

2) 在 super.onDraw() 到目前为止绘制的内容之上添加内部阴影层，但我对如何做到这一点没有任何想法。

任何帮助将不胜感激。

谢谢!

Answer 1

查看 Eric(来自 squareup)去年 Oreilly 的 AndoridOpen session 上的演讲 Material ，他的演讲标题为 Beautiful Android 它有大量的信息可以帮助你。

我希望他们在某个地方有他的演示视频。我找不到。很抱歉。

编辑:感谢@mykola 提供yt link