CircularImageView
lopspower
1429
Visit GitHub RepoImage Views

CircularImageView

sample

License Platform API
Android Arsenal Twitter

This is an Android project allowing to realize a circular ImageView in the simplest way possible.

Android app on Google Play

USAGE

To make a circular ImageView add CircularImageView in your layout XML and add CircularImageView library in your project or you can also grab it via Gradle:

implementation 'com.mikhaellopez:circularimageview:4.0.1'

XML

<com.mikhaellopez.circularimageview.CircularImageView
        android:layout_width="250dp"
        android:layout_height="250dp"
        android:src="@drawable/image"
        app:civ_border_color="#3f51b5"
        app:civ_border_width="4dp"
        app:civ_shadow="true"
        app:civ_shadow_radius="10"
        app:civ_shadow_color="#3f51b5"/>

You must use the following properties in your XML to change your CircularImageView.

Properties:
  • app:civ_circle_color (color) -> default WHITE
  • app:civ_border (boolean) -> default true
  • app:civ_border_color (color) -> default WHITE
  • app:civ_border_width (dimension) -> default 4dp
  • app:civ_shadow (boolean) -> default false
  • app:civ_shadow_color (color) -> default BLACK
  • app:civ_shadow_radius (float) -> default 8.0f
  • app:civ_shadow_gravity (center, top, bottom, start or end) -> default bottom

ℹ️ You can also use android:elevation instead of app:civ_shadow to have default Material Design elevation.

KOTLIN

val circularImageView = findViewById<CircularImageView>(R.id.circularImageView)
// Set Circle color for transparent image
circularImageView.circleColor = Color.WHITE
// Set Border
circularImageView.borderColor = Color.RED
circularImageView.borderWidth = 10f
// Add Shadow with default param
circularImageView.shadowEnable = true
// or with custom param
circularImageView.shadowRadius = 15f
circularImageView.shadowColor = Color.RED
circularImageView.shadowGravity = CircularImageView.ShadowGravity.CENTER

JAVA

CircularImageView circularImageView = findViewById(R.id.circularImageView);
// Set Circle color for transparent image
circularImageView.setCircleColor(Color.WHITE);
// Set Border
circularImageView.setBorderColor(Color.RED);
circularImageView.setBorderWidth(10);
// Add Shadow with default param
circularImageView.setShadowEnable(true);
// or with custom param
circularImageView.setShadowRadius(15);
circularImageView.setShadowColor(Color.RED);
circularImageView.setBackgroundColor(Color.RED);
circularImageView.setShadowGravity(CircularImageView.ShadowGravity.CENTER);

LIMITATIONS

  • By default the ScaleType is CENTER_CROP. You can also used CENTER_INSIDE but the others one are not supported.
  • Enabling adjustViewBounds is not supported as this requires an unsupported ScaleType.

LINK

Stack OverFlow:

I realized this project using this post:

LICENCE

CircularImageView by Lopez Mikhael is licensed under a Apache License 2.0.

Become a better Android Developer
Millions of developers are learning at MindOrks

Online Training Program

Featured Blogs

Our Team

MindOrks is Certainly one of the best online blog to stay on top of all the Android development news, coding and design patterns. Finally a blog I can count on to keep myself updated with latest and greatest things happening in Android world.

Vipul Shah
Android Developer
Microsoft

Become Pro in Android by watching videos

OUR LEARNERS WORK AT