0

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. enter image description here

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 Answers1

0

You can do this easily by using ImageView two properties: background and src

  1. Get a square image with transparent circle
  2. Set step 1 image to the src property of an ImageView
  3. 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.

Community
  • 1
  • 1
codebased
  • 6,945
  • 9
  • 50
  • 84