ฉันมีบิตแมปและต้องการครอบตัดพื้นที่วงกลมจากบิตแมปนี้ พิกเซลทั้งหมดนอกวงกลมควรโปร่งใส ฉันจะทำเช่นนี้ได้อย่างไร?
ฉันมีบิตแมปและต้องการครอบตัดพื้นที่วงกลมจากบิตแมปนี้ พิกเซลทั้งหมดนอกวงกลมควรโปร่งใส ฉันจะทำเช่นนี้ได้อย่างไร?
คำตอบ:
หลังจากการระดมความคิดเป็นเวลานานฉันพบวิธีแก้ปัญหา
public Bitmap getCroppedBitmap(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());
paint.setAntiAlias(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
// canvas.drawRoundRect(rectF, roundPx, roundPx, paint);
canvas.drawCircle(bitmap.getWidth() / 2, bitmap.getHeight() / 2,
bitmap.getWidth() / 2, paint);
paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
canvas.drawBitmap(bitmap, rect, rect, paint);
//Bitmap _bmp = Bitmap.createScaledBitmap(output, 60, 60, false);
//return _bmp;
return output;
}
static
และใช้ในคลาสยูทิลิตี้ที่ไม่สร้างอินสแตนซ์ของวิธีการคงที่ที่คล้ายกัน
canvas.drawCircle(bitmap.getWidth() / 2, bitmap.getHeight() / 2, bitmap.getWidth() / 2, paint);
public static Bitmap getCircularBitmap(Bitmap bitmap) {
Bitmap output;
if (bitmap.getWidth() > bitmap.getHeight()) {
output = Bitmap.createBitmap(bitmap.getHeight(), bitmap.getHeight(), Config.ARGB_8888);
} else {
output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getWidth(), 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());
float r = 0;
if (bitmap.getWidth() > bitmap.getHeight()) {
r = bitmap.getHeight() / 2;
} else {
r = bitmap.getWidth() / 2;
}
paint.setAntiAlias(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
canvas.drawCircle(r, r, r, paint);
paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
canvas.drawBitmap(bitmap, rect, rect, paint);
return output;
}
คุณสามารถทำให้มุมมองภาพของคุณเป็นวงกลมโดยใช้RoundedBitmapDrawable
นี่คือรหัสสำหรับการบรรลุผล RoundImageview:
ImageView profilePic=(ImageView)findViewById(R.id.user_image);
//get bitmap of the image
Bitmap imageBitmap=BitmapFactory.decodeResource(getResources(), R.drawable.large_icon);
RoundedBitmapDrawable roundedBitmapDrawable=RoundedBitmapDrawableFactory.create(getResources(), imageBitmap);
//setting radius
roundedBitmapDrawable.setCornerRadius(50.0f);
roundedBitmapDrawable.setAntiAlias(true);
profilePic.setImageDrawable(roundedBitmapDrawable);
@Gene แสดงความคิดเห็นเกี่ยวกับคำตอบข้างต้นที่แนะนำให้ใช้clipPath
เป็นตัวเลือกในการครอบตัดรูปภาพเป็นวงกลม
ต่อไปนี้เป็นการนำไปใช้อย่างสะอาดหมดจด:
public static Bitmap GetBitmapClippedCircle(Bitmap bitmap) {
final int width = bitmap.getWidth();
final int height = bitmap.getHeight();
final Bitmap outputBitmap = Bitmap.createBitmap(width, height, Config.ARGB_8888);
final Path path = new Path();
path.addCircle(
(float)(width / 2)
, (float)(height / 2)
, (float) Math.min(width, (height / 2))
, Path.Direction.CCW);
final Canvas canvas = new Canvas(outputBitmap);
canvas.clipPath(path);
canvas.drawBitmap(bitmap, 0, 0, null);
return outputBitmap;
}
สิ่งนี้สามารถเพิ่มลงในคลาสยูทิลิตี้
c.drawBitmap(b, 0, 0, null);
ได้ซึ่งใช้การแปลงข้อมูลประจำตัวเริ่มต้น
ฉันคิดว่าโซลูชันนี้ทำงานได้ดีขึ้นกับสี่เหลี่ยมผืนผ้าทุกประเภทเปลี่ยนขนาดพิกเซลหากคุณต้องการให้ภาพเล็กหรือใหญ่:
public static Bitmap getCircleBitmap(Bitmap bm) {
int sice = Math.min((bm.getWidth()), (bm.getHeight()));
Bitmap bitmap = ThumbnailUtils.extractThumbnail(bm, sice, sice);
Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(output);
final int color = 0xffff0000;
final Paint paint = new Paint();
final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
final RectF rectF = new RectF(rect);
paint.setAntiAlias(true);
paint.setDither(true);
paint.setFilterBitmap(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
canvas.drawOval(rectF, paint);
paint.setColor(Color.BLUE);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth((float) 4);
paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
canvas.drawBitmap(bitmap, rect, rect, paint);
return output;
}
สิ่งนี้สามารถทำได้อย่างง่ายดายใน xml เช่นกันโดยไม่ต้องครอบตัดบิตแมปจริงคุณเพียงแค่สร้างมาสก์รูปภาพแบบวงกลมแล้ววางทับรูปภาพจริงของคุณ นี่คือส่วนของรหัสที่ฉันใช้:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval" >
<gradient android:startColor="#00FFFFFF" android:endColor="#00FFFFFF"
android:angle="270"/>
<stroke android:width="10dp" android:color="#FFAAAAAA"/>
<RelativeLayout
android:id="@+id/icon_layout"
android:layout_width="@dimen/icon_mask"
android:layout_height="@dimen/icon_mask"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" >
<ImageView
android:id="@+id/icon"
android:layout_width="@dimen/icon"
android:layout_height="@dimen/icon"
android:layout_centerInParent="true"
android:scaleType="fitXY" >
</ImageView>
<ImageView
android:id="@+id/icon_mask"
android:layout_width="@dimen/icon_mask"
android:layout_height="@dimen/icon_mask"
android:layout_centerInParent="true"
android:background="@drawable/circle"
android:scaleType="fitXY" >
</ImageView>
</RelativeLayout>
dimen.xml
<dimen name="icon">36dp</dimen>
<dimen name="icon_mask">55dp</dimen>
มุมมองภาพ OutPut:
หวังว่าคงจะมีประโยชน์สำหรับใครบางคน !!! :)
คุณสามารถใช้รหัสนี้มันจะทำงาน
private Bitmap getCircleBitmap(Bitmap bitmap) {
final Bitmap output = Bitmap.createBitmap(bitmap.getWidth(),
bitmap.getHeight(), Bitmap.Config.ARGB_8888);
final Canvas canvas = new Canvas(output);
final int color = Color.RED;
final Paint paint = new Paint();
final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
final RectF rectF = new RectF(rect);
paint.setAntiAlias(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
canvas.drawOval(rectF, paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.drawBitmap(bitmap, rect, rect, paint);
bitmap.recycle();
return output;
}
คุณสามารถใช้รหัสนี้มันจะทำงาน
public Bitmap getRoundedShape(Bitmap scaleBitmapImage) {
int targetWidth = 110;
int targetHeight = 110;
Bitmap targetBitmap = Bitmap.createBitmap(targetWidth,
targetHeight,Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(targetBitmap);
Path path = new Path();
path.addCircle(((float) targetWidth - 1) / 2,
((float) targetHeight - 1) / 2,
(Math.min(((float) targetWidth),
((float) targetHeight)) / 2),
Path.Direction.CCW);
canvas.clipPath(path);
Bitmap sourceBitmap = scaleBitmapImage;
canvas.drawBitmap(sourceBitmap,
new Rect(0, 0, sourceBitmap.getWidth(),
sourceBitmap.getHeight()),
new Rect(0, 0, targetWidth, targetHeight), new Paint(Paint.FILTER_BITMAP_FLAG));
return targetBitmap;
}
ฉันขอแนะนำให้เพิ่มbitmap.recycle()
หากคุณไม่ต้องการอีกต่อไปจะป้องกันข้อผิดพลาด OutOfMemory
นี่คือตัวแปร Kotlin โดยใช้วิธีการขยาย
/**
* Creates new circular bitmap based on original one.
*/
fun Bitmap.getCircularBitmap(config: Bitmap.Config = Bitmap.Config.ARGB_8888): Bitmap {
// circle configuration
val circlePaint = Paint().apply { isAntiAlias = true }
val circleRadius = Math.max(width, height) / 2f
// output bitmap
val outputBitmapPaint = Paint(circlePaint).apply { xfermode = PorterDuffXfermode(PorterDuff.Mode.SRC_IN) }
val outputBounds = Rect(0, 0, width, height)
val output = Bitmap.createBitmap(width, height, config)
return Canvas(output).run {
drawCircle(circleRadius, circleRadius, circleRadius, circlePaint)
drawBitmap(this@getCircularBitmap, outputBounds, outputBounds, outputBitmapPaint)
output
}
}
สำหรับ Peaple ที่ต้องการตรงกลางของสี่เหลี่ยมผืนผ้า (me) ให้เพิ่มสิ่งนี้ก่อนตัด:
public static Bitmap cropBitmapToBlock(Bitmap bitmap) {
if (bitmap.getWidth() >= bitmap.getHeight()){
return Bitmap.createBitmap(
bitmap,
bitmap.getWidth()/2 - bitmap.getHeight()/2,
0,
bitmap.getHeight(),
bitmap.getHeight()
);
}else{
return Bitmap.createBitmap(
bitmap,
0,
bitmap.getHeight()/2 - bitmap.getWidth()/2,
bitmap.getWidth(),
bitmap.getWidth()
);
}
}
จากคำตอบของ [Jachumbelechao Unto Mantekilla] รหัสนี้ใช้งานได้ดีสำหรับผู้ที่กำลังมองหาโซลูชัน Kotlin:
fun cropCircleFromBitmap(originalBitmap: Bitmap): Bitmap {
val size = Math.min(originalBitmap.width, originalBitmap.height)
val bitmap = ThumbnailUtils.extractThumbnail(originalBitmap, size, size)
var output = Bitmap.createBitmap(bitmap.width, bitmap.height, Bitmap.Config.ARGB_8888)
val canvas = Canvas(output)
val paint = Paint()
val rect = Rect(0, 0, bitmap.width, bitmap.height)
val rectF = RectF(rect)
paint.isAntiAlias = true
paint.isDither = true
paint.isFilterBitmap = true
canvas.drawARGB(0, 0, 0, 0)
paint.color = 0xffff0000.toInt()
canvas.drawOval(rectF, paint)
paint.color = Color.BLUE
paint.style = Paint.Style.STROKE
paint.strokeWidth = 4f
paint.xfermode = PorterDuffXfermode(PorterDuff.Mode.SRC_IN);
canvas.drawBitmap(bitmap, rect, rect, paint)
return output
}
ตอนนี้คำตอบที่ถูกต้อง:
private Bitmap getCroppedBitmap(Bitmap bitmap, Integer cx, Integer cy, Integer radius) {
int diam = radius << 1;
Bitmap targetBitmap = Bitmap.createBitmap(diam, diam, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(targetBitmap);
final int color = 0xff424242;
final Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
canvas.drawCircle(radius, radius, radius, paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.drawBitmap(bitmap, -cx+radius, -cy+radius, paint);
return targetBitmap;
}
โคตินฟูคอนติออน
fun getRoundedCornerBitmap(bitmap: Bitmap, pixels: Int): Bitmap {
val output = Bitmap.createBitmap(bitmap.width, bitmap.height, Bitmap.Config.ARGB_8888)
val canvas = Canvas(output)
val color = -0xbdbdbe
val paint = Paint()
val rect = Rect(0, 0, bitmap.width, bitmap.height)
val rectF = RectF(rect)
val roundPx = pixels.toFloat()
paint.isAntiAlias = true
canvas.drawARGB(0, 0, 0, 0)
paint.color = color
canvas.drawRoundRect(rectF, roundPx, roundPx, paint)
paint.xfermode = PorterDuffXfermode(PorterDuff.Mode.SRC_IN)
canvas.drawBitmap(bitmap, rect, rect, paint)
return output
}
เรียกตามรหัสนี้
holder.itemFriendImage.setImageBitmap(ImageConverter.getRoundedCornerBitmap(bitmap,600))
ฉันเชื่อว่าวิธีแก้ปัญหาที่ง่ายที่สุดคือการสร้าง BitmapShader ของ Bitmap ของคุณส่งผ่านไปยังวัตถุสีของคุณแล้วเรียกสิ่งที่ต้องการ canvas.drawCircle (cx, cy, radius, paint);
ตัวอย่างเช่น
Paint p = new Paint();
p.setShader(new BitmapShader(myBitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP));
canvas.drawCircle(getWidth() / 2, getHeight() / 2, getHeight() / 2, p);
นี่คือวิธีที่https://github.com/hdodenhof/CircleImageViewได้ทำเช่นกันคุณสามารถอ่านซอร์สโค้ดได้ที่นี่: https://github.com/hdodenhof/CircleImageView/blob/master/circleimageview/src/main/java /de/hdodenhof/circleimageview/CircleImageView.java
**Jst Add this to your image Id and get the circuler image.**
imgUserProfile.setImageBitmap(getCircularCenterCropBitmap(bitmap, (int) (150 * denisty)));
Method:-
public void Bitmap getCircularCenterCropBitmap(Bitmap originalBmp, int diameter) {
Bitmap resizedBmp = BitmapUtils.getScaledCroppedBitmap(originalBmp, diameter, diameter);
return BitmapUtils.getRoundedCircularBitmap(resizedBmp, diameter / 2);
}
ไม่แน่ใจว่านี่เป็นคำถามเกี่ยวกับการเขียนโปรแกรม แต่ ...
วิธีแก้ปัญหาที่ง่ายที่สุดคือทำให้พื้นที่ภายนอกโปร่งใสในบิตแมปต้นทาง มิฉะนั้นคุณจะต้องคำนวณพิกเซลที่อยู่นอกวงกลมและตั้งค่าอัลฟาตามนั้น (alpha = 0 เพื่อความโปร่งใสทั้งหมด)