Selectable circular imageview like Google+
Really simple solution, thanks to @CommonsWare for the tips.
Size of Bitmap
: imageSizePx - 3DP
Size of ImageView
: imageSizePx
mImageView.setBackground(createStateListDrawable(imageSizePx));
mImageView.setImageBitmap(loadedImage);
private StateListDrawable createStateListDrawable(int size) {
StateListDrawable stateListDrawable = new StateListDrawable();
OvalShape ovalShape = new OvalShape();
ovalShape.resize(size, size);
ShapeDrawable shapeDrawable = new ShapeDrawable(ovalShape);
shapeDrawable.getPaint().setColor(getResources().getColor(R.color.somecolor));
stateListDrawable.addState(new int[]{android.R.attr.state_pressed}, shapeDrawable);
stateListDrawable.addState(new int[]{android.R.attr.state_focused}, shapeDrawable);
stateListDrawable.addState(new int[]{}, null);
return stateListDrawable;
}
Assuming that by "selectable" you mean "checkable, like a CheckBox
", then that could be some CompoundButton
that is using a StateListDrawable
with regular and checked states for the background behind the "SkillOverflow" foreground image.
You can use uiautomatorviewer
to see what the actual widget is that Google+ uses.
You can make a custom View that extends ImageView. Override onDraw to clip the canvas with a circular region and draw the image on the canvas. Something like this as a starting point:
public class CircularImageView extends ImageView {
/* constructors omitted for brevity ... */
protected void onDraw(Canvas canvas) {
int saveCount = canvas.save();
// clip in a circle
// draw image
Drawable d = getDrawable();
if (d != null) {
d.draw(canvas);
}
// do extra drawing on canvas if pressed
canvas.restoreToCount(saveCount);
}
}
Take some time to get familiar with the Canvas and other 2D drawing APIs in Android.