I was wondering, how do I merge/join Android canvases. In the code below I have cnv_left which contains a left part of a button. cnv_center contains the center part. And cnv_text contains text.
What I need is to merge them all in cnv_joined , so that
cnv_left would go first.
then cnv_center.
cnv_text would be in center of cnv_center.
and a flipped cnv_left would be the last.
Here's my code so far:
public void drawButt()
{
float buttonScale = 1.0f; /// general button scale ratio
float buttonScaleCnt = 6.0f; /// button's center part stretch ratio
LinearLayout LinLay = (LinearLayout)findViewById(R.id.linearLayout1);
ImageView iv1 = new ImageView(this);
Bitmap bit_left = Bitmap.createBitmap(100, 100, Bitmap.Config.ARGB_8888);
Canvas cnv_left = new Canvas(bit_left);
cnv_left.scale(buttonScale,buttonScale);
SVG svg_left = SVGParser.getSVGFromResource(getResources(), R.raw.btleft);
Picture picture_left = svg_left.getPicture();
picture_left.draw(cnv_left);
Bitmap bit_center = Bitmap.createBitmap(100, 100, Bitmap.Config.ARGB_8888);
Canvas cnv_center = new Canvas(bit_center);
cnv_center.scale(buttonScaleCnt, buttonScale);
SVG svg_center = SVGParser.getSVGFromResource(getResources(), R.raw.btcnt);
Picture picture_cnt = svg_center.getPicture();
picture_cnt.draw(cnv_center);
Bitmap bit_text = Bitmap.createBitmap(100, 100, Bitmap.Config.ARGB_8888);
Canvas cnv_text = new Canvas(bit_text);
cnv_text.scale(buttonScale, buttonScale);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG); paint.setColor(Color.WHITE); paint.setTextSize(20);
cnv_text.drawText("R", 2, 30, paint);
Bitmap bit_joined = Bitmap.createBitmap(200, 200, Bitmap.Config.ARGB_8888);
Canvas cnv_joined = new Canvas(bit_joined);
/// somehow need to somehow join the above canvases into this cnv_joined...
iv1.setImageBitmap(bit_joined);
iv1.setPadding(5, 5, 5, 5);
LinLay.addView(iv1);
}
Any ideas? Oh, and one more thing, when I create empty bitmaps for my canvas ( Bitmap.createBitmap(100, 100... ), does it matter what size I give them? If yes, where should I get the correct sizes for them?
Thanks!
Size of Bitmaps matter. If you do Picture.draw to canvas smaller than Picture, image will be cropped to size of bitmap.
Call SVG.getBounds to get bounds and put them in Bitmap constructor.
To join Bitmaps together you have to draw bit_left, bit_center and bit_text on cnv_joined using drawBitmap.
Better way will be to draw SVGs and text directly on cnv_joined.
Related
I have a requirement, like drawing something in canvas and saving it to a larger image. As of now whatever I draw inside onDraw() method and save, it gives device provided image/canvas size, say something around 538(w)/852(h). I need image of almost double size, around 1000(w)/1500(h) without losing resolution. Any sample code, reference link would help definitely. Thanks in advance.
One way is to create Bitmap of desired size and draw on it using canvas:
int w = 1000, h = 1500;
Bitmap.Config conf = Bitmap.Config.ARGB_8888;
Bitmap bmp = Bitmap.createBitmap(w, h, conf);
Canvas canvas = new Canvas(bmp);
Finally you will have you bmp with your drawing and necessary dimentions.
EDIT::
#Override
protected void onDraw(Canvas canvas) {
int w = 1000, h = 1500;
Bitmap.Config conf = Bitmap.Config.ARGB_8888;
Bitmap bmp = Bitmap.createBitmap(w, h, conf);
Canvas mycanvas = new Canvas(bmp);
super.onDraw(mycanvas);
...
}
First get bitmap of your view using the function getDrawingCache(), then scale the bitmap as per your requirements.
view.buildDrawingCache();
Bitmap bitmap = view.getDrawingCache();
//bitmap = bitmap.createScaledBitmap(..as your requirements..);
EDIT
You are saying that you want image in higher quality. You can't simply get a higher quality image from a lower quality image. However you can apply bitmap filtering to get slightly better quality.
Bitmap bitmap = getDrawingCache();
Bitmap output = Bitmap.createBitmap(/*width, height, bla bla bla*/);
Canvas canvas = new Canvas(output);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.FILTER_BITMAP_FLAG);
Rect srcRect = new Rect(0,0,bitmap.getWidth(), bitmap.getHeight());
Rect destRect = new Rect(0,0,output.getWidth(), output.getHeight());
canvas.drawBitmap(bitmap, srcRect, destRect, paint);
In JavaFX u can create a new Image from a string(path), how would i go about creating a new Image from an existing javafx.scene.image.image?
as following:
Image image2 = new Image("my/res/flower.png", 100, 150, false, false);
But instead of the path an actual image object.
I want to change the size of the image.
There is typically no need to create a new Image instance in order to perform rescaling. The API allows you to view or draw scaled versions of an existing Image instance. For example, given
Image image = new Image("my/res/flower.png");
you can create an ImageView that displays a scaled version with
ImageView imageView = new ImageView(image);
imageView.setFitWidth(100);
imageView.setFitHeight(150);
or you can draw a scaled version to a canvas with
Canvas canvas = ... ;
GraphicsContext gc = canvas.getGraphicsContext2D();
gc.drawImage(image, 0, 0, image.getWidth(), image.getHeight(), 0, 0, 100, 150);
A late response, but since I ran into the same issue (I needed an Image to pass to setDragView() ), here is the solution I have implemented:
Image makeThumbnail(Image original) {
ImageView i = new ImageView(original);
i.setFitHeight(64); i.setFitWidth(64);
return i.snapshot(new SnapshotParameters(), new WritableImage(64, 64));
}
I have created BitMapSource from a list of RGBA pixels:
BitmapSource bmp = BitmapSource.Create(imageStrideInPixels, height, 96, 96, PixelFormats.Bgra32, null, imageData, imageStrideInPixels * pixelWidth);
I then create an image from the BitMapSource:
// create image and set image as source
Image BmpImg = new Image();
BmpImg.SetValue(Canvas.ZIndexProperty, 0);
BmpImg.Width = imageScaleWidth;
BmpImg.Height = imageScaleHeight;
BmpImg.Source = bmp;
I then add the Image to the Canvas:
mycanvas.Width = imageScaleWidth;
mycanvas.Height = imageScaleHeight;
mycanvas.Children.Clear();
mycanvas.Children.Add(BmpImg);
Canvas.SetLeft(BmpImg, 0); // to set position (x,y)
Canvas.SetTop(BmpImg, 0);
The problem is that it is not getting scaled to imageScaleWidth and imageScaleHeight, and it is being displayed half way down the canvas.
Note, I was able to do this in Java SWT by:
imageData = imageData.scaledTo(imageScaleWidth, imageScaleHeight);
gc.drawImage(imageData, 0, 0);
You can scale your image using a ScaleTransform:
// scale the original bitmap source
var transformedBitmap = new TransformedBitmap(
bmp,
new ScaleTransform(
imageScaleWidth / (double) bmp.PixelWidth,
imageScaleHeight / (double) bmp.PixelHeight));
// create image and set image as source
Image bmpImg = new Image();
bmpImg.SetValue(Canvas.ZIndexProperty, 0);
bmpImg.Source = transformedBitmap;
mycanvas.Width = imageScaleWidth;
mycanvas.Height = imageScaleHeight;
mycanvas.Children.Clear();
mycanvas.Children.Add(bmpImg);
Note that your image will be positioned at offset 0, 0 by default.
Instead of this
mycanvas.Children.Add(BmpImg);
Try this
mycanvas.Background = new VisualBrush(BmpImg);
This should render properly.
Are you sure the image is half way down the canvas and not the canvas itself is centered in its parent? I tested it and it appears that you can control the canvas position by setting vertical/horizontal alignment on canvas' parent. And also it scales properly when using the code you provided. However I created a BitmapSource in a different way. I used the following code:
PngBitmapDecoder decoder = new PngBitmapDecoder(new Uri(#"..."), BitmapCreateOptions.PreservePixelFormat, BitmapCacheOption.Default);
BitmapSource bmp = decoder.Frames[0];
I have the coordinates and I would like to draw a line or rectangular on a jpg image which is saved in my android device and then save the new file.
Is it possible? I am trying to us ImageIO but it isn't available in android or something goes wrong and it isn't acceptable?
Any idea or code?
This is how I was able to draw a green box on an existing JPEG.
Bitmap workingBitmap = BitmapFactory.decodeFile( mFullFilePath );
Bitmap mutableBitmap = workingBitmap.copy(Bitmap.Config.ARGB_8888, true);
// bitmap needs to be mutable
Canvas tmpCanvas = new Canvas(mutableBitmap);
// setup paint parameters
Paint paint = new Paint();
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth( 5 );
paint.setColor(Color.GREEN);
// Rect object was passed; use below to test
// Rect rect = new Rect( 0, 0, 10, 10 );
tmpCanvas.drawRect(rect, paint);
// write the updated file out as a JPG
writeExternalToCache( mutableBitmap, mFullFilePath );
see also:
https://stackoverflow.com/a/13119762/3474698
https://stackoverflow.com/a/8801391/3474698
I have a requirement where I will be having a background Image and one mask Image. Lets say the background Image is of Motorcycle and the mask will be used to hide the registration number. So the mask will be movable and also resize-able. Finally the combined Image will be generated with background image and Image mask. How we can achieve this ?
public Bitmap drawFacesOnBitmap(Context gContext, Bitmap bitmap) {
android.graphics.Bitmap.Config bitmapConfig = bitmap.getConfig();
// set default bitmap config if none
if(bitmapConfig == null) {
bitmapConfig = android.graphics.Bitmap.Config.ARGB_8888;
}
// resource bitmaps are imutable,
// so we need to convert it to mutable one
bitmap = bitmap.copy(bitmapConfig, true);
Canvas canvas = new Canvas(bitmap);
// new antialised Paint
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
// text color - #3D3D3D
paint.setColor(Color.GREEN);
// draw text to the Canvas center
Log.d("BITMAP DIMENS****", "bitmapWidth:"+bitmap.getWidth()+" & bitmapHeight:"+bitmap.getHeight());
android.graphics.Rect r = new android.graphics.Rect();
r.left = 200;
r.top = 200;
r.right = 400;
r.bottom = 400;
canvas.drawRect(r, paint);
return bitmap;
}
You can use this code to draw a rectangle on a bitmap. Edit it to meet your needs.