hey guys so I'm trying to make this circle button. And in that circle I want to put an image, like a person's profile picture. So if someone uploads an image, I need to be able to adjust the size and crop it and put it into a circle. Below is an example of what I am trying to accomplish. And behind the circle is a red circle, just for aesthetics. Hope you guys can give me some insight or direction.
Asked
Active
Viewed 3,074 times
0

TheQ
- 1,949
- 10
- 38
- 63
-
There are tons of libraries and solutions online, but I ended up making a circle mask image in photoshop or something and place it on top of my picture, with an alpha of a circle of course – Hassan Khallouf Jan 24 '16 at 22:33
-
But if your app has a lot of users you can't do that. There needs to be a way where if someone uses your app and selects and image, the program should automatically do the cropping and profile picture setting. – TheQ Jan 24 '16 at 22:35
-
Do yourself a favor and just use Picasso or Glide, it's what everybody does for this type of thing.... See here for adding a border using Picasso: http://stackoverflow.com/questions/27236158/adding-borders-for-image-rounded-image-android – Daniel Nugent Jan 25 '16 at 00:00
1 Answers
0
You can do this easily by using ImageView two properties: background and src
- Get a square image with transparent circle
- Set step 1 image to the src property of an ImageView
- Set the background of your ImageView with your avatar photo (square).
Please see here for the static avatar image solution: ImageView in circular through xml
If your avatar is dynamic, then you need to set the background image dynamically and this post will help:
Changing image view background dynamically
If you are using Picaso then use this: android: create circular image with picasso
However it has great performance concerns.
-
-
@TheQ it means this : https://upload.wikimedia.org/wikipedia/commons/1/18/Circle_frame.svg – codebased Jan 25 '16 at 00:06