Imágenes en Android: imageView

By DavidCS miércoles, agosto 19, 2015 0 Android Studio No tags Permalink 0

Las imágenes son un recurso que esta presente en cualquier aplicación, a continuación veremos como se muestran imágenes en Android, como modificarlas vía código, utilizarlas como si fuera un botón y algunas cosillas mas.

Imágenes en Android: XML.

Creamos un control ImageView en el que se mostrara la imagen que nosotros queramos, como siempre, vamos al layout XML de la actividad y escribimos:

<ImageView android:id="@+id/imagenLogo"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_launcher"
    android:maxWith="200dp"
    android:maxHeight="200dp"
    android:scaleType="fitCenter"
    android:contentDescription="@string/imagen_logo" />

<ImageView android:id="@+id/imagenLogo"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:src="@drawable/ic_launcher"

android:maxWith="200dp"

android:maxHeight="200dp"

android:scaleType="fitCenter"

android:contentDescription="@string/imagen_logo" />

android:id -> Id identificativo del control.
android:layout_width/height -> Determina el ancho/alto dentro del layout. Los valores posibles son “fill_parent“, desde API 8+ esta deprecado y ha sido sustituido por “match_parent“, toma la dimension de su layout contenedor, “wrap_content” toma la dimensión de su contenido.
android:src -> Ruta de la imagen que queremos mostrar, debería estar en “/res/drawable”
android:maxWith/Height-> Tamaño máximo que debe tener la imagen, por ejemplo, si esta imagen la selecciona el usuario, debe limitarse el tamaño o nos podría afectar al diseño de nuestra interfaz.
android:scaleType-> Con esta propiedad indicamos cómo debe adaptarse la imagen dentro de su contenedor. Posibles Valores: matrix, fitXY, fitStart, fitCenter, fitEnd, center, centerCrop y centerInside.
android:contentDescription-> Descripción breve del contenido de la imagen. No tiene representación visual pero con ciertas herramientas puede ayudar a los usuarios con discapacidades visuales.

Simplemente se vería nuestra imagen en el ImageView

Imágenes en Android: Vía Código.

Establecer las propiedades de las imágenes en Android vía código es bastante sencillo, esto puede ser útil si queremos modificar la imagen a mostrar en función de, por ejemplo, el idioma del usuario.

Como con los botones o los textos, primero nos creamos un objeto del tipo a tratar, en este caso de ImageView, y le asignamos el ID que le dimos por XML, posteriormente modificamos las propiedades que queramos tratar.

ImageView logo= (ImageView)findViewById(R.id.imagenLogo);
logo.setImageResource(R.drawable.ic_logo);

1 2	ImageView logo= (ImageView)findViewById(R.id.imagenLogo); logo.setImageResource(R.drawable.ic_logo);

Imágenes en Android: Imagen como botón.

En ocasiones queremos mostrar un botón personalizado y a pesar de que con Android tenemos cierto grado de personalización, podemos recurrir a imágenes con aspecto de botón y que trabajen exactamente igual que si lo fueran.

Para ello, esto se consigue con lo visto anteriormente, basta con crear la imagen en el XML y crear el objeto en el código. Una vez echo lo anterior implementamos su evento onClick y dentro metemos el código que queramos.

ImageView logo= (ImageView)findViewById(R.id.imagenLogo);

logo.setOnClickListener(new View.OnClickListener() {
    public void onClick(View arg0){

       //Aqui metemos el código que queramos

    }
});

ImageView logo= (ImageView)findViewById(R.id.imagenLogo);

logo.setOnClickListener(new View.OnClickListener() {

public void onClick(View arg0){

//Aqui metemos el código que queramos

}

});

Imágenes en Android: Imagen redondeada(RoundedBitmapDrawable).

Para dar un toque mas “moderno” a nuestra interfaz, podemos mostrar imágenes redondeadas, para ello tenemos que hacer uso de RoundedBitmapDrawable.

Resources resources = getResources();
Bitmap source = BitmapFactory.decodeResource(resources,R.drawable.sym_def_app_icon);
RoundedBitmapDrawable dr = RoundedBitmapDrawableFactory.create(resources, source);
dr.setCornerRadius(Math.max(src.getWidth(), src.getHeight()) / 2.0f);