Cómo redimensionar proporcionalmente la imagen de un ImageView cuyo valor de anchura es match_parent

Existe un problema, o bug, o simplemente lo han querido hacer así, en el objeto ImageView, en la programación en Android. Si asignas un ancho match_parent a dicho objeto, y una altura wrap_content, en el caso de que la imagen que vaya a colocarse como fuente tenga unas dimensiones superiores a las del ImageView, no parece haber problema alguno.

El inconveniente surge cuando la imagen que se asigna al objeto ImageView tiene unas dimensiones inferiores a dicho objeto. En este caso, la imagen aparece con las dimensiones originales, y no abarca el ImageView por completo.

En tal caso, por mucho que juegues con las distintas opciones y atributos del objeto ImageView, nunca se obtiene el resultado que se quiere. Puedes modificar la propiedad scaleType, adjustViewBounds, layout_height, layout_width, … y nada, no tendrás éxito.

Cómo hacer que una imagen de un ImageView se redimensione al tamaño del objeto por completo

Para conseguir el propósito de que la imagen del ImageView se redimensione al tamaño del objeto sin perder sus proporciones, la solución pasa por crear una nueva clase Java en nuestro proyecto que extienda a la clase ImageView y que corrija el problema que tenemos.

Para ello, en tu proyecto, crea una nueva clase. Nosotros la vamos a llamar ResizableImageView, y su código es el siguiente:

package com.mypackage;

import android.content.Context;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.widget.ImageView;

public class ResizableImageView extends ImageView {
   public ResizableImageView(Context context, AttributeSet attrs) {
      super(context, attrs);
   }

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

   @Override
   protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
      Drawable d = getDrawable();
      if (d == null) {
         super.setMeasuredDimension(widthMeasureSpec, heightMeasureSpec);
         return;
      }

      int imageHeight = d.getIntrinsicHeight();
      int imageWidth = d.getIntrinsicWidth();

      int widthSize = MeasureSpec.getSize(widthMeasureSpec);
      int heightSize = MeasureSpec.getSize(heightMeasureSpec);

      float imageRatio = 0.0F;
      if (imageHeight > 0) {
         imageRatio = imageWidth / imageHeight;
      }
      float sizeRatio = 0.0F;
      if (heightSize > 0) {
         sizeRatio = widthSize / heightSize;
      }

      int width;
      int height;
      if (imageRatio >= sizeRatio) {
         width = widthSize;
         height = width * imageHeight / imageWidth;
      } else {
         height = heightSize;
         width = height * imageWidth / imageHeight;
      }

      setMeasuredDimension(width, height);
   }
}

package com.mypackage;

import android.content.Context;

import android.graphics.drawable.Drawable;

import android.util.AttributeSet;

import android.widget.ImageView;

public class ResizableImageView extends ImageView {

public ResizableImageView(Context context, AttributeSet attrs) {

super(context, attrs);

}

public ResizableImageView(Context context) {

super(context);

}

@Override

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

Drawable d = getDrawable();

if (d == null) {

super.setMeasuredDimension(widthMeasureSpec, heightMeasureSpec);

return;

}

int imageHeight = d.getIntrinsicHeight();

int imageWidth = d.getIntrinsicWidth();

int widthSize = MeasureSpec.getSize(widthMeasureSpec);

int heightSize = MeasureSpec.getSize(heightMeasureSpec);

float imageRatio = 0.0F;

if (imageHeight > 0) {

imageRatio = imageWidth / imageHeight;

}

float sizeRatio = 0.0F;

if (heightSize > 0) {

sizeRatio = widthSize / heightSize;

}

int width;

int height;

if (imageRatio >= sizeRatio) {

width = widthSize;

height = width * imageHeight / imageWidth;

} else {

height = heightSize;

width = height * imageWidth / imageHeight;

}

setMeasuredDimension(width, height);

}

Una vez creada e implementada la clase ResizableImageView, lo que haremos ahora es modificar el XML del Layout de la vista donde se encuentre el ImageView sobre el que queremos hacer que se redimensione la imagen.

Supongamos que, previamente al cambio, el XML del ImageView a cambiar es el siguiente:

<ImageView
      android:id="@+id/miImagen"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:src="https://cdn1.professor-falken.com/@drawable/imagen"
/>

<ImageView

android:id="@+id/miImagen"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:src="https://cdn1.professor-falken.com/@drawable/imagen"

Pues simplemente tenemos que cambiar la clase de dicho objeto por la nueva clase creada, de la siguiente forma:

<com.mypackage.ResizableImageView
      android:id="@+id/miImagen"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:src="https://cdn1.professor-falken.com/@drawable/imagen"
/>

<com.mypackage.ResizableImageView

android:id="@+id/miImagen"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:src="https://cdn1.professor-falken.com/@drawable/imagen"

Con este clase y el cambio en el código XML, lograremos que la imagen contenida dentro del objeto ImageView se redimensione, manteniendo su proporcionalidad, incluso en los casos en los que la imagen tenga una dimensión menor que el contenedor.