¿Cómo hacer un ImageView con esquinas redondeadas?
En Android, ImageView es un rectángulo de forma predeterminada. ¿Cómo puedo convertirlo en un rectángulo redondeado (recorte las 4 esquinas de mi mapa de bits para que sean rectángulos redondeados) en ImageView?
Tenga en cuenta que a partir de 2021, simplemente utiliceShapeableImageView
La respuesta es bastante tardía, pero para cualquier otra persona que esté buscando esto, puede realizar el siguiente código para redondear manualmente las esquinas de sus imágenes.
http://www.ruibm.com/?p=184
Este no es mi código, pero lo he usado y funciona de maravilla. Lo usé como ayuda dentro de una clase ImageHelper y lo amplié un poco para pasar la cantidad de difuminado que necesito para una imagen determinada.
El código final se ve así:
package com.company.app.utils;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.PorterDuffXfermode;
import android.graphics.Rect;
import android.graphics.RectF;
import android.graphics.Bitmap.Config;
import android.graphics.PorterDuff.Mode;
public class ImageHelper {
public static Bitmap getRoundedCornerBitmap(Bitmap bitmap, int pixels) {
Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap
.getHeight(), Config.ARGB_8888);
Canvas canvas = new Canvas(output);
final int color = 0xff424242;
final Paint paint = new Paint();
final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
final RectF rectF = new RectF(rect);
final float roundPx = pixels;
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;
}
}
Otra forma sencilla es utilizar un CardView con el radio de la esquina y un ImageView en el interior:
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:cardCornerRadius="8dp"
android:layout_margin="5dp"
android:elevation="10dp">
<ImageView
android:id="@+id/roundedImageView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="@drawable/image"
android:background="@color/white"
android:scaleType="centerCrop"
/>
</androidx.cardview.widget.CardView>
Se agregó el recorte a formas redondeadas a la Viewclase en API 21.
Sólo haz esto:
- Crea un dibujable de forma redondeada, algo como esto:
res/drawable/round_outline.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="10dp" />
...
</shape>
- Establece el dibujable como fondo de tu ImageView:
android:background="@drawable/round_outline" - Según esta documentación , todo lo que necesita hacer es agregar
android:clipToOutline="true"
Lamentablemente, hay un error y ese atributo XML no se reconoce. Por suerte, todavía podemos configurar el recorte en Java:
- En tu actividad o fragmento:
ImageView.setClipToOutline(true)
Así es como se verá:
Nota:
Este método funciona para cualquier forma dibujable (no solo redondeada). Recortará ImageView a cualquier contorno de forma que haya definido en su xml Drawable.
Nota especial sobre ImageViews
setClipToOutline()solo funciona cuando el fondo de la Vista está configurado en una forma dibujable. Si esta forma de fondo existe, Ver trata el contorno de la forma como los bordes para fines de recorte y sombreado.
Esto significa que, si desea utilizar setClipToOutline()para redondear las esquinas en un ImageView, su imagen debe configurarse usando android:srcen lugar de android:background(ya que el fondo debe configurarse con su forma redondeada). Si DEBE usar fondo para configurar su imagen en lugar de src, puede usar esta solución alternativa:
- Crea un diseño y configura su fondo según tu forma dibujable
- Envuelva ese diseño alrededor de su ImageView (sin relleno)
- ImageView (incluido cualquier otra cosa en el diseño) ahora se mostrará con una forma de diseño redondeada.
