Android custom view to load an avatar or profile image with a progress indicator.

It also works on Marshmallow.

You can customize the Component as you wish.

You can also Preview the result on Android Studio!

ProgressProfileView extends ImageView, so you can set xml attributes as usual.
It will be square measured both on landscape and portrait.

You don't need to transform resources placeholders or loaded images from Picasso or Glide to rounded images!

ProgressProfileView will clip proportionally all images loaded.
Just remember to set android:scaleType="centerCrop" on the component.

If you are working with gradle, add the dependency to your build.gradle file:

dependencies{
    compile 'com.kuassivi.view:progressprofile:1.0.5'
}

If you are working with maven, do it into your pom.xml

<dependency>
    <groupId>com.kuassivi.view</groupId>
    <artifactId>progressprofile</artifactId>
    <version>1.0.5</version>
    <type>aar</type>
</dependency>

Add the ProgressProfileView component in some place on the layout.
Set your prefered ImageView attributes on it.

<com.kuassivi.view.ProgressProfileView
        android:id="@+id/profile"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:scaleType="centerCrop"
        android:adjustViewBounds="true"
        android:src="@drawable/my_avatar"
        app:progress="42"
        app:progressRingSize="10dp"
        app:progressRingCap="ROUND"
        app:progressRingOutline="true"/>

Get the object on your activity or fragment.

ProgressProfileView profile = (ProgressProfileView) findViewById(R.id.profile);

Set your desired progress.

profile.setProgress(59.5f);

To animate the ring, call #startAnimation()

profile.startAnimation();

If you need to handle the progress animation update or listen to the end of the animation, just get the ObjectAnimator calling the getAnimator() method from your ProgressProfileView object.

profile.getAnimator().addListener(new AnimatorListener());

profile.getAnimator().addUpdateListener(new AnimatorUpdateListener());

profile.getAnimator().setInterpolator(new AccelerateDecelerateInterpolator());

If you are loading images with Glide or Picasso, do it as usual

// Using Glide as usual
Glide.with(this)
    .load("http://your/server/path")
    .placeholder(R.drawable.ic_icon_user_default)
    .into(profile);

Be careful when using fitCenter() method of Glide, or any other similar kind of method, because it will scale the bitmap, and the Progress Profile component will loose its original bounds!

• `app:max="100"` - Max value for progress indicator
  

• `app:progress="50"` - Current progress value
  

• `app:backgroundRingSize="20dp"` - Set the size of the background ring (not set, means use the same as the <i>progressRingSize</i>)
  

• `app:progressRingSize="20dp"` - Set the size of the progress ring
  

• `app:backgroundRingColor="@color/my_color"` - Set the color of the background ring (it can be an hex color as well)
  

• `app:progressRingColor="@color/my_color"` - Set the color of the progress ring (it can be an hex color as well)
  

• `app:progressRingCap="BUTT"` - Set the cap style of the progress ring (Possible values: BUTT, ROUND, SQUARE)
  

• `app:progressRingOutline="true"` - Set the ring as an Outline based on the padding of the ImageView, by default is `false`.
  

Copyright 2015 Francisco Gonzalez-Armijo Riádigos

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.