two filled paths one upon the other - android

I can't manage the following and I hope someone have a hint for me?
I have 2 areas (filled paths) one upon the other. The lower one is filled completely in blue. The upper one I would like the fill in red partly with a specific pattern ( for example with lines ). So at the end I have a filled area with blue and red striped.
In my tries the upper one overlaps the lower one, so blue is not seen.
I tried to do this with bitmapshader but do not succeed.
BitmapShader mShader1 = new BitmapShader(makeBitmap1(),
Shader.TileMode.REPEAT,
Shader.TileMode.REPEAT);
paint.setShader(mShader1);
canvas.drawPath(cpath.path, paint);
private static Bitmap makeBitmap1() {
//Bitmap bm = Bitmap.createBitmap(10, 10, Bitmap.Config.RGB_565);
//Bitmap bm = Bitmap.createBitmap(10, 10, Bitmap.Config.ALPHA_8);
Bitmap bm = Bitmap.createBitmap(10, 10, Bitmap.Config.ARGB_4444);
//Bitmap bm = Bitmap.createBitmap(10, 10, Bitmap.Config.ARGB_8888);
Canvas c = new Canvas(bm);
c.drawColor(Color.RED);
Paint p = new Paint();
p.setColor(0xFF000000);
//p.setColor(Color.BLUE);
c.drawRect(2, 2, 8, 8, p);
return bm;
}

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?

Stretch Rectangle and Fit Text on Multiple Lines in Canvas

I'm currently drawing a rectangle under a bitmap using the Canvas in Android. I am using the following code
BitmapFactory.Options options = new BitmapFactory.Options();
options.inPreferredConfig = Bitmap.Config.ARGB_8888;
Bitmap bitmap = BitmapFactory.decodeFile(file.getPath(), options);
Bitmap b = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight() + 100, Bitmap.Config.ARGB_8888);
Canvas c = new Canvas(b);
c.drawBitmap(bitmap, 0, 0, null);
Paint myPaint = new Paint();
myPaint.setColor(Color.rgb(0, 0, 0));
myPaint.setStrokeWidth(10);
Rect r = new Rect(0, bitmap.getHeight(), bitmap.getWidth(), bitmap.getHeight() + 100);
c.drawRect(r, myPaint);
Paint textPaint = new Paint();
textPaint.setTextSize(20);
textPaint.setColor(Color.WHITE);
textPaint.setTextAlign(Paint.Align.CENTER);
int width = r.width();
int numOfChars = textPaint.breakText(description,true,width,null);
int start = (altText.length()-numOfChars)/2;
c.drawText(description,start,start+numOfChars,r.exactCenterX(),r.exactCenterY(),textPaint);
iv.setImageBitmap(b);
The bitmap draws fine and the rectangle draws directly below it. The text draws centered inside the rectangle. My issue is that the text (which varies in length) draws outside the rectangle. What I would like to happen is have the text skip to a new line when it reaches the end of the rectangle (which is the same width as the bitmap)
This a xkcd comic reader, the alt text is the text I am trying to fit in the rectangle, the image is the comic itself which varies in width (and height)

How to mask only certain parts of a bitmap in 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.

Two Images as background in ImageButton?

I am using a ImageButton which will have an Image as background which i am getting dynamically at run time through code.Now i want to set a play image above the previous image so that both should be visible.Any help will be greatly appreciated.Thanks
You will need to merge images:
public static Bitmap mergeBitmaps(Bitmap original, Bitmap overlay) {
Bitmap result = Bitmap.createBitmap(original.getWidth(), original
.getHeight(), Config.ARGB_8888);
Canvas canvas = new Canvas(result);
Paint paint = new Paint();
paint.setAntiAlias(true);
canvas.drawBitmap(original, 0, 0, paint);
canvas.drawBitmap(overlay, 0, 0, paint);
return result;
}
Try adding your image as Background and the image you want above it as source.

draw circle on bitmap

i've written an app that captures a picture and saves it on the sdcard. i then can load that image into an imageview to display it. i'd like to draw a circle on the bitmap before i display it. the code below displays the bitmap but no circle, any ideas why the circle is not there?
thanks.
BitmapFactory.Options bfo = new BitmapFactory.Options();
bfo.inSampleSize = 5;
Bitmap bm = BitmapFactory.decodeByteArray(imageArray, 0, imageArray.length, bfo);
Log.e(TAG, bm.toString());
//imageview.setImageBitmap(bm);
Bitmap bmOverlay = Bitmap.createBitmap(bm.getWidth(), bm.getHeight(), bm.getConfig());
canvas = new Canvas(bmOverlay);
Paint paint = new Paint();
paint.setColor(Color.RED);
canvas.drawBitmap(bm, new Matrix(), null);
canvas.drawCircle(750, 14, 11, paint);
imageview.setImageBitmap(bmOverlay);
You might check bm.getWidth. If you are using a sample size of 5 then your image will be 5 times smaller than the original, causing your circle to disappear off the right side of the image.
You could try:
paint.setStrokeWidth(10);
canvas.drawCircle(50, 50, 25);
just as a sanity check.

Categories

Resources