Android: How to use a Canvas to mask a Bitmap? - android

I am fetching a Bitmap with Parse on my Android application.
final WeakReference<ImageView> weakImageView = new WeakReference<>(imageViewToMask);
fetchFromParse(getContext(), new Success() {
#Override
public void success(Bitmap image) {
if (weakImageView.get() != null) {
// Here how to make this image a MaskDrawable to mask it?
// MaskedDrawable d = new MaskedDrawable(bitmap, context, [canvas here]?)
// weakImageView.get().setImageDrawable(d);
weakImageView.get().setImageDrawable(image);
}
}
});
Now I want to mask this bitmap with another image, I found this answer in this thread:
public class MaskedDrawable extends Drawable {
public void draw(Bitmap original, Context context, Canvas canvas) {
Bitmap mask = BitmapFactory.decodeResource(context.getResources(), R.drawable.mask_image);
Bitmap result = Bitmap.createBitmap(mask.getWidth(), mask.getHeight(), Config.ARGB_8888);
Canvas tempCanvas = new Canvas(result);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setXfermode(new PorterDuffXfermode(Mode.DST_IN));
tempCanvas.drawBitmap(original, 0, 0, null);
tempCanvas.drawBitmap(mask, 0, 0, paint);
paint.setXfermode(null);
// How do I create this canvas user here?
canvas.drawBitmap(result, 0, 0, new Paint());
}
}
I already have the original bitmap and the context object, but I don't know how to use canvas. What to do?
Thanks for your help!

Related

Android Crop Bitmap Canvas

I want to create the crop bitmap functionality and have referred Android: Free Croping of Image but this sets the bitmap in another imageView.Now I know I can set the cropped bitmap in the canvas but I want to retain the original bitmap and want to do the cropping in onDraw() and not make a different bitmap and then set it in canvas.I have tried to implement the below code in onDraw but there is no cropping and bitmap remains as it is.Pleas help so that I can code this in onDraw() method of the CustomView.
compositeImageView = (ImageView) findViewById(R.id.our_imageview);
Bitmap bitmap2 = BitmapFactory.decodeResource(getResources(),
R.drawable.gallery_12);
Bitmap resultingImage = Bitmap.createBitmap(widthOfscreen,
heightOfScreen, bitmap2.getConfig());
Canvas canvas = new Canvas(resultingImage);
Paint paint = new Paint();
paint.setAntiAlias(true);
Path path = new Path();
for (int i = 0; i < SomeView.points.size(); i++) {
path.lineTo(SomeView.points.get(i).x, SomeView.points.get(i).y);
}
canvas.drawPath(path, paint);
paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
canvas.drawBitmap(bitmap2, 0, 0, paint);
compositeImageView.setImageBitmap(resultingImage);
my onDraw() method
#Override
protected void onDraw(Canvas canvas)
{
Bitmap bitmap1 = bitmap.copy(bitmap.getConfig(), true);
canvas.drawBitmap(bitmap1, 0,0, null);
Paint paint = new Paint();
paint.setAntiAlias(true);
Path path = new Path();
for (int i = 0; i < SomeView.points.size(); i++) {
path.lineTo(SomeView.points.get(i).x, SomeView.points.get(i).y);
}
canvas.drawPath(path, paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.drawBitmap(bitmap,0, 0, paint);
}

Android view to bitmap with tranparency

I need to convert TextView to bitmap. TextView has transparency using the setAlpha() method. I am using following code
Bitmap b = getBitmapFromView(textView , 150);
try {
b.compress(Bitmap.CompressFormat.PNG, 95, new FileOutputStream(watermarkImagePath));
} catch (FileNotFoundException e) {
e.printStackTrace();
}
public Bitmap getBitmapFromView(View view, int alpha) {
view.measure(View.MeasureSpec.UNSPECIFIED, View.MeasureSpec.UNSPECIFIED);
Bitmap bitmap = Bitmap.createBitmap(view.getMeasuredWidth(), view.getMeasuredHeight(),
Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(bitmap);
Paint alphaPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
alphaPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_OUT));
alphaPaint.setColor(Color.TRANSPARENT);
Toast.makeText(VideoCaptureActivity.this, "alpha" + alpha, Toast.LENGTH_LONG).show();
alphaPaint.setAlpha(alpha);
canvas.drawBitmap(bitmap,0,0,alphaPaint);
view.layout(0, 0, view.getMeasuredWidth(), view.getMeasuredHeight());
view.draw(canvas);
return bitmap;
}
but the issue is that the result image has no transparency :(
After trying different techniques what worked for me was to make bitmap from view with full opacity and then set tranparency of bitmap. Hope it will help others having same issue
Bitmap b = addTranparencyToBitmap(getBitmapFromView(view), (int)( view.getAlpha() * 255));
try {
b.compress(Bitmap.CompressFormat.PNG, 95, new FileOutputStream(watermarkImagePath));
} catch (FileNotFoundException e) {
e.printStackTrace();
}
public Bitmap getBitmapFromView(View view) {
Bitmap bitmap = Bitmap.createBitmap(view.getWidth(), view.getHeight(),
Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(bitmap);
view.draw(canvas);
return bitmap;
}
public Bitmap addTranparencyToBitmap(Bitmap originalBitmap, int alpha) {
Bitmap newBitmap = Bitmap.createBitmap(originalBitmap.getWidth(), originalBitmap.getHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(newBitmap);
Paint alphaPaint = new Paint();
alphaPaint.setAlpha(alpha);
canvas.drawBitmap(originalBitmap, 0, 0, alphaPaint);
return newBitmap;
}

android: MultiAutoCompleteTextView style like gmail

I want create custom MultiAutoCompleteTextView like gmail app:
I create custom view and extend to MultiAutoCompleteTextView and use Span , but I have problem, if there is not enough room for text and image then and span have (space) then view split them
and there is my code for custom view:
public class CustomMultiAutoCompleteTextView extends MultiAutoCompleteTextView {
#Override
public void setTokenizer(Tokenizer t) {
super.setTokenizer(t);
}
public CustomMultiAutoCompleteTextView(Context context) {
super(context);
}
public CustomMultiAutoCompleteTextView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CustomMultiAutoCompleteTextView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
#Override
protected void replaceText(CharSequence text) {
Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.avatar);
SpannableStringBuilder builder = new SpannableStringBuilder();
builder.append("g");
builder.setSpan(new ImageSpan(getContext(), getRoundedBitmap(bitmap)),
builder.length() - 1, builder.length(), 0);
builder.append(text);
builder.setSpan(new BackgroundColorSpan(Color.GRAY), 1, builder.length(), 0);
super.replaceText(builder);
}
public static Bitmap getRoundedBitmap(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;
}
}
So any body have a suggestion?
Check these two libraries:
kpbird/chips-edittext-library
splitwise/TokenAutoComplete
They are doing pretty much what you try to accomplish.
The idea behind at least first library - once onTextChanged happens, you do create a Bitmap out of TextView with text and setting CompoundDrawablesWithIntrinsicBounds (drown on the Canvas).
TextView textView = (TextView) lf.inflate(R.layout.chips_edittext, null);
textView.setText(c); // set text
int image = ((ChipsAdapter) getAdapter()).getImage(c);
textView.setCompoundDrawablesWithIntrinsicBounds(0, 0, image, 0);
// capture bitmapt of genreated textview
int spec = MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED);
textView.measure(spec, spec);
textView.layout(0, 0, textView.getMeasuredWidth(), textView.getMeasuredHeight());
Bitmap b = Bitmap.createBitmap(textView.getWidth(), textView.getHeight(),Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(b);
canvas.translate(-textView.getScrollX(), -textView.getScrollY());
textView.draw(canvas);
textView.setDrawingCacheEnabled(true);
Bitmap cacheBmp = textView.getDrawingCache();
Bitmap viewBmp = cacheBmp.copy(Bitmap.Config.ARGB_8888, true);
textView.destroyDrawingCache(); // destory drawable
// create bitmap drawable for imagespan
BitmapDrawable bmpDrawable = new BitmapDrawable(viewBmp);
bmpDrawable.setBounds(0, 0,bmpDrawable.getIntrinsicWidth(),bmpDrawable.getIntrinsicHeight());
// create and set imagespan
ssb.setSpan(new ImageSpan(bmpDrawable),x ,x + c.length() , Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
Once the image+name is just one bitmap - it can't be no longer wrapped and your issue is solved.

Canvas to Bitmap in android

I have a problem I want to convert a Canvas object to Bitmap then perform an operation on a bitmap and then convert this new Bitmap to the Canvas in OnDraw method, this is my code:
protected void onDraw(Canvas canvas)
{
canvas to Bitmap
Bitmap newBitmap = fastblur(bitmap,10);
c = newBitmap to Canvas
m_view.vDraw(c);
}
So you basically want to make a back buffer?
Bitmap backbuffer;
Canvas backbufferCanvas;
protected void onDraw(Canvas canvas){
if(backbuffer != null){
backbuffer = Bitmap.createBitmap(getWidth(), getHeight(), new Bitmap.Config());
backbufferCanvas = new Canvas(backbuffer);
}
//Draw to backbufferCanvas
canvas.draw(backbuffer, 0, 0);
}

Circle Transformation not being applied in gingerbread devices by the Picasso library

I'm using the code below to apply a round mask to a bitmap using Square's Picasso library. It works great on devices with android version 3.0 and higher, but it fails to work on gingerbread. There are no errors or exceptions displayed during runtime, instead, the mask simply does not seem to be applied to the original image.
public class CircleTransformation implements Transformation {
#Override
public Bitmap transform(Bitmap source) {
int size = Math.min(source.getWidth(), source.getHeight());
Bitmap finalBitmap = Bitmap.createBitmap(size, size, source.getConfig());
Canvas canvas = new Canvas(finalBitmap);
Paint paint = new Paint();
BitmapShader shader = new BitmapShader(source, BitmapShader.TileMode.CLAMP, BitmapShader.TileMode.CLAMP);
paint.setShader(shader);
paint.setAntiAlias(true);
float radius = size / 2f;
canvas.drawCircle(radius, radius, radius, paint);
source.recycle();
return finalBitmap;
}
#Override
public String key() {
return "circle";
}
}
All of the methods I'm using seem to be available since API level 1 so I'm kinda stuck. Any idea what could be the issue?
pd. this code was based on: https://gist.github.com/julianshen/5829333
I still don't know why this code doesn't work in gingerbread, but I was able to get it to work by using a round mask image:
public class PreHoneycombCircleTransformation implements Transformation {
#Override
public Bitmap transform(Bitmap source) {
int dim = Constants.BUBBLE_WIDTH;
Canvas canvas = new Canvas();
// placeholder for final image
Bitmap result = Bitmap.createBitmap(dim, dim, Bitmap.Config.ARGB_8888);
canvas.setBitmap(result);
Paint paint = new Paint();
paint.setFilterBitmap(false);
// resize image fills the whole canvas
canvas.drawBitmap(source, null, new Rect(0, 0, dim, dim), paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
canvas.drawBitmap(Util.getMaskImage(), 0, 0, paint);
paint.setXfermode(null);
if(result != source) {
source.recycle();
}
return result;
}
#Override
public String key() {
return "pre_circle";
}
}
The class below is another alternative, works both in Gingerbread and ICS. The code in the CircleTransformation doesn't work in ICS for me.
public class CircleTransform implements Transformation {
#Override
public Bitmap transform(Bitmap source) {
int size = Math.min(source.getWidth(), source.getHeight());
float radius = size / 2f;
final Paint paint = new Paint();
paint.setAntiAlias(true);
paint.setShader(new BitmapShader(source, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP));
Bitmap output = Bitmap.createBitmap(source.getWidth(), source.getHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(output);
canvas.drawCircle(radius, radius, radius, paint);
if (source != output) {
source.recycle();
}
return output;
}
#Override
public String key() {
return "circle";
}
}

Categories

Resources