redondeadas - hacer imagen redonda android studio

Mapa de bits en ImageView con esquinas redondeadas

Question

Tengo un ImageView y quiero hacerlo con rounded corners .

Yo uso esto:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<solid android:color="@null"/>
<stroke android:width="1dp"
android:color="#ff000000"/>
<corners android:radius="62px"/>
</shape>

Y establezca este código como fondo de mi imagen vista. Funciona, pero la imagen src que coloco en el ImageView se sale de los bordes y no se adapta a la nueva forma.

¿Cómo puedo solucionar el problema?

Answer 1

¡El método para hacer esquinas redondeadas para la visualización de imágenes en Android no es para los científicos! simplemente use un png con las curvas requeridas con el mismo color que el fondo y configure la superposición en FITXY.

Answer 2

Es extraño que aquí nadie haya mencionado RoundedBitmapDrawable de la biblioteca de soporte de Android v4. Para mí es la forma más sencilla de obtener esquinas redondeadas sin bordes. Aquí hay un ejemplo de uso:

RoundedBitmapDrawable roundedBitmapDrawable = RoundedBitmapDrawableFactory.create(getResources(), bitmap);
final float roundPx = (float) bitmap.getWidth() * 0.06f;
roundedBitmapDrawable.setCornerRadius(roundPx);

Answer 3

Haz una función que haga redondeada a tu mapa de bits usando lienzo.

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;
}

para más información:> here

Answer 4

La respuesta aceptada utiliza el recorte de ruta, pero no admite el suavizado. Ver los comentarios de Romain Guy en su post. "el recorte de ruta no admite el antialiasing y obtienes bordes irregulares".

curious-creature.com/2012/12/11/…

Hay una buena biblioteca (vinc3m1''s RoundedImageView) que supera las esquinas redondeadas en ImageView, pero solo admite los mismos radios en todas las esquinas. Así que hice una que puedes establecer diferentes radios en cada esquina.

No se basa en el trazado de trazado, ni en el redibujado. Solo dibuja una vez con el método canvas.drawPath() . Así que finalmente obtuve el resultado que quería como abajo.

Consulte: https://github.com/pungrue26/SelectableRoundedImageView

Answer 5

Para mí el método de abajo hace el método de la magia. :) Este método acepta un objeto de mapa de bits y lo devuelve con esquinas redondeadas. roundPx es el número de píxeles redondeados que desea:

public static Bitmap getRoundedCornerBitmap(Bitmap bitmap) {
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 = 12;
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;
}

... o podría usar this biblioteca en lugar de ImageView sin ninguna otra codificación.

Answer 6

Se puede hacer con un dibujo de fondo, como se explica en muchas publicaciones, incluida esta, pero también es necesario establecer el recorte. Aquí un ejemplo completo:

El código:

AppCompatImageView iconView = findViewById(R.id.thumbnail);
iconView.setClipToOutline(true);

El diseño:

<android.support.v7.widget.AppCompatImageView
android:id="@+id/thumbnail"
android:layout_width="80dp"
android:layout_height="80dp"
android:contentDescription="@string/thumbnail"
android:scaleType="centerInside"
android:background="@drawable/round_view" <!--here set the drawable as background -->
tools:src="@mipmap/ic_user" />

El dibujo:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="10dp" />
</shape>

Answer 7

Si necesitas hacer Bitmap con diferentes radios de esquina y te recomiendo seguir el código:

private static Bitmap createRoundedRectBitmap(@NonNull Bitmap bitmap,
float topLeftCorner, float topRightCorner,
float bottomRightCorner, float bottomLeftCorner) {
Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(),
Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(output);
final int color = Color.WHITE;
final Paint paint = new Paint();
final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
final RectF rectF = new RectF(rect);
Path path = new Path();
float[] radii = new float[]{
topLeftCorner, bottomLeftCorner,
topRightCorner, topRightCorner,
bottomRightCorner, bottomRightCorner,
bottomLeftCorner, bottomLeftCorner
};
paint.setAntiAlias(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
path.addRoundRect(rectF, radii, Path.Direction.CW);
canvas.drawPath(path, paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.drawBitmap(bitmap, rect, rect, paint);
return output;
}

Answer 8

Si también necesita un borde, puede usar una imagen de caja redondeada con cuerpo transparente y blanco desde afuera. Por ejemplo:

y usar esto con la imagen de destino como a continuación:

<FrameLayout
android:layout_width="100px"
android:layout_height="100px" >
<ImageView
android:id="@+id/targetImage"
android:layout_width="100px"
android:layout_height="100px"
android:src="@drawable/app_icon"
android:layout_gravity="center" />
<ImageView
android:id="@+id/boxImage"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="fitXY"
android:src="@drawable/box" />

¡Gracias!

Answer 9

prueba este

public class CustomImageView extends ImageView {
public static float radius = 18.0f;
public CustomImageView(Context context) {
super(context);
}
public CustomImageView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CustomImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
@Override
protected void onDraw(Canvas canvas) {
//float radius = 36.0f;
Path clipPath = new Path();
RectF rect = new RectF(0, 0, this.getWidth(), this.getHeight());
clipPath.addRoundRect(rect, radius, radius, Path.Direction.CW);
canvas.clipPath(clipPath);
super.onDraw(canvas);
}
}

y

<your.pack.name.CustomImageView
android:id="@+id/selectIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:scaleType="centerCrop" />
CustomImageView iconImage = (CustomImageView )findViewById(R.id.selectIcon);
iconImage.setImageBitmap(bitmap);

o,

ImageView iv= new CustomImageView(this);
iv.setImageResource(R.drawable.pic);

Answer 10

public class RoundedImageView extends ImageView {
public RoundedImageView(Context context) {
super(context);
}
public RoundedImageView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public RoundedImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
Bitmap rounder = Bitmap.createBitmap(getWidth(),getHeight(),Bitmap.Config.ARGB_8888);
Canvas canvasRound = new Canvas(rounder);
Paint xferPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
xferPaint.setColor(Color.BLACK);
final int rx = this.getWidth(); //our x radius
final int ry = this.getHeight(); //our y radius
canvasRound.drawRoundRect(new RectF(0,0,rx,ry), rx, ry, xferPaint);
xferPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
canvas.drawBitmap(rounder, 0, 0, xferPaint);
}
}

Answer 11

public void drawRoundImage(boolean isEditPicEnable){
if(originalImageBitmap != null){
setBackgroundResource(R.drawable.ic_account_user_outer_circle_blue);
if (isEditPicEnable) {
setBackgroundResource(R.drawable.ic_account_user_outer_circle_white);
Bitmap mask = BitmapFactory.decodeResource(getResources(), R.drawable.ic_account_white_mask);
Bitmap mask1 = BitmapFactory.decodeResource(getResources(), R.drawable.ic_account_pencil_bg);
originalImageBitmap = Bitmap.createScaledBitmap(originalImageBitmap, mask.getWidth(), mask.getHeight(), true);
Bitmap result = Bitmap.createBitmap(mask.getWidth(), mask.getHeight(), Bitmap.Config.ARGB_8888);
Canvas mCanvas = new Canvas(result);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
mCanvas.drawBitmap(originalImageBitmap, 0, 0, null);
mCanvas.drawBitmap(mask, 0, 0, paint);
mCanvas.drawBitmap(mask1, 0, 0, null);
Bitmap mask2 = BitmapFactory.decodeResource(getResources(), R.drawable.ic_account_pencil);
mCanvas.drawBitmap(mask2, 0, 0, null);
setImageBitmap(result);
setScaleType(ScaleType.FIT_XY);
} else {
Bitmap mask = BitmapFactory.decodeResource(getResources(),R.drawable.ic_account_white_mask);
originalImageBitmap = Bitmap.createScaledBitmap(originalImageBitmap, mask.getWidth(),mask.getHeight(), true);
Bitmap result = Bitmap.createBitmap(mask.getWidth(), mask.getHeight(),Bitmap.Config.ARGB_8888);
Canvas mCanvas = new Canvas(result);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
mCanvas.drawBitmap(originalImageBitmap, 0, 0, null);
mCanvas.drawBitmap(mask, 0, 0, paint);
paint.setXfermode(null);
setImageBitmap(result);
setScaleType(ScaleType.FIT_XY);
}
}else{
setBackgroundResource(R.drawable.ic_account_user_outer_circle_blue);
setImageResource(R.drawable.my_ac_default_profile_pic);
}
}