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);
}
Related
Hello I have this code to create a circular bitmap, but I also want to draw a circle around this circular bitmap.
I mean like the circular bitmap inside and a tiny colored stroke around the circular bitmap.
I have tryed different solutions but the circle doesn't get draw normally.
The bitmap will be used as a marker in a MapView instance.
Here is my code (this was a test code to try to draw a black circle under the circular bitmap)
public static Bitmap convertToCircularBitmap(Bitmap bitmap) {
final Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Bitmap.Config.ARGB_8888);
final Canvas canvas = new Canvas(output);
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);
canvas.drawOval(rectF, paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.drawBitmap(bitmap, rect, rect, paint);
final Paint p = new Paint();
final Rect r = new Rect(0, 0, bitmap.getWidth() + 10, bitmap.getHeight() + 10);
final RectF rF = new RectF(rect);
p.setColor(Color.BLACK);
canvas.drawOval(rF, p);
bitmap.recycle();
return output;
}
Thank you!
You can use bellow codes:
public static Bitmap convertToCircularBitmap(Bitmap bitmap, int strokeSize) {
int size = bitmap.getWidth() / 2;
Bitmap output = Bitmap.createBitmap(bitmap.getWidth(), bitmap
.getHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(output);
final int color =0xff424242;
final Paint paint = new Paint();
paint.setAntiAlias(true);
paint.setColor(color);
canvas.drawCircle(size,size,size-strokeSize,paint);
final Rect rect = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.drawBitmap(bitmap, rect, rect, paint);
final int strokeColor = Color.rgb(0, 0, 0);
final Paint strokePaint = new Paint();
strokePaint.setAntiAlias(true);
strokePaint.setColor(strokeColor);
strokePaint.setStrokeWidth(strokeSize);
strokePaint.setStyle(Paint.Style.STROKE);
canvas.drawCircle(size,size,size-strokeSize,strokePaint);
return output;
}
I'm trying to convert Bitmap to RoundRect shape. And i'm confused to use
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.saveLayer();
It's ok if I drawRoundRect first.
public Bitmap transform(Bitmap bitmap) {
Drawable drawable = new BitmapDrawable(Resources.getSystem(), bitmap);
Bitmap destBitmap = Bitmap.createBitmap(bitmap.getWidth(),
bitmap.getHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(destBitmap);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
RectF srcRect = new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight());
canvas.drawRoundRect(srcRect, mRadiusX, mRadiusY, paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.saveLayer(srcRect, paint, Canvas.ALL_SAVE_FLAG);
drawable.setBounds(0, 0, bitmap.getWidth(), bitmap.getHeight());
drawable.draw(canvas);
canvas.restore();
return destBitmap;
}
But, it dosen't work if I draw bitmap first. Why?
public Bitmap transform(Bitmap bitmap) {
Drawable drawable = new BitmapDrawable(Resources.getSystem(), bitmap);
Bitmap destBitmap = Bitmap.createBitmap(bitmap.getWidth(),
bitmap.getHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(destBitmap);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
RectF srcRect = new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight());
drawable.setBounds(0, 0, bitmap.getWidth(), bitmap.getHeight());
drawable.draw(canvas);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
canvas.saveLayer(srcRect, paint, Canvas.ALL_SAVE_FLAG);
canvas.drawRoundRect(srcRect, mRadiusX, mRadiusY, paint);
canvas.restore();
return destBitmap;
}
Also, I don't want to create a new Bitmap, can I drawRoundRect on the bitmap directly to convert roundRect shape? like this:
public Bitmap transform(Bitmap bitmap) {
Canvas canvas = new Canvas(bitmap);
Paint paint = new Paint();
paint.setStyle(Paint.Style.FILL_AND_STROKE);
Path path = new Path();
path.addRoundRect(0, 0, bitmap.getWidth(), bitmap.getHeight(),50, 50,
Path.Direction.CW);
canvas.clipPath(path);
return bitmap;
}
Doesn't work.
I have some questions:
Do I have to "saveLayer" and "restore" if I use "PorterDuffXfermode"?
Do I have to create a new Bitmap, and draw on it ? can I draw the src Bitmap which is mutable?
I am create a custom ImageView with Pinch IN-OUT zoom and circular crop image.The Pinch in-out is wroking fine but when i trying to cropping image, can't get the particulr circle image. I'm using Pinch in-out working based on onTuchListener and Circular Cropping based on canvas class.
I have used below mentioned code for Pinch in-out and Circle Crop image:
#Override
protected void onDraw(Canvas canvas) {
onDrawReady = true;
imageRenderedAtLeastOnce = true;
if (delayedZoomVariables != null) {
setZoom(delayedZoomVariables.scale, delayedZoomVariables.focusX, delayedZoomVariables.focusY, delayedZoomVariables.scaleType);
delayedZoomVariables = null;
}
super.onDraw(canvas);
if (bitmap == null) {
circleWindowFrame(); //Creating circle view
}
canvas.drawBitmap(bitmap, 0, 0, null);
}
protected void circleWindowFrame() {
bitmap = Bitmap.createBitmap(getWidth(), getHeight(), Bitmap.Config.ARGB_8888);
Canvas osCanvas = new Canvas(bitmap);
RectF outerRectangle = new RectF(0, 0, bitmap.getWidth(), bitmap.getHeight());
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setColor(getResources().getColor(R.color.overlay));
paint.setAlpha(99);
osCanvas.drawRect(outerRectangle, paint);
paint.setColor(Color.TRANSPARENT);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_OUT));
float centerX = getWidth() / 2;
float centerY = getHeight() / 2;
DisplayMetrics metrics = context.getResources().getDisplayMetrics();
int width = metrics.widthPixels;
float radius = width / 2;
osCanvas.drawCircle(centerX, centerY, radius, paint);
}
This code for Cropping:
public static Bitmap getCrop() {
Bitmap circleBitmap;
circleBitmap = Bitmap.createBitmap(bitmap.getWidth(), bitmap.getHeight(), Bitmap.Config.ARGB_8888);
BitmapShader shader = new BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
Paint paint = new Paint();
paint.setShader(shader);
paint.setAntiAlias(true);
Canvas c = new Canvas(circleBitmap);
c.drawCircle(bitmap.getWidth() / 2, bitmap.getHeight() / 2, bitmap.getWidth() / 2, paint);
return bitmap;
}
Thanks for Advance...
try this
public static Bitmap toOvalBitmap(#NonNull Bitmap bitmap) {
int width = bitmap.getWidth();
int height = bitmap.getHeight();
Bitmap output = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(output);
int color = 0xff424242;
Paint paint = new Paint();
paint.setAntiAlias(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
RectF rect = new RectF(0, 0, width, height);
canvas.drawOval(rect, paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.drawBitmap(bitmap, 0, 0, paint);
bitmap.recycle();
return output;
}
how to use Canvas to draw an image inside another image;
like this, look at the picture :
to put it in a map app v2 like this
marker = gmap.addMarker(new MarkerOptions().title("test")
.position(new LatLng(0, 0))
.snippet("snipet test")
.icon(BitmapDescriptorFactory.fromBitmap(bitmap))
I already draw a picture in a rectangle like this
InputStream inputStream = connection.getInputStream();
Bitmap bitmap = BitmapFactory.decodeStream(inputStream);//Convert to bitmap
Bitmap output = Bitmap.createBitmap(bitmap.getWidth(),
bitmap.getHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(output);
final int color = 0xff424242;
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);
how to do this
please help me
Set a clipping path for your canvas with the shape of the frame you want:
Path frame = new Path();
frame.addCircle(centerX, centerY, radius, Direction.CW);
canvas.getClipBounds(oldClipBounds); //see below
canvas.clipPath(frame);
Everything you draw into the canvas afterwards will not be visible if it's outside of the circle.
If you need additional drawing, which should take place only outside of this frame, you can protect it later on by:
canvas.clipRect(oldClipBounds, Region.Op.REVERSE_DIFFERENCE);
I found a solution for this problem:
you put the image in a circle with canvas after that you resize the result with the exact size, and put it inside the marker image.
public class IconMarker {
public IconMarker(){}
public Bitmap DrawMarker(String userid,int typeid,Resources rcs){
// image from database: ...InputStream inputStream = connection.getInputStream();
//Bitmap bitmap = BitmapFactory.decodeStream(inputStream);
Bitmap img1=new UserInfoBd().getPhotoProfil(userid);
if(img1==null) img1=BitmapFactory.decodeResource(rcs,R.drawable.espace_photo);
Bitmap.Config conf = Bitmap.Config.ARGB_8888;
Bitmap bmp = BitmapFactory.decodeResource(rcs,
typeid);
Bitmap output = Bitmap.createBitmap(bmp.getWidth(),
bmp.getHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas1 = new Canvas(output);
canvas1.drawBitmap(bmp, 0,0, null);
Bitmap output1 = Bitmap.createBitmap(img1.getWidth(),
img1.getHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(output1);
final int color = 0xff424242;
final Paint paint = new Paint();
final Rect rect = new Rect(0, 0, img1.getWidth(), img1.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(img1, rect, rect, paint);
Bitmap img=getResizedBitmap(output1,bmp.getHeight()*3/4-4,bmp.getWidth()*3/4);
canvas1.drawBitmap(img,(float)4.7,(float)3.5,null);
return output;
}
public Bitmap getResizedBitmap(Bitmap bm, int newHeight, int newWidth) {
int width = bm.getWidth();
int height = bm.getHeight();
float scaleWidth = ((float) newWidth) / width;
float scaleHeight = ((float) newHeight) / height;
// CREATE A MATRIX FOR THE MANIPULATION
Matrix matrix = new Matrix();
// RESIZE THE BIT MAP
matrix.postScale(scaleWidth, scaleHeight);
// RECREATE THE NEW BITMAP
Bitmap resizedBitmap = Bitmap.createBitmap(bm, 0, 0, width, height, matrix, false);
return resizedBitmap;
}
}
I want to implement mutipoint cropping in android ,How to crop the image inside the path lines (white lines as shown in figure) ?
The code is I used is :
private Bitmap image;
#SuppressLint("NewApi")
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ImageView iv = (ImageView) findViewById(R.id.imageView1);
image = BitmapFactory.decodeResource(getResources(), R.drawable.splash);
Bitmap resultingImage = Bitmap.createBitmap(image.getWidth(),
image.getHeight(), image.getConfig());
Canvas canvas = new Canvas(resultingImage);
Paint paint = new Paint();
paint.setAntiAlias(true);
paint.setColor(Color.WHITE);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeJoin(Paint.Join.ROUND);
paint.setStrokeCap(Paint.Cap.ROUND);
paint.setStrokeWidth(3);
Path path = new Path();
path.lineTo(150, 0);
path.lineTo(210, 120);
path.lineTo(150, 240);
path.lineTo(70, 120);
path.lineTo(150, 0);
canvas.drawPath(path, paint);
canvas.drawBitmap(resultingImage, 0, 0, paint);
iv.setImageBitmap(resultingImage);
}
}
The idea is to render a Path and filling it with a bitmap.
See this link for more details : http://www.41post.com/4794/programming/android-rendering-a-path-with-a-bitmap-fill