Make Circular ImageView with or without a library [2022]

 You might want to include a circular imageview in your app for a profile picture maybe. Normal imageviews don't have the utility with them, plus you may also not want to go through so much trouble with third party libraries to do such a simple itchy task. So how exactly do you get the job done?

Short answer, use a cardview with an imageview as a child in it and simply manipulate the dimensions to achieve the circular image appearance. Something to keep in mind here is that, the cardview should always be of equal width and length.

Alternatively, use Glide library to render a very cool circular imageview with less effort, simply by integrating the library into your app and use a CircleCrop attribute.  

 Make a Circular ImageView using CardView

This approach is one of the simplest there is (i hope). It involves using a cardview that obviously is available in android studio by default. Drag this widget into your XML layout if you happen to use the drag and drop functionality in android studio or simply type it in as the follows

  <androidx.cardview.widget.CardView
    android:layout_width="200dp"
    android:layout_height="200dp"
    app:cardElevation="10dp"
    app:cardCornerRadius="100dp"
    android:layout_gravity="center"
    android:layout_marginTop="32dp">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:contentDescription="@string/app_name"
        android:src="@drawable/ic_launcher_background"/>

</androidx.cardview.widget.CardView>

i just spilled all the beans right above. That's all you need to make a circular imageview in android studio. Simple right? Well, let's see whats happening in there.

You may notice that my cardview is some kind of a square figure, that's on purpose. The extents of my trick require it to be that way, because only if it's square we then can achieve a perfect circle. Any deviations from that rule, well you may have a very funny looking circle of an image. But if you stick to the rule, you should have something similar to this.

You notice some elevation with the image just above the surface, well that's because of the cardElevtion property i have just used on the card.

NOTE: 

The real magic in the procedure above is to always use half the value of length and width of the card as the cardCornerRadius. A good example from my illustration, i have used 200dp as the length and width of my cardview and so the value for cardCornerRadius had to be half of the values, which is 100dp 

The procedure works for both images from your drawables folder and for images you pick from device, though you will need permission to pick image files from device and so i have an article about requesting READ_EXTERNAL_STORAGE permission. Feel free to check it out, just in case. And that's it with our first approach, let's move to an alternative approach.

Make a Circular Image with Glide

 Glide is a fast and efficient open source media management and image loading framework for Android that wraps media decoding, memory and disk caching, and resource pooling into a simple and easy to use interface. It has very cool and powerful functionalities such as the one we are going to use to load a circular imageview on ur app in andrid studio