How to center image inside a circular imageview? - android

I have an ImageView. I have done some manipulation to make it circular. All is good. But, I realize that the image is not centered. Apparently, the image is positioned from the top left of the ImageView. How can I make this image centered to the circular ImageView?
Here is my code:
// Decode the Byte[] into bitmap
Bitmap bmp = BitmapFactory.decodeByteArray(data, 0, data.length);
// Set the Bitmap into the imageView
mImage.setImageBitmap(bmp);
//circle img
int wbmp = bmp.getWidth();
int hbmp = bmp.getHeight();
int diameter;
if (wbmp > hbmp) {
diameter = hbmp;
} else {
diameter = wbmp;
}
Bitmap resized = Bitmap.createScaledBitmap(bmp, wbmp, hbmp, true);
Bitmap conv_bm = ImageHelper.getRoundedRectBitmap(resized, diameter);
mImage.setImageBitmap(conv_bm);
// TODO Auto-generated method stub
//circle img ends
and this is the ImageHelper:
public class ImageHelper {
//circle image
public static Bitmap getRoundedRectBitmap(Bitmap bitmap, int radius) {
Bitmap result = null;
try {
Bitmap sbitmap;
if(bitmap.getWidth() != radius || bitmap.getHeight() != radius) sbitmap = Bitmap.createScaledBitmap(bitmap, radius, radius,false);
else sbitmap = bitmap;
result = Bitmap.createBitmap(sbitmap.getWidth(), sbitmap.getHeight(), Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(result);
int color = 0xff424242;
Paint paint = new Paint();
Rect rect = new Rect(0, 0, sbitmap.getWidth(), sbitmap.getHeight());
paint.setAntiAlias(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
canvas.drawCircle(sbitmap.getWidth() / 2, sbitmap.getHeight() / 2,
sbitmap.getWidth() / 2, paint);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
canvas.drawBitmap(bitmap, rect, rect, paint);
} catch (NullPointerException e) {
} catch (OutOfMemoryError o) {
}
return result;
}
//circle image ends
}

Related

Issues in put Multiple Texts with Image using canvas and paint

here is my code :
ImageView mImageView = (ImageView)findViewById(R.id.imageView1);
// Bitmap bmp =drawTextToBitmap(this,R.drawable.man,"Hello Android");
Bitmap bmp =drawTextArrayToBitmap(this,R.drawable.man,"Smile");
mImageView.setImageBitmap(bmp);
now here is my method :
public Bitmap drawTextArrayToBitmap(Context mContext, int resourceId,String mText) {
try {
Resources resources = mContext.getResources();
float scale = resources.getDisplayMetrics().density;
Bitmap bitmap = BitmapFactory.decodeResource(resources, resourceId);
android.graphics.Bitmap.Config bitmapConfig = bitmap.getConfig();
if(bitmapConfig == null) {
bitmapConfig = android.graphics.Bitmap.Config.ARGB_8888;
}
bitmap = bitmap.copy(bitmapConfig, true);
Canvas canvas = new Canvas(bitmap);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setColor(Color.rgb(110,110, 110));
paint.setTextSize((int) (12 * scale));
paint.setShadowLayer(1f, 0f, 1f, Color.DKGRAY);
Rect bounds = new Rect();
paint.getTextBounds(mText, 0, mText.length(), bounds);
/* int x = (bitmap.getWidth() - bounds.width())/6;
int y = (bitmap.getHeight() + bounds.height())/5;*/
int x = 100, y = 100;
for(int i=0;i<20;i++)
{
canvas.drawText(mText, x * scale, y * scale, paint);
}
return bitmap;
} catch (Exception e) {
// TODO: handle exception
return null;
}
}
}
I am working on an android application like image filter I want to make an image like this after using a filter over an image
After searching on StackOverflow I got this solution only and this is not like as I want to implement: I got like this
canvas.drawText("This is", 100, 100, mTextPaint);
canvas.drawText("multi-line", 100, 150, mTextPaint);
canvas.drawText("text", 100, 200, mTextPaint);
I do not want to do like this : please help me I would approciate your answers and suggestion

How to add String on Bitmap Image in Android?

I want to add a string on bitmap image.I have a metod drawTextToBitmap,this method working success place string on bitmap image.But my bitmap image is very small like pinmark image.This function set the string based on the bitmap height and width.I want to place the string exceed than the bitmap image.So Please help me to solve the problem.
Following method i am using to get bitmap :
public Bitmap drawTextToBitmap(Context gContext, int gResId, String gText) {
Resources resources = gContext.getResources();
float scale = resources.getDisplayMetrics().density;
Bitmap bitmap = BitmapFactory.decodeResource(resources, gResId);
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.BLACK);
// text size in pixels
paint.setTextSize((int) (70 * scale));
// text shadow
paint.setShadowLayer(1f, 0f, 1f, Color.BLACK);
// draw text to the Canvas center
Rect bounds = new Rect();
paint.getTextBounds(gText, 0, gText.length(), bounds);
int m = (bitmap.getWidth() - bounds.width()) / 2;
int l = (bitmap.getHeight() + bounds.height()) / 2;
canvas.drawText(gText, 1000, l, paint);
return bitmap;
}
Try this:
public static Bitmap drawStringonBitmap(Bitmap src, String string, Point location, int color, int alpha, int size, boolean underline,int width ,int height) {
Bitmap result = Bitmap.createBitmap(width, height, src.getConfig());
Canvas canvas = new Canvas(result);
canvas.drawBitmap(src, 0, 0, null);
Paint paint = new Paint();
paint.setColor(color);
paint.setAlpha(alpha);
paint.setTextSize(size);
paint.setAntiAlias(true);
paint.setUnderlineText(underline);
canvas.drawText(string, location.x, location.y, paint);
return result;
}

How can i add Round Corner method for bitmap in my imageview android? [duplicate]

This question already has answers here:
Set image with rounded corners into ImageView
(3 answers)
Closed 8 years ago.
Gud Morning friends. I have create Imageview in row of listview. i also set my bitmap in my Imageview like,
public View getView(final int position, View convertView, ViewGroup parent) {
View row = convertView;
UserHolder holder = null;
Log.d("main", "pos:" + "" + position);
if (row == null) {
LayoutInflater inflater = ((Activity) context).getLayoutInflater();
row = inflater.inflate(layoutResourceId, parent, false);
holder = new UserHolder();
holder.Name = (TextView) row.findViewById(R.id.name);
holder.Number = (TextView) row.findViewById(R.id.number);
holder.img=(ImageView) row.findViewById(R.id.image);
Typeface face=Typeface.createFromAsset(context.getAssets(),"helve.ttf");
holder.Name.setTypeface(face);
//holder.Number.setTypeface(face);
//bit = BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher);
//
//holder.img.setImageBitmap(getRoundedCornerBitmap(bit, 40));
row.setTag(holder);
} else {
holder = (UserHolder) row.getTag();
}
User user = data.get(position);
holder.Name.setText(user.getName());
//holder.img.setImageBitmap(user.getbi());
holder.img.setImageBitmap(roundCornerImage(user.getbi(),50));
//holder.img.setImageBitmap(roundCornerImage(BitmapFactory.decodeResource(user.getbi(), R.drawable.ic_launcher),60));
holder.Number.setText(user.getNumber());
// Give Different Back Ground To List View---------------------------------------------
if ((position % 2) == 0) {
row.setBackgroundResource(R.drawable.list_dark);
} else {
row.setBackgroundResource(R.drawable.list_light);
}
Log.d("main", "pos:" + "" + position);
return row;
Now I want to set Bitmap Method in My This imageview. with my code. The methos which i want to add is bellow.
public Bitmap roundCornerImage(Bitmap src, float round) {
// Source image size
int width = src.getWidth();
int height = src.getHeight();
// create result bitmap output
Bitmap result = Bitmap.createBitmap(width, height, Config.ARGB_8888);
// set canvas for painting
Canvas canvas = new Canvas(result);
canvas.drawARGB(0, 0, 0, 0);
// configure paint
final Paint paint = new Paint();
paint.setAntiAlias(true);
//paint.setColor);
// configure rectangle for embedding
final Rect rect = new Rect(0, 0, width, height);
final RectF rectF = new RectF(rect);
// draw Round rectangle to canvas
canvas.drawRoundRect(rectF, round, round, paint);
// create Xfer mode
paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
// draw source image to canvas
canvas.drawBitmap(src, rect, rect, paint);
// return final image
return result;
}
How can i add this method in my code. Thank you in Advance.
Try below code:
holder.img.setImageBitmap(roundCornerImage(user.getbi(),ANY CONSTANT VALUE TO MAKE YOUR IMAGEVIEW ROUND LIKE-1,2));
You can usse this method in adaptor--
public Bitmap getRoundedRectBitmap(Bitmap scalebitmap, int pixels) {
Bitmap targetBitmap = null;
try {
int targetWidth = 150;
int targetHeight = 150;
targetBitmap = Bitmap.createBitmap(targetWidth, targetHeight,
Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(targetBitmap);
Path path = new Path();
path.addCircle(
((float) targetWidth) / 2,
((float) targetHeight) / 2,
(Math.min(((float) targetWidth), ((float) targetHeight)) / 2),
Path.Direction.CW);
Paint paint = new Paint();
paint.setColor(Color.GRAY);
// paint.setStyle(Paint.Style.STROKE);
paint.setStyle(Paint.Style.FILL);
paint.setAntiAlias(true);
paint.setDither(true);
paint.setFilterBitmap(true);
canvas.drawOval(new RectF(0, 0, targetWidth, targetHeight), paint);
// paint.setColor(Color.TRANSPARENT);
canvas.clipPath(path);
Bitmap sourceBitmap = scalebitmap;
canvas.drawBitmap(
sourceBitmap,
new Rect(0, 0, sourceBitmap.getWidth(), sourceBitmap
.getHeight()), new RectF(0, 0, targetWidth,
targetHeight), paint);
} catch (NullPointerException e) {
e.printStackTrace();
} catch (OutOfMemoryError o) {
o.printStackTrace();
}
return targetBitmap;
}
And you can write method in some constant class and call this method in adaptor like
//photo is the Bitmap image which you want to convert in round
Bitmap bitmapImage = Bitmap.createScaledBitmap(photo, 200, 200,true);
bitmap = imageprocessing.getRoundedRectBitmap(bitmapImage, 100);

Trying to convert image from rectangle shape to circular [duplicate]

This question already has answers here:
How to Make an ImageView in Circular Shape? [duplicate]
(2 answers)
Closed 8 years ago.
i am trying to convert imageview into 60px circular image but its not happening ...
the way i am trying is...
File imgFile = new File(Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_PICTURES),
"MyCameraApp" + File.separator + "profile_" + userId + ".jpg");
if(imgFile.exists()){
Bitmap correctBmp=null;
ExifInterface exif;
try {
exif = new ExifInterface(imgFile.getPath());
int orientation = exif.getAttributeInt(ExifInterface.TAG_ORIENTATION, ExifInterface.ORIENTATION_NORMAL);
int angle = 0;
if (orientation == ExifInterface.ORIENTATION_ROTATE_90) {
angle = 90;
}
else if (orientation == ExifInterface.ORIENTATION_ROTATE_180) {
angle = 180;
}
else if (orientation == ExifInterface.ORIENTATION_ROTATE_270) {
angle = 270;
}
Matrix mat = new Matrix();
mat.postRotate(90);
Bitmap bmp1 = BitmapFactory.decodeStream(new FileInputStream(imgFile), null, null);
/* correctBmp = Bitmap.createBitmap(bmp1, 0, 0, bmp1.getWidth(), bmp1.getHeight(), mat, true);*/
correctBmp = Bitmap.createBitmap(bmp1.getWidth(), bmp1.getHeight(), bmp1.getConfig());
Canvas canvas = new Canvas(correctBmp);
Paint paint = new Paint();
paint.setAntiAlias(true);
paint.setShader(new BitmapShader(bmp1, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP));
canvas.drawRoundRect((new RectF(0.0f, 0.0f, bmp1.getWidth(), bmp1.getHeight())), 10, 10, paint);
profileImage.setImageBitmap(correctBmp);
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
it is loading rectangle shape image so what should i do ?
Please help...
here is my code and it works for me:
public class ImageHelper {
public Bitmap getCroppedBitmap(Bitmap bitmap) {
Bitmap output = Bitmap.createBitmap(bitmap.getWidth(),
bitmap.getHeight(), 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());
paint.setAntiAlias(true);
canvas.drawARGB(0, 0, 0, 0);
paint.setColor(color);
// canvas.drawRoundRect(rectF, roundPx, roundPx, paint);
canvas.drawCircle(bitmap.getWidth() / 2, bitmap.getHeight() / 2,
bitmap.getWidth() / 2, paint);
paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
canvas.drawBitmap(bitmap, rect, rect, paint);
//Bitmap _bmp = Bitmap.createScaledBitmap(output, 60, 60, false);
//return _bmp;
return output;
}
}
just create a class and put this code in it, and then you can use it like this:
// create round image
public void setCircularImage() {
ImageView imv = (ImageView) findViewById(R.id.imageView1);
Bitmap bitImg = BitmapFactory.decodeResource(getResources(), R.drawable.icon_person);
ImageHelper imgHlp = new ImageHelper();
imv.setImageBitmap(imgHlp.getCroppedBitmap(bitImg));
}
For that the better option you have universal image loader.
you can easily make image rounded with create an option of image loader
options = new DisplayImageOptions.Builder()
.displayer(new RoundedBitmapDisplayer(50))
.showStubImage(R.drawable.ic_app)
.showImageForEmptyUri(R.drawable.camera)
.showImageOnFail(R.drawable.ic_error)
.cacheOnDisc()
.build();
you can take more reference here
see below link :-
Add border to getRoundedCornerBitmap android
or use Universal Loader
DisplayImageOptions options = new DisplayImageOptions.Builder()
.cacheInMemory(true)
.cacheOnDisc(true)
.displayer(new RoundedBitmapDisplayer(60))
.build();//value which you want to round
ImageLoader.getInstance().displayImage(Uri.parse(imgByURL).toString(), imgThumb, options);

Android draw an image inside another image

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;
}
}

Categories

Resources