Android imageview 按比例显示图片

原创

mob649e8154f2e5 2024-03-16 05:53:26 ©著作权

文章标签 显示图片 Android 缩放 文章分类 Android 移动开发

©著作权归作者所有：来自51CTO博客作者mob649e8154f2e5的原创作品，请联系作者获取转载授权，否则将追究法律责任

Android ImageView 按比例显示图片

在Android开发过程中，我们经常会遇到需要在ImageView中显示图片的场景。但是有时候图片的大小和ImageView的大小并不匹配，这时就需要对图片进行按比例缩放以适应ImageView的大小。本文将介绍如何在Android应用中实现按比例显示图片的功能。

为什么要按比例显示图片

在Android开发中，如果图片的大小与ImageView的大小不一致，直接将图片设置到ImageView中会导致图片变形或者拉伸，影响用户体验。因此，为了保持图片的原始比例并且适应ImageView的大小，我们需要对图片进行按比例缩放。

实现按比例显示图片的方法

使用ScaleType属性

在Android中，ImageView提供了ScaleType属性来控制图片的缩放方式。常用的ScaleType属性包括：

FIT_XY：拉伸图片以适应ImageView的大小，可能导致图片变形
CENTER_CROP：按比例缩放并裁剪图片以填充整个ImageView
CENTER_INSIDE：按比例缩放图片以适应ImageView的大小，图片显示在ImageView中心

下面是一个使用ScaleType属性实现按比例显示图片的示例代码：

<ImageView
    android:id="@+id/imageView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:src="@drawable/image"
    android:scaleType="centerInside"/>

自定义ImageView

除了使用ScaleType属性，我们还可以通过自定义ImageView控件来实现按比例显示图片的功能。具体步骤如下：

继承ImageView类，重写onDraw方法
在onDraw方法中计算图片的缩放比例，根据ImageView的大小和图片的大小来确定缩放比例
调用Canvas的drawBitmap方法将图片绘制到ImageView上

下面是一个自定义ImageView控件的示例代码：

public class ScaleImageView extends ImageView {

    public ScaleImageView(Context context) {
        super(context);
    }

    public ScaleImageView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public ScaleImageView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

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

        if (drawable == null) {
            return;
        }

        int viewWidth = getWidth();
        int viewHeight = getHeight();

        int drawableWidth = drawable.getIntrinsicWidth();
        int drawableHeight = drawable.getIntrinsicHeight();

        float scaleX = (float) viewWidth / drawableWidth;
        float scaleY = (float) viewHeight / drawableHeight;
        float scale = Math.min(scaleX, scaleY);

        int dx = (int) ((viewWidth - drawableWidth * scale) / 2);
        int dy = (int) ((viewHeight - drawableHeight * scale) / 2);

        canvas.save();
        canvas.translate(dx, dy);
        canvas.scale(scale, scale);
        drawable.draw(canvas);
        canvas.restore();
    }
}