Cómo redondear y encuadrar imagenes con Android

Buenas, cómo todos los miercoles vuelvo por nosinmiubuntu. Durante estas últimas semanas he ido publicando algunos trucos o técnicas que no se suelen encontrar en los manuales al uso de Android, sino que se encuentran a base de buscar y buscar en foros. Hoy voy a seguir con esa tónica y voy a hablaros de como redondear los bordes de una imagen y encuadrarla.



Bien, la cosa es muy sencilla, cogemos una imagen ya sea en nuestra aplicación, en la tarjeta SD o descargándola, redondeamos los bordes de esta para que no tenga un aspecto tan frío con esos bordes cuadrados y se la mostramos al usuario por pantalla.


public static Bitmap getRoundedCornerBitmap( Drawable drawable, boolean square) {
     int width = 0;
     int height = 0;
     
     Bitmap bitmap = ((BitmapDrawable) drawable).getBitmap() ;
     
     if(square){
      if(bitmap.getWidth() < bitmap.getHeight()){
       width = bitmap.getWidth();
       height = bitmap.getWidth();
      } else {
       width = bitmap.getHeight();
          height = bitmap.getHeight();
      }
     } else {
      height = bitmap.getHeight();
      width = bitmap.getWidth();
     }
     
        Bitmap output = Bitmap.createBitmap(width, height, Config.ARGB_8888);
        Canvas canvas = new Canvas(output);

        final int color = 0xff424242;
        final Paint paint = new Paint();
        final Rect rect = new Rect(0, 0, width, height);
        final RectF rectF = new RectF(rect);
        final float roundPx = 90; 

        paint.setAntiAlias(true);
        canvas.drawARGB(0, 0, 0, 0);
        paint.setColor(color);
        canvas.drawRoundRect(rectF, roundPx, roundPx, paint);

        paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
        canvas.drawBitmap(bitmap, rect, rect, paint);

        return output;
}



Para hacer el efecto que os he descrito solo necesitáis este método, este recibirá como parámetros un objeto Drawable que es la imagen que vamos a tratar y ademas un boolean que lo que va a hacer es hacer cuadrada la imagen o no. Esto es muy útil cuando no sabemos los tamaños de las imágenes que vamos a tratar y decimos que todas irán cuadradas para no perjudicar el diseño de la aplicación.


El método comienza convirtiendo a Bitmap nuestra imagen, despues de eso, si la imagen va a ser cuadrada cogemos el menor de los tamaños para el ancho y alto.


Luego creamos un nuevo Bitmap con las dimensiones antes calculadas, y un lienzo (canvas) donde haremos el efecto redondeado. canvas lo instanciamos con el Bitmap output sobre el que realizará los cambios y finalmente devolverá este bitmap modificado.


Aquí lo realmente importante es la variable roundPx la cual nos dará el ángulo de curvatura de nuestros bordes, cuanto más grande sea, más redondeada será la foto. Podéis hacer que sea totalmente redonda si ponéis el valor a 360 y hacéis que sea cuadrada la foto.

Una vez se aplican todos los efectos, el objeto canvas pinta el bitmap con todas las configuraciones tomando como base bitmap y devolviendo output.


Veamos ahora como utilizar este método, en primer lugar, el método lo podeis poner en vuestra activity principal para hacer pruebas por simplicidad, pero lo mejor siempre es que os lleveis este método a una clase para poder utilizarlo con más comodidad en toda vuestra aplicación.


ImageView imageView = new ImageView(this);
imageView.setImageBitmap(getRoundedCornerBitmap(getResources().getDrawable(R.id.image), true));


En nuestro layout definimos un objeto ImageView que llamaremos imageView y en nuestro activity antes de nada inicializamos este objeto, después seteamos directamente la imagen llamando a nuestro método de redondear imagenes. El objeto drawable lo obtenemos gracias a getResources y getDrawable, al cual le indicamos una imagen cualquiera de nuestra aplicación (las que están en la carpeta drawable).


Esta vez la imagen utilizada está guardada previamente en nuestra aplicación y lo cierto es que podríamos editarla nosotros y nos ahorraríamos este esfuerzo innecesario, lo realmente interesante sería disponer de un repositorio de imagenes en un servidor y nutrirnos de él para enriquecer nuestra aplicación. En próximas entregas veremos como descargar una imagen para que las podáis utilizar en vuestras aplicaciones. Por el momento espero que os haya sido útil este truco.

Comments are closed.