I would like to create a 'graph paper' look to the Bitmap I am drawing via a Canvas, and trying to figure out the best way to do this.
I can't pass a source Bitmap containing the graph paper background to the Canvas constructor, as I am getting the Canvas in a SurfaceView via the .lockCanvas() call.
Some solutions I've tried:
I've tried implementing this solution in my SurfaceView's Thread.run(), but the issue I believe is when the BitmapDrawable is converted to a Bitmap... it loses the tiling properties.
canvas = mSurfaceHolder.lockCanvas(null);
BitmapDrawable TileMe = new BitmapDrawable(BitmapFactory.decodeResource(getResources(), R.drawable.editor_graph));
TileMe.setTileModeX(Shader.TileMode.REPEAT);
TileMe.setTileModeY(Shader.TileMode.REPEAT);
Bitmap b = TileMe.getBitmap();
canvas.drawBitmap(b, 0, 0, null);
If I use the Canvas.drawBitmap method that takes a destination RectF as a parameter, it looks like the bitmap will be tiled to fill the RectF... but how do I declare a RectF reliably that fills the entire view area?
Setting the Activities background to the desired graph paper look also doesn't work, as the bitmap/canvas layout is opaque and blocks that from being seen.
Any ideas how to achieve this?
You have two easy solutions:
Either use a BitmapDrawable, but instead of extracting the Bitmap, just call BitmapDrawable.draw(Canvas). Don't forget to set the drawable's bounds to fill your drawing area.
Create a Paint with a BitmapShader and draw a rectangle with it (this is basically what BitmapDrawable does).
I'm sure there is a way to get a tiled effect using a SurfaceView. Unfortunately, it looks like you can't use the BitmapDrawable with a canvas. So you would probably have to implement you own custom tiling method by creating your own series of Rect's on the Canvas and drawing a scaled bitmap to each one.
It honestly wouldn't be that hard. Just get the width/height of the view, and create an array of Rect's based on this data that you will draw the Bitmap to.
Alternatively, if you don't need to make modifications to the actual tiled background on the fly, just draw it as a background and draw the SurfaceView on top of it. That post you linked provided multiple solutions to tiling a BitmapDrawable that you could implement.
Related
I need to save a number of formatted circles to a Bitmap whenever a button is pushed, and then draw those circles to the canvas. I was looking around, but had a great deal of trouble finding resources on how to save a shape I had created that was not an already created resource file. Any advice on how to go about this would be appreciated.
Say you are in your custom view, but it should work also with a OnTouchListener in any view.
Create a mutable bitmap with Bitmap.createBitmap() with the same width and height of your view
use your logic for getting information of the circles, for example you can use onTouchEvent() to get the coordinates of you finger(s)
with this information you can use Bitmap.setPixel() to save it to the bitmap
optional, onDraw() you can draw your bitmap with Canvas.drawBitmap()
In case you need to draw shapes to the bitmap you can create a new Canvas(bitmap) and draw on this canvas: the pixels will be set on the bitmap.
I would like to draw text on a canvas using the Canvas.drawText call for a game application, and later be able to scale it as if it was a bitmap object. I do not want to dynamically change its font size, but I want to scale it applying an affine transform.
Is it possible? I cannot find an adequate API call in the documentation.
Thank you!
Using Matrix you can scale it and that apply the matrix tranformation to the canvas with Canvas.concat(Matrix m) . Do this before drawing the text onto the canvas.
Once it's on the Canvas, it's not a separate object that you can do anything to. What you can do is use the Canvas as an API for drawing to a bitmap:
Create a Bitmap.
Create a Canvas backed by that Bitmap.
Draw your text into the Canvas.
Hang on to your Bitmap and do whatever you want with it.
I am trying to tile a 20x20 background onto my Custom View but for some reason I am unable too.
BitmapDrawable background;
background = new BitmapDrawable(BitmapFactory.decodeResource(getResources(), R.drawable.back));
background.setTileModeXY(Shader.TileMode.REPEAT, Shader.TileMode.REPEAT);
background.draw(canvas);
Does anyone have an idea why it isn't working?
You can use BitmapDrawable, but you have to set the bounds first so it knows how much tiling to do:
BitmapDrawable background;
background = new BitmapDrawable(BitmapFactory.decodeResource(getResources(),R.drawable.back));
//in this case, you want to tile the entire view
background.setBounds(0, 0, myView.getWidth(), myView.getHeight());
background.setTileModeXY(Shader.TileMode.REPEAT, Shader.TileMode.REPEAT);
background.draw(canvas);
You are probably getting warnings in your log regarding SKImageDecoder failing. If you are creating the resource via xml you need to retreive it via (BitmapDrawable) getResources().getdrawable(id)
You have it backwards. Instead of passing your View's canvas to the bitmap's draw method, draw your Bitmap to the View's canvas using Canvas.drawBitmap
I have several bitmaps (game sprites) which I'd like to draw into another bitmap, however each non-transparent pixel of the source bitmap should be drawn using a single color, ignoring the original pixel color of the source. Basically, I'm trying to use the sprite as a "stamp" of a single color to be drawn into the destination bitmap.
I believe I should be using canvas.drawBitmap (Bitmap bitmap, Matrix matrix, Paint paint), however I'm not exactly sure how I should initialize the paint object. Is this approach correct?
You don't need to perform as many steps as Romain Guy suggests, just initialize your paint with the desired color, and use Paint.setColorFilter() with PorterDuff.Mode.SRC_ATOP
myPaint.setColorFilter(new PorterDuffColorFilter(myColor, PorterDuff.Mode.SRC_ATOP));
If your destination bitmap is transparent, draw all your sprites inside that bitmap normally (you can use a null Paint.) Then, draw a filled rectangle that covers the entire bitmap, using the Porter-Duff xfermode called SrcIn (Source In.)
I have a widget which looks like this:
Every cone is a "touchable element". Now I want to put a bitmap texture above each cone. However, bitmap images are all rectangular, so a bitmap texture above one cone would interfere with the bitmap texture above another cone.
I'm wondering what is the best solution to this approach. Should I just create an image which fits (as a rectangle) exactly above the cone and make the non used areas transparent?
A second question is, how do bitmap textures work with stretching? Because this whole circle draws itself to fit the whole screen size, while bitmap textures are pretty much one size.
Offhand I can't think of a better way to draw bitmaps over those cones than your own suggestion of using transparent zones.
However, I can help with your second question as stretching bitmaps is not hard. You've got a few options in the Canvas class. For example:
canvas.save();
canvas.scale(xRatio, yRatio);
canvas.drawBitmap(....);
canvas.restore();
You can also use a Matrix, using matrix.postScale(xRatio, yRatio), to then generate either a larger bitmap and draw it normally, or pass the matrix in to your canvas.drawBitmap(....) command to make it scale while it draws.
All of these methods assume you have access to the drawing canvas itself. If you are using a view, you can subclass it and override the onDraw(Canvas canvas) method to grab the canvas before it starts drawing it. If you're using a SurfaceHolder, then you should already know how to get the canvas.
Edit: I forgot the third method I was going to describe. You can use the canvas.drawBitmap(bitmap, srcRect, dstRect, paint) to also make the canvas scale the bitmap to fit the destination rectangle. In short, there are lots of methods to do this - pick the one that's easiest based on your application!