> 技术文档 > Android ImageView 使用详解

Android ImageView 使用详解

Android ImageView 使用详解

文章目录

    • 一、基本使用
      • 1. XML 中声明 ImageView
      • 2. Java/Kotlin 中设置图片
    • 二、图片缩放类型 (scaleType)
    • 三、加载网络图片
      • 1. 使用 Glide (推荐)
      • 2. 使用 Picasso
    • 四、高级功能
      • 1. 圆形图片
      • 2. 圆角图片
      • 3. 图片点击缩放动画
    • 五、性能优化
    • 六、常见问题解决

Android ImageView 使用详解

ImageView 是 Android 中用于显示图片的核心控件,下面我将从基本使用到高级功能全面介绍 ImageView 的用法。

一、基本使用

1. XML 中声明 ImageView

<ImageView android:id=\"@+id/imageView\" android:layout_width=\"wrap_content\" android:layout_height=\"wrap_content\" android:src=\"@drawable/my_image\" <!-- 设置图片资源 --> android:scaleType=\"centerCrop\"  android:adjustViewBounds=\"true\"  android:contentDescription=\"@string/image_desc\" /> 

2. Java/Kotlin 中设置图片

ImageView imageView = findViewById(R.id.imageView);// 设置图片资源imageView.setImageResource(R.drawable.my_image);// 设置BitmapBitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.my_image);imageView.setImageBitmap(bitmap);// 设置DrawableDrawable drawable = ContextCompat.getDrawable(this, R.drawable.my_image);imageView.setImageDrawable(drawable);

二、图片缩放类型 (scaleType)

ImageView 提供了多种缩放方式:

scaleType 值 描述 center 不缩放,居中显示 centerCrop 等比例缩放,填充整个View,可能裁剪 centerInside 等比例缩放,完整显示在View内 fitCenter (默认) 等比例缩放,居中显示 fitStart 等比例缩放,顶部/左边对齐 fitEnd 等比例缩放,底部/右边对齐 fitXY 不等比缩放填满整个View matrix 使用矩阵变换
// 代码设置缩放类型imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);

三、加载网络图片

1. 使用 Glide (推荐)

添加依赖:

implementation \'com.github.bumptech.glide:glide:4.12.0\'annotationProcessor \'com.github.bumptech.glide:compiler:4.12.0\'

使用示例:

Glide.with(this) .load(\"https://example.com/image.jpg\") .placeholder(R.drawable.placeholder) // 加载中显示 .error(R.drawable.error) // 加载失败显示 .centerCrop() // 缩放方式 .into(imageView);

2. 使用 Picasso

implementation \'com.squareup.picasso:picasso:2.8\'
Picasso.get() .load(\"https://example.com/image.jpg\") .placeholder(R.drawable.placeholder) .error(R.drawable.error) .resize(300, 300) // 调整大小 .centerCrop() .into(imageView);

四、高级功能

1. 圆形图片

使用 Glide 实现圆形图片:

Glide.with(this) .load(imageUrl) .apply(RequestOptions.circleCropTransform()) .into(imageView);

2. 圆角图片

自定义圆角转换器:

public class RoundedCornersTransformation extends BitmapTransformation { private final int radius; public RoundedCornersTransformation(int radius) { this.radius = radius; } // 实现转换逻辑...}// 使用Glide.with(this) .load(imageUrl) .transform(new RoundedCornersTransformation(20)) .into(imageView);

3. 图片点击缩放动画

imageView.setOnClickListener(v -> { if (imageView.getScaleType() == ImageView.ScaleType.CENTER_CROP) { imageView.animate().scaleX(1.5f).scaleY(1.5f).setDuration(300).start(); } else { imageView.animate().scaleX(1f).scaleY(1f).setDuration(300).start(); }});

五、性能优化

  1. 图片压缩

    BitmapFactory.Options options = new BitmapFactory.Options();options.inSampleSize = 2; // 缩小为1/2Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.large_image, options);imageView.setImageBitmap(bitmap);
  2. 内存回收

    @Overrideprotected void onDestroy() { super.onDestroy(); // 清除图片引用 imageView.setImageDrawable(null);}
  3. 使用合适的图片格式

    • PNG:适合有透明度需求的图片
    • JPEG:适合照片类图片
    • WebP:更高效的现代格式

六、常见问题解决

  1. OOM(内存溢出)问题

    • 使用图片加载库(Glide/Picasso)
    • 加载适当尺寸的图片
    • 在滚动列表中使用暂停加载功能
  2. 图片变形问题

    • 确保设置正确的scaleType
    • 使用adjustViewBounds=“true”
    • 保持图片原始宽高比
  3. 图片模糊问题

    • 提供足够高分辨率的图片
    • 避免过度缩放
    • 使用矢量图(SVG/VectorDrawable)替代位图

通过以上方法,可以充分利用ImageView展示各种图片,并确保良好的性能和用户体验。