explaingit

hdodenhof/circleimageview

14,515JavaAudience · developerComplexity · 2/5LicenseSetup · easy

TLDR

A lightweight Android library that displays images as perfect circles, ideal for profile pictures and avatars, using an efficient technique that avoids memory duplication and rendering artifacts.

Mindmap

mindmap
  root((repo))
    What it does
      Circular image crop
      Border support
      Center crop
    Tech stack
      Java
      Android
    Use cases
      Profile pictures
      Circular avatars
      Chat app UI
    Audience
      Android developers
      App builders
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Things people build with this

USE CASE 1

Show user profile pictures as circles in an Android app without writing custom drawing code.

USE CASE 2

Add a colored border ring around a circular avatar by setting width and color in layout XML.

USE CASE 3

Display center-cropped circular images loaded from the internet with Picasso or Glide.

Tech stack

JavaAndroid

Getting it running

Difficulty · easy Time to first run · 5min

Disable fade animations in Picasso or Glide, otherwise the circular crop appears garbled during the image loading transition.

Apache 2.0 license, use freely in personal and commercial Android apps with attribution.

In plain English

CircleImageView is a small Java library for Android developers who need to display images in a perfect circle. The most common use case is a profile picture, where a square photo needs to be clipped into a round shape before being shown on screen. The library is built around a technique that avoids the most common pitfalls of cropping images on Android. It does not make a duplicate copy of the photo in memory, does not use a clipping path (which tends to look jagged and is slow to render), and does not draw the canvas twice. Instead, it uses something called a BitmapShader, a built-in Android mechanism that paints an image through a shape mask efficiently. Adding it to an Android project is straightforward: you declare it as a dependency in your build file, then drop a custom view tag into your layout XML wherever you want a circular image. You can set a border around the circle by specifying a width in density-independent pixels and a color. The image is always cropped from the center and fills the circle, which works well for portraits and avatars. There are a few known constraints. The cropping mode is fixed to center-crop and cannot be changed. The adjustViewBounds option is not compatible. If you use a popular image-loading library such as Picasso or Glide to download photos from the internet, you need to turn off their built-in fade-in animation, otherwise the circular crop can appear garbled during the transition. Vector graphics are also a poor fit for this component and the README explicitly recommends against using them here. The project has been actively maintained across more than a dozen releases, adding things like padding support, elevation, a circle background color, and migration to AndroidX (the modern Android support library set). It is released under the Apache 2.0 license, which permits free use in both personal and commercial apps.

Copy-paste prompts

Prompt 1
Show me how to add CircleImageView as a Gradle dependency and display a circular profile picture in my Android layout XML.
Prompt 2
I'm using Glide to load images into a CircleImageView. Walk me through disabling the fade animation to avoid a glitchy circular crop during load.
Prompt 3
How do I set a border color and border width on a CircleImageView in my Android layout?
Prompt 4
Help me display circular avatars in a RecyclerView using CircleImageView with Picasso for image loading.
Open on GitHub → Explain another repo

← hdodenhof on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.