wake-up-neo.net

Bitmap in ImageView mit abgerundeten Ecken

Ich habe ein ImageView und möchte es mit rounded corners machen.

Ich benutze das: 

<?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>

Und setzen Sie diesen Code als Hintergrund für meine Bildansicht. Es funktioniert, aber das SRC-Bild, das ich auf die ImageView-Funktion gesetzt habe, verlässt die Grenzen und passt sich der neuen Form nicht an.

Wie kann ich das Problem lösen?

44
BoraBora

probier diese : 

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

und 

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

oder,

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

Es ist seltsam, dass niemand hier RoundedBitmapDrawable von Android Support Library v4 erwähnt hat. Für mich ist es der einfachste Weg, um abgerundete Ecken ohne Grenzen zu kommen. Hier ist ein Beispiel für die Verwendung:

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

Erstellen Sie eine Funktion, die mithilfe der Zeichenfläche auf Ihre Bitmap gerundet wird.

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

für mehr Info:> hier

18
Ketan Ahir

Die akzeptierte Antwort verwendet Pfadbeschneidungen, jedoch kein Anti-Aliasing. Siehe Romain Guys Kommentare zu seinem Beitrag. msgstr "Pfadbeschneidungen unterstützen kein Antialiasing und Sie erhalten gezackte Kanten." 

http://www.curious-creature.com/2012/12/11/Android-recipe-1-image-with-rounded-corners/

Es gibt eine gute Bibliothek (ved3m1s RoundedImageView), die abgerundete Ecken in ImageView unterstützt, sie unterstützt jedoch an allen Ecken nur die gleichen Radien. Also habe ich einen so gemacht, dass man an jeder Ecke verschiedene Radien einstellen kann.

Es ist weder auf das Beschneiden von Pfaden noch auf das Neuzeichnen angewiesen. Es zeichnet nur einmal mit der canvas.drawPath()-Methode. So bekam ich endlich das Ergebnis, das ich gerne unten wollte.

enter image description here

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

9
김준호

Wenn Sie auch Rahmen benötigen, dann: 1. Sie können ein abgerundetes Bild mit transparentem Körper und von außen weiß verwenden. Zum Beispiel:

Rounded box

und verwende dies mit einem Zielbild wie folgt:

<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" />

  1. Das Hinzufügen von CardView als übergeordnetes Layout von ImageView ist ebenfalls eine gute Lösung.
5
Kalu Khan Luhar

Wenn Sie Bitmap mit verschiedenen Eckenradien erstellen möchten, empfehle ich den folgenden Code:

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

Für mich macht die Methode unten die Magie. :) Diese Methode akzeptiert ein Bitmap-Objekt und gibt es mit abgerundeten Ecken zurück. roundPx ist die Anzahl der abgerundeten Pixel, die Sie wünschen:

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

... oder Sie könnten this library anstelle von ImageView ohne weitere Codierung verwenden.

2

Es kann mit Hintergrund gezeichnet werden, wie in vielen Beiträgen, einschließlich dieser, erklärt werden, aber es muss auch ein Ausschnitt gesetzt werden .. Hier ein vollständiges Beispiel:

Der Code:

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

Das Layout:

<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" />

Die zeichnung:

<?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>
0
ByteArtisan
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);

    }

}
0
carlosgpn