I draw a bitmap image into a canvas with this code:the bitmap get from user galley
public class CanvasView extends View {
Bitmap canvasBitmap;
Canvas drawCanvas;
public CanvasView(Context context,AttributeSet attrs) {
super(context,attrs);
}
public void setCanvasPath(String bitmap_path) {
BitmapFactory.Options decode_options = new BitmapFactory.Options();
decode_options.inMutable = true;
canvasBitmap = BitmapFactory.decodeFile(bitmap_path,decode_options);
drawCanvas = new Canvas(canvasBitmap);
invalidate();
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
if (canvasBitmap != null) {
Matrix matrix=new Matrix();
Matrix m = drawCanvas.getMatrix();
RectF drawableRect = new RectF(0, 0, canvasBitmap.getWidth(), canvasBitmap.getHeight());
RectF viewRect = new RectF(0, 0, drawCanvas.getWidth(),drawCanvas.getHeight());
m.setRectToRect(drawableRect, viewRect, Matrix.ScaleToFit.CENTER);
canvas.drawBitmap(canvasBitmap,m , null);
}
}
}
but when i draw the bitmap it get out of the canvas view,i don't want to stretch the image,i want to my canvas act like image view in android.
Related
I am trying to have a custom EditText with a custom background which is not possible to draw using drawable XMLs
Here is what I have right now
public class EMEditText extends EditText {
private Bitmap framedBitmap;
public EMEditText(Context context, AttributeSet attrs) {
super(context, attrs);
// TODO Auto-generated constructor stub
}
#Override
protected void onDraw(Canvas canvas) {
if(framedBitmap == null) {
createDrawable(getWidth(), getHeight());
}
Paint paint = new Paint();
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
// canvas.drawBitmap(framedBitmap, 0, 0, paint);
}
private void createDrawable(int width, int height) {
// create a new bitmap of given size
Bitmap start = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(start);
RectF outerRect = new RectF(0, 0, width, height);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setColor(Color.WHITE);
// paint.setStrokeWidth(1);
// paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_OUT));
canvas.drawRoundRect(outerRect, height / 2, height / 2, paint);
framedBitmap = start;
}
}
What is probably wrong in your code is that you are creating your own Canvas object in createDrawable() method though onDraw() method gives you the right Canvas which you should use for your drawings.
So what you probably want is to change createDrawable(int width, int height) method to createDrawable(int width, int height, Canvas c). Your code should look like this then:
#Override
protected void onDraw(Canvas canvas) {
if(framedBitmap == null) {
createDrawable(getWidth(), getHeight(), canvas);
}
Paint paint = new Paint();
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
// canvas.drawBitmap(framedBitmap, 0, 0, paint);
}
private void createDrawable(int width, int height, Canvas c) {
// create a new bitmap of given size
Bitmap start = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
c.setBitmap(start);
RectF outerRect = new RectF(0, 0, width, height);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setColor(Color.WHITE);
// paint.setStrokeWidth(1);
// paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_OUT));
c.drawRoundRect(outerRect, height / 2, height / 2, paint);
framedBitmap = start;
}
As you can see, I changed also the body of your createDrawable() method so that it uses Canvas from onDraw() and sets it's Bitmap to the one created by you.
I have a canvas on which I draw lines:
//see code upd
I need to make the pipette tool which will take color from my canvas. How may I make it?
Code upd:
private static class DrawView extends View
{
...
public DrawView(Context context) {
super(context);
setFocusable(true);
mBitmap = Bitmap.createBitmap(640, 860, Bitmap.Config.ARGB_8888);
mCanvas = new Canvas(mBitmap);
mPath = new Path();
mBitmapPaint = new Paint(Paint.DITHER_FLAG);
this.setDrawingCacheEnabled(true);
}
#Override
protected void onDraw(Canvas canvas) {
canvas.drawColor(0xFFAAAAAA);
canvas.drawBitmap(mBitmap, 0, 0, mBitmapPaint);
canvas.drawPath(mPath, mPaint);
}
private void touch_up()
{
if(!drBool) //is true when I click pipette button
{
...
mCanvas.drawPath(mPath, mPaint); // lines draw
mPath.reset();
}else{
this.buildDrawingCache();
cBitmap = this.getDrawingCache(true);
if(cBitmap != null)
{
int clr = cBitmap.getPixel((int)x, (int)y);
Log.v("pixel", Integer.toHexString(clr));
mPaint.setColor(clr);
}else{
Log.v("pixel", "null");
}
}
drBool = false;
}
}
I see only "pixel"-"ffaaaaaa", or if I use mCanvas.drawColor(Color.GRAY) "pixel"-"ff888888"
A canvas is nothing more than a container which holds drawing calls to manipulate a bitmap. So there is no concept of "taking colour from a canvas".
Instead, you should examine the pixels of the bitmap of the view, which you can get with getDrawingCache.
In your views' constructor:
this.setDrawingCacheEnabled(true);
When you want the colour of a pixel:
this.buildDrawingCache();
this.getDrawingCache(true).getPixel(x,y);
This is very inefficient if you are calling it many times in which case, you might want to add a bitmap field and use getDrawingCache() to set it in ondraw().
private Bitmap bitmap;
...
onDraw()
...
bitmap = this.getDrawingCache(true);
Then use bitmap.getPixel(x,y);
Above answer returns me blank bitmap. This is my solution
#Override
protected void onDraw(Canvas canvas) {
...
bitmapUpdated = true;
}
And then for getting bitmap
public Bitmap getBitmapImage() {
if (bitmapUpdated) {
this.buildDrawingCache();
bitmapImage = Bitmap.createBitmap(this.getDrawingCache());
this.destroyDrawingCache();
}
return bitmapImage;
}
This works fine for me, without excessive overhead.
Perhaps better solution would be to override invalidate() and onDraw() so it uses your canvas, that is linked with your bitmap
Bitmap b = Bitmap.createBitmap(v.getWidth(), v.getHeight(), Bitmap.Config.ARGB_8888);
Canvas c = new Canvas(b);
v.draw(c);
return b;
I am attempting to draw a bitmap along a rectangle, but I am not sure how to go about it. Is there a way to tile a bitmap along a Rect object using a paint property or something? I have looked, but I can't find anything that makes it do what I need it too, most of the tiling options won't tile it for a specific instance, they tile it along the entire screen, so everything using that bitmap ends up having one big bitmap tiling along all of them at the same time, without scrolling or anything.
Any ideas? If you need more info let me know, its kind of a weird question so I know I probably didn't mention something important.
William
There are a couple ways that you can attack this. I'll outline two of them here...
One way:
You can define a BitmapDrawable around the Bitmap. Set its TileMode to repeat. Give it some bounds via setBounds(rect) where rect is your Rect instance.
Here's a brief example using a View onDraw as context:
public class MyView extends View {
Rect rect;
Bitmap mBitmap;
BitmapDrawable mDrawable;
public MyView(Context context) {
super(context);
rect = new Rect(0, 0, 100, 100);
mBitmap = loadBitmap();
mDrawable = new BitmapDrawable(context.getResources(), mBitmap);
mDrawable.setTileModeXY(TileMode.REPEAT, TileMode.REPEAT);
mDrawable.setBounds(rect);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
mDrawable.draw(canvas);
}
public Bitmap loadBitmap() {
// included only for example sake
Paint paint = new Paint();
paint.setColor(Color.RED);
Bitmap bm = Bitmap.createBitmap(10, 10, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(bm);
canvas.drawRect(0,0,10,10, paint);
paint.setStyle(Style.STROKE);
paint.setColor(Color.BLUE);
canvas.drawRect(0, 0, 9, 9, paint);
return bm;
}
}
Note:
You can also define a BitmapDrawable in xml instead of doing it in code.
Also, if you know that a drawable you are loading via getResources().getDrawable(resourceId) is indeed just a Bitmap, you can cast it to a BitmapDrawable and set the TileMode there. A la:
public class MyView extends View {
Rect rect;
BitmapDrawable mDrawable;
public MyView(Context context) {
super(context);
rect = new Rect(0, 0, 400, 240);
mDrawable = (BitmapDrawable) context.getResources().getDrawable(R.drawable.ic_launcher);
mDrawable.setTileModeXY(TileMode.REPEAT, TileMode.REPEAT);
mDrawable.setBounds(rect);
this.setBackgroundDrawable(context.getResources().getDrawable(R.drawable.ic_launcher));
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
mDrawable.draw(canvas);
}
}
This example shows the background being stretched, and a tiled version being draw over top of it.
Another way:
Loop in the x and y direction and repeatedly draw the bitmap into the rect:
public class MyView extends View {
Rect rect;
Bitmap mBitmap;
public MyView(Context context) {
super(context);
rect = new Rect(0, 0, 100, 100);
mBitmap = loadBitmap();
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
final int bmWidth = mBitmap.getWidth();
final int bmHeight = mBitmap.getHeight();
for (int y = 0, height = rect.height(); y < height; y += bmHeight) {
for (int x = 0, width = rect.width(); x < width; x += bmWidth) {
canvas.drawBitmap(mBitmap, x, y, null);
}
}
}
public Bitmap loadBitmap() {
// included only for example sake
Paint paint = new Paint();
paint.setColor(Color.RED);
Bitmap bm = Bitmap.createBitmap(10, 10, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(bm);
canvas.drawRect(0,0,10,10, paint);
paint.setStyle(Style.STROKE);
paint.setColor(Color.BLUE);
canvas.drawRect(0, 0, 9, 9, paint);
return bm;
}
}
I personally would go for the first (BitmapDrawable) method.
You can do it just like BitmapDrawable does:
Define Paint with bitmap shader and then draw rectangle with that paint:
> Paint paint = new Paint();
> paint.setShader(new BitmapShader(bitmap, Shader.TileMode.REPEAT, Shader.TileMode.REPEAT));
>
> canvas.drawRect(destRect, paint);
so I have a canvas, and I would like a certain image (Lets say image.png) to appear where the user touches. What would I use? OnTouch?
Can someone help me out? Here is my canvas class below. Right now I have a few random images and shapes drawn, but they happen right away, not when someone touches like I would like it.
Thanks in advance!
public class MyView extends View
private Canvas canvas;
private Bitmap bitmap;
public MyView(Context context) {
super(context);
}
protected void onSizeChanged(int curw, int curh, int oldw, int oldh) {
if (bitmap != null) {
bitmap .recycle();
}
canvas= new Canvas();
bitmap = Bitmap.createBitmap(curw, curh, Bitmap.Config.ARGB_8888);
canvas.setBitmap(bitmap);
}
public void destroy() {
if (bitmap != null) {
bitmap.recycle();
}
}
public void onTouch(Canvas canvas) {
Bitmap _scratch = BitmapFactory.decodeResource(getResources(), R.drawable.test);
canvas.drawColor(Color.TRANSPARENT);
canvas.drawBitmap(_scratch, 0, 0, null);
}
public void onDraw(Canvas canvas) {
//draw onto the canvas
Bitmap _scratch1 = BitmapFactory.decodeResource(getResources(), R.drawable.spacecat);
canvas.drawColor(Color.TRANSPARENT);
canvas.drawBitmap(_scratch1, 0, 0, null);
Paint myPaint = new Paint();
myPaint.setStrokeWidth(4);
myPaint.setColor(0xFF097286);
canvas.drawCircle(240, 40, 30, myPaint);
myPaint.setColor(0xFFF07222);
Point p1 = new Point();
Point p2 = new Point();
p1.x = 0;
p1.y = 0;
p2.x = 40;
p2.y = 55;
canvas.drawLine(p1.x, p1.y, p2.x, p2.y, myPaint);
float[] pts = new float[8];
pts[0] = 100;
pts[1] = 5;
pts[2] = 97;
pts[3] = 9;
pts[4] = 90;
pts[5] = 15;
pts[6] = 84;
pts[7] = 20;
myPaint.setColor(0xFF40FF40);
myPaint.setStrokeWidth(9);
myPaint.setAntiAlias(true);
canvas.drawPoints(pts, myPaint);
myPaint.setColor(0xFFF0FF00);
myPaint.setStrokeWidth(4);
myPaint.setStyle(Paint.Style.STROKE);
canvas.drawCircle(110, 150, 100, myPaint);
}}
I wrote an example for you :
public class MyView extends View {
boolean touching = false;
public MyView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
public MyView(Context context, AttributeSet attrs) {
super(context, attrs);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas); //To change body of overridden methods use File | Settings | File Templates.
if (touching) {
//You can draw other thing here. just draw bitmap for example.
Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher);
Rect source = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
Rect bitmapRect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
canvas.drawBitmap(bitmap, source, bitmapRect, new Paint());
}
}
#Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
touching = true;
invalidate();
break;
case MotionEvent.ACTION_CANCEL:
case MotionEvent.ACTION_UP:
touching = false;
invalidate();
break;
}
return super.onTouchEvent(event); //To change body of overridden methods use File | Settings | File Templates.
}
}
Can any body tell me to erase the paint on the image , in my application i was prepared the finger painting on image, if i want erase the paint it,s getting black color on image instead of erasing the image. my code is
public class MyView extends View {
int bh = originalBitmap.getHeight();
int bw = originalBitmap.getWidth();
public MyView(Context c) {
super(c);
//mBitmap = Bitmap.createScaledBitmap(originalBitmap,bw,bh,true);
mBitmap = Bitmap.createBitmap(bw,bh,Bitmap.Config.ARGB_8888);
mCanvas = new Canvas(mBitmap);
mPath = new Path();
mBitmapPaint = new Paint(Paint.DITHER_FLAG);
mBitmapPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC));
}
public MyView (Context c, int color) {
super(c);
mBitmap = Bitmap.createScaledBitmap(originalBitmap,bw,bh,true);
mCanvas = new Canvas(mBitmap);
mPath = new Path();
mBitmapPaint = new Paint(Paint.DITHER_FLAG);
mBitmapPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC)) ;
mCanvas.drawColor(color);
}
#Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
/*mBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
mCanvas = new Canvas(mBitmap);*/
}
#Override
protected void onDraw(Canvas canvas) {
canvas.drawColor(Color.TRANSPARENT);
canvas.drawBitmap(mBitmap, 0, 0, mBitmapPaint);
canvas.drawPath(mPath, mPaint);
}
for paint erase
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
You should draw on a transparent custom view placed over the original bitmap instead of modifying the orignal. That will keep it simple.
For that you can do
<RelativeLayout ....>
<ImageView ......set original bitmap to this/>
<CustomView ...... draw on this, you can erase too./>
</RelativeLayout>
For getting the modified bitmap call the getDrawingCache() method on that RelativeLayout. That will give you the combined bitmap image.
Hope this helps.
define a temporary bitmap and canvas, then draw canvas on that temporary bitmap and pass that bitmap to onDraw your work will be done,