How to mask only certain parts of a bitmap in Android - android

I want to be able to use the following image to mask other bitmap. So basically, I'm trying to get the mask image and replace it's black content with another bitmap. Like this for example:
I'm able to use this mask and create a round version of the original bitmap, but that does not retain that orange border around it. Any thoughts on how I can accomplish this effect? Thanks.
The code that I am using (that only creates a round image) is the following:
private static Bitmap applyMask(ImageView imageView, Bitmap mainImage) {
Canvas canvas = new Canvas();
Bitmap result result = Bitmap.createBitmap(50, 50, Bitmap.Config.ARGB_8888);
canvas.setBitmap(result);
Paint paint = new Paint();
// resize image fills the whole canvas
canvas.drawBitmap(mainImage, null, new Rect(0, 0, 50, 50), paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
canvas.drawBitmap(sMaskImage, 0, 0, paint);
paint.setXfermode(null);
return result;
}

I use below code snipped to set masked images, this sample "bm" is my bitmap and "mMaskSource" is the resource id of mask object position in my drawable folder.
Bitmap mask = BitmapFactory.decodeResource(getResources(), mMaskSource);
Bitmap result = Bitmap.createBitmap(mask.getWidth(), mask.getHeight(),
Config.ARGB_8888);
Canvas mCanvas = new Canvas(result);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
bm = Bitmap.createScaledBitmap(bm, mask.getWidth(), mask.getHeight(),
true);
mCanvas.drawBitmap(bm, 0, 0, null);
mCanvas.drawBitmap(mask, 0, 0, paint);
paint.setXfermode(null);
And finally you can use "result" bitmap object however you wish.

Related

Android - Black BG color issue in canvas masking

I an creating an android application in which i am going to crop a bitmap image using path in canvas.
I am able to cut the bitmap using path but it leaves black background on the remaining portion of the bitmap.
Below is my code to cut a bitmap with path and mask in canvas.
public Bitmap cropBitmap(Path path){
Bitmap maskImage = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Bitmap.Config.ARGB_8888);
Canvas maskCanvas = new Canvas(maskImage);
maskCanvas.drawColor(0, PorterDuff.Mode.CLEAR);
Paint pathPaint = new Paint();
pathPaint.setAntiAlias(true);
pathPaint.setXfermode(null);
pathPaint.setStyle(Style.FILL);
pathPaint.setColor(Color.WHITE);
maskCanvas.drawPath(path,pathPaint);
Bitmap resultImg = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Bitmap.Config.ARGB_8888);
Canvas mCanvas = new Canvas(resultImg);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
mCanvas.drawBitmap(bitmap, 0, 0, null);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
mCanvas.drawBitmap(maskImage, 0, 0, paint);
return resultImg;
}
and below is the input image with path.
and below is the result which i am getting right now.
I want to remove that black background portion.
that black portion should be transparent.
Is there any way i can remove that black portion and make it transparent?

Draw Text Over Bitmap

I'm trying to put text over map marker but it always appears under it.
First I convert drawable to bitmap and then draw text on it. drawable to bitmap conversion works fine, I only have a problem with text overlay.
I have already tried these:
Adding text to a bitmap in memory in Android
https://stackoverflow.com/a/7328777/3423468
https://stackoverflow.com/a/8831182/3423468
and many more with no luck.
This is my current method:
Bitmap drawableToBitmap(Drawable drawable)
{
var bitmap = Bitmap.createBitmap(drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight(), Bitmap.Config.ARGB_8888);
var canvas = new Canvas(bitmap);
if (shouldDrawText)
{
Paint paint = new Paint();
paint.setColor(Color.WHITE);
paint.setStrokeWidth(40);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_OVER)); // Text Overlapping Pattern
//canvas.drawBitmap(bitmap, 0, 0, paint);
canvas.drawText("Testing...", 10, 10, paint);
}
drawable.SetBounds(0, 0, canvas.Width, canvas.Height);
drawable.Draw(canvas);
return bitmap;
}
Any ideas what I'm doing wrong?
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_OVER)); // Text Overlapping Pattern
Here you use SRC_OVER, which means the source will be over the DST will be under. The DST is the new pixels to be drawn.
You should use DST_OVER to draw the new pixels on top of the old pixels.
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_OVER)); // Text Overlapping Pattern
See here an overview of how porterduff works

Fit image inside png Image (Frame)

I have a png image which I want to use as a frame for images in ImageView.
Sorry, it's white that's why invisible
Like this but with sides curved
What is the solution?
I've tried by converting png to patch 9, setting background of parent and source of image view, but none worked. Image doesn't fit inside.
I've done it using PorterDuff. Designed an extra image just with curved border and applied PorterDuff.Mode.SRC_OVER inside setImageResource of Custom Image View.
Here is the overriden function
#Override
public void setImageResource(int resId) {
Bitmap rawBmp = BitmapFactory.decodeResource(getContext().getResources(), resId);
Bitmap rawMask = BitmapFactory.decodeResource(getContext().getResources(), R.drawable.image_frame_arc_filled);
Bitmap rawBorderMask = BitmapFactory.decodeResource(getContext().getResources(), R.drawable.image_frame_arc);
Bitmap bmp = Bitmap.createScaledBitmap(rawBmp, rawBmp.getWidth(), rawBmp.getHeight(), true);
Bitmap mask = Bitmap.createScaledBitmap(rawMask, bmp.getWidth(), bmp.getHeight(), true);
Bitmap borderMask = Bitmap.createScaledBitmap(rawBorderMask, mask.getWidth(), mask.getHeight(), true);
Bitmap bitmap = Bitmap.createBitmap(mask.getWidth(), mask.getHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(bitmap);
canvas.drawBitmap(bmp, 0, 0, null);
Paint maskPaint = new Paint();
maskPaint.setXfermode(
new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
canvas.drawBitmap(mask, 0, 0, maskPaint);
maskPaint = new Paint();
maskPaint.setXfermode(
new PorterDuffXfermode(PorterDuff.Mode.SRC_OVER));
canvas.drawBitmap(borderMask, 0, 0, maskPaint);
this.setImageBitmap(bitmap);
}

android stroke over bitmap

Hi i am merging to image my first image take shape of second image now i just want to draw a store over the final image but stroke should be in shape and not in square my code for bitmap are below
public Bitmap starShape(Bitmap original,Bitmap oldmask){
Bitmap mask = Bitmap.createScaledBitmap(oldmask, original.getWidth(), original.getHeight(), false);
Bitmap result = Bitmap.createBitmap(mask.getWidth(), mask.getHeight(), 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(original, 0, 0, null);
mCanvas.drawBitmap(mask, 0, 0, paint);
paint.setXfermode(null);
return result;
}

Android : Constructing bitmap from RECT

Can we construct a bitmap from a rect.
I draw a bitmap in a rect and want strokes drawn on the bitmap image become part of the image.
I am wondering if I can construct a bitmap from a Rect so the new bitmap has the old image and the strokes as a single image.
Thank You
You can always take a canvas to help you create an already decoded bitmap the way you want:
Bitmap originalBmp = null;//Here goes original Bitmap...
ImageView img = null;//Any imageview holder you are using...
Bitmap modifiedBmp = Bitmap.createBitmap(100, 100, Bitmap.Config.ARGB_8888);//Configure with your proper size and color
Canvas canvas = new Canvas(modifiedBmp);
//At this point the modified bitmap has the original one, starting from here, you can add any overlay you want...
canvas.drawBitmap(originalBmp, 0, 0, new Paint());
//And do all the other modifications you want here...
canvas.drawLines(new float[]{}, null);
canvas.drawCircle(x, y, radius, null);
//At this point the modified bitmap will have anything you added
img.setImageBitmap(modifiedBmp);
// IF YOU ARE OVERRIDING ONDRAW METHOD
public void onDraw(Canvas canvas){
//Here DO your DRAW BITMAP NOTE: paint must be already created...
canvas.drawBitmap(bt, 0, 0, paint);
paint.setColor(Color.BLACK);
paint.setStrokeWidth(3);
canvas.drawRect(30, 30, 80, 80, paint);
super.onDraw(canvas);
}
Regards!
Yes you can , Using canvas you can draw something on your old bimtap .
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);
// do some canvas drawing
canvas.drawBitmap(bitmap, rect, rect, paint);

Categories

Resources