I have a custom view that is showing an image inside a shape.
I used BitmapShader to fit my image into the shape with TileMode is CLAMP
Now I have a problem that when I am moving my image (using setLocalMatrix method) it make my image become terrible.
here is my image when moving around:
Here is my code:
BitmapShader shader=new BitmapShader(sbmp, TileMode.CLAMP, TileMode.CLAMP);
Matrix currMatrix = new Matrix(this.getMatrix());
currMatrix.postTranslate(currX, currY);
shader.setLocalMatrix(currMatrix);
mpaint.setShader(shader);
You can translate image with instead of localMatrix
int i = canvas.save();
canvas.translate(currX, currY);
//Here draw image
canvas.restoreToCount(i);
Related
I want to crop shape in Hexagon,Octagon and in circle shape.I have used Custom Image view class and use in xml for showing image. It works properly for different shapes.
Now i need to crop the image in user selected shape in next activity.i get image in next activity.
I tried this example:
Masking(crop) image in frame But the image didn't fit in shape.only part of the image get masked.
How i can achieve this?
Read this blog post by Romain Guy on how to make images with rounded corners. Using this technique you can create a variety of shapes.
How would this work?
If you have a predefined number of shapes, I'd suggest you create a class with a few Shapes defined by Paths. Now whenever your user asks for a different shape to be used on an ImageView, you create a Bitmap and return a bitmap from that class and put it on your ImageView.
For example a octagon shape would be something like this:
public static Bitmap drawOctagonShapedBitmap(Bitmap src) {
Bitmap dst = Bitmap.createBitmap(src.getWidth(), src.getHeight(), Bitmap.Config.ARGB_8888);
//Create an output as big as the actual bitmap.
Path octagon = null; //Create an octagon shape, it should be big enough to crop enough of the bitmap.
Canvas canvas = new Canvas(dst);
Paint mPaint = new Paint();
BitmapShader mBitmapShader = new BitmapShader(src, Shader.TileMode.CLAMP,
Shader.TileMode.CLAMP);
mPaint.setAntiAlias(true);
mPaint.setShader(mBitmapShader);
canvas.drawPath(octagon, mPaint);
return dst;
}
I have a 200x200px bitmap. I want to draw the top left 50x50px corner of my bitmap, on my canvas at coordinates 100,100 with a width and height of 50px, by using:
drawBitmap(Bitmap bitmap, Rect src, Rect dst, Paint paint)
This is what I've tried:
drawBitmap(myBitmap, new Rect(0,0,50,50), new Rect(100,100,150,150) , null);
What am I doing wrong?
From developer.android.com:
Parameters
bitmap The bitmap to be drawn
src May be null. The subset of the bitmap to be drawn
dst The rectangle that the bitmap will be scaled/translated to fit into
paint May be null. The paint used to draw the bitmap
What is missing in my code?
Thanks!
You need to change your rectangles. This is because, as described in the documentation, the first rectangle is the subset of the bitmap you want to draw, the second is the scaling/translating so basically the size of the destination draw (50x50)
So it should look like this:
drawBitmap(myBitmap, new Rect(100,100,150,150), new Rect(0,0,50,50) , null);
I draw a rectangle on a bitmap and its borders are antialiased or have some effects as you can see:
original image:
How to switch off that effect to get solid lines like this:
I use this code:
Bitmap mBuffer = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
gfx = new Canvas(mBuffer);
Paint paintNorm = new Paint();
paintNorm.setAntiAlias(false);
paintNorm.setStrokeWidth(1);
paintNorm.setStyle(Paint.Style.STROKE);
paintNorm.clearShadowLayer();
paintNorm.setDither(false);
paintNorm.setFilterBitmap(false);
paintNorm.setColor(0xFFA8A8A8);
gfx.drawRect(2,3,50,50, paintNorm);
My impression is that your bitmap is correctly drawn without anti-aliasing, but the blurry effect may come from the magnification when displaying the bitmap. Your screenshot is 245 pixels wide, but your code seems to indicate that the rectangle should be about 50 pixels or so.
I have an application which takes picture from camera .And normally this pictures have either rectangle shapes or square shapes.But due to make these pictures circular in shape i limited the shape to only square.So now my problem is to make this square picture into a circular shape having radius of half of width or height.And the clipped part should be removed from the picture.
Its same like making a circle from the square which touches midpoint of all of the faces of square.
I don't have any experience with canvas or other in built drawing functions.
For example i have square at first now i want to make image circular such that parts pointed by arrow should get clipped from image.
Note:as i have to work with camera images .quality is crucial factor.So please suggest the possible ways that will not affect the pixel quality and other important factors.
You can do it by masking the image with your desired shape, see this post for detailed info.
example code:
Resources resources = context.getResources();
Bitmap original = BitmapFactory.decodeResource(resources,R.drawable.original);
Bitmap mask = BitmapFactory.decodeResource(resources,R.drawable.mask);
Bitmap result = Bitmap.createBitmap(mask.getWidth(), mask.getHeight(), Config.ARGB_8888);
Canvas c = new Canvas(result);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
c.drawBitmap(original, 0, 0, null);
c.drawBitmap(mask, 0, 0, paint);
paint.setXfermode(null);
imageView.setImageBitmap(result);
I need to draw shapes on an image in my layout. This image needs to be able to change to another image programically, and I also need to draw shapes (rectangles and circles) over top of this image programically. The shapes will also change. I have an existing xml layout and would like to use this layout with the programmed image view in it. What's the easiest way to do this? Would it be possible to see a short example?
I figured out how to do this:
Here's how:
ImageView image = (ImageView) findViewById(R.id.mainImageView);
Bitmap bMap = BitmapFactory.decodeFile(imageFileString);
bMap = bMap.copy(Bitmap.Config.ARGB_8888 , true);
Canvas canvas = new Canvas(bMap);
Paint paint = new Paint();
paint.setAntiAlias(true);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(1);
paint.setColor(Color.BLUE);
canvas.drawCircle(x, y, radius, paint);
image.setImageBitmap(bMap);
Explanation: The first line gets the ImageView from the layout. I then grab the new image I want displayed using BitmapFactory.decodeFile, where imageFileString is the file location of the new image I want to display. After that I create a new canvas using the bitmap and draw on it. I then display the bitmap to the ImageView using image.setImageBitmap(bMap);.