如何在Android Glide中结合使用CenterCrop和自定义圆角变换(图片部分圆角矩形)

2024-01-09 14:34:33

如何在Android Glide中结合使用CenterCrop和自定义圆角变换(图片部分圆角矩形)

在这里插入图片描述

在Android开发中,使用Glide加载图片时,我们经常需要对图片进行特定的处理,比如裁剪和圆角变换,特别是一些设计稿,他可能只有上面2个圆角。这篇博客将指导您如何在Glide中结合使用CenterCrop和自定义圆角变换。

简介

Glide是一个流行的Android图像加载库,它提供了强大的图片处理和缓存功能。在许多情况下,我们需要对图片进行裁剪以适应UI的需求,并可能想要应用圆角以增强视觉效果。Glide提供了一种简单的方式来实现这些效果。通过在Glide侧先进行裁剪,避免做完圆角的图到了控件端因为scale未显示出圆角部分。

实现步骤

1. 创建自定义圆角变换

首先,我们需要创建一个自定义的BitmapTransformation,该变换只对图片的顶部应用圆角。这个类可以这样实现:

public class TopCornersRoundedTransformation extends BitmapTransformation {
    private final float radius; // 圆角半径

    public TopCornersRoundedTransformation(float radius) {
        this.radius = radius;
    }

    @Override
    protected Bitmap transform(@NonNull BitmapPool pool, @NonNull Bitmap toTransform, int outWidth, int outHeight) {
        return topRoundedCorners(pool, toTransform);
    }

    private Bitmap topRoundedCorners(BitmapPool pool, Bitmap source) {
        if (source == null) return null;

        Bitmap result = pool.get(source.getWidth(), source.getHeight(), Bitmap.Config.ARGB_8888);
        result.setHasAlpha(true);

        Canvas canvas = new Canvas(result);
        Paint paint = new Paint();
        paint.setAntiAlias(true);
        paint.setShader(new BitmapShader(source, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP));

        // 绘制圆角矩形(只对左上和右上角应用圆角)
        RectF rectF = new RectF(0f, 0f, source.getWidth(), source.getHeight());
        canvas.drawRoundRect(rectF, radius, radius, paint);

        // 绘制矩形以覆盖底部两个角
        RectF bottomRect = new RectF(0f, radius, source.getWidth(), source.getHeight());
        canvas.drawRect(bottomRect, paint);

        return result;
    }

    @Override
    public void updateDiskCacheKey(@NonNull MessageDigest messageDigest) {
        messageDigest.update(("top_corners_rounded" + radius).getBytes(CHARSET));
    }
}

在这里插入图片描述

2. 在Glide中使用变换

接下来,在Glide的加载链中,我们结合使用CenterCrop和我们的自定义圆角变换:

int radius = dpToPx(5); // 圆角半径,根据需要调整

Glide.with(mActivity)
    .load(getFirstImageUrl(productBean.getUrls()))
    .apply(new RequestOptions()
            .transforms(new CenterCrop(), new TopCornersRoundedTransformation(radius)))
    .into(pictureIV);

这段代码首先将图片进行CenterCrop处理,然后应用自定义的圆角变换。transforms方法允许我们链式地应用多个变换。

3. dpToPx方法

为了将dp单位转换为像素值,您可以使用如下方法:

public int dpToPx(int dp) {
    return (int) (dp * Resources.getSystem().getDisplayMetrics().density);
}

总结

通过结合使用CenterCrop和自定义的TopCornersRoundedTransformation,我们可以在Glide中轻松实现对图片的裁剪和圆角处理。这种方式既保留了图片的纵横比,又增加了视觉上的吸引力,非常适合现代的Android应用开发。

记住,Glide的变换功能非常强大,可以根据您的具体需求进行定制和扩展。
在这里插入图片描述

文章来源:https://blog.csdn.net/loveseal518/article/details/135424680
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。