Blog

Welcome back I am back with another blog posts in this post I will be talking about that how to include a circular progress for into your Android application so you want to include a circular progress animation in your Android application you can use library the whole source code of this application is given below and if you want extent your application then added the code and according to your needs

Demo

How To Install

To get a Git project into your build:

• Step 1. Add the JitPack repository to your build file

Add it in your root build.gradle at the end of repositories:

allprojects {
 repositories {
  ...
  maven { url 'https://jitpack.io' }
 }
}

• Step 2. Add the dependency

dependencies {
   implementation 'com.github.brkckr:CircularProgressBar:1.0.1'
}

How To Use

<com.brkckr.circularprogressbar.CircularProgressBar
        android:id="@+id/circularProgressBar"
        app:cpbBackgroundColor="#F1992D"
        app:cpbBackgroundWidth="@dimen/background_width"
        app:cpbProgressColor="#9F3238"
        app:cpbProgressValue="15"
        app:cpbProgressWidth="@dimen/progress_width"
        app:cpbState="clockwise"
        android:layout_width="128dp"
        android:layout_height="128dp"/>

Real World Example Code

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                xmlns:app="http://schemas.android.com/apk/res-auto"
                android:padding="10dp">

    <LinearLayout
        android:id="@+id/linearLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:orientation="horizontal"
        android:weightSum="3">

        <Button
            android:id="@+id/btnIncrease"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/increase"/>

        <Button
            android:id="@+id/btnDecrease"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/decrease"/>

        <Button
            android:id="@+id/btnRandom"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/random"/>

    </LinearLayout>

    <SeekBar
        android:id="@+id/seekBarBackground"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/linearLayout"
        android:layout_margin="10dp"/>

    <SeekBar
        android:id="@+id/seekBarProgress"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/seekBarBackground"
        android:layout_margin="10dp"/>

    <RadioGroup
        android:id="@+id/radio"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/seekBarProgress"
        android:layout_margin="10dp">

        <RadioButton
            android:id="@+id/radioClockwise"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:checked="true"
            android:text="@string/clockwise"/>

        <RadioButton
            android:id="@+id/radioCounter"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/counter_clockwise"/>

    </RadioGroup>

    <com.brkckr.circularprogressbar.CircularProgressBar
        android:id="@+id/circularProgressBar"
        app:cpbBackgroundColor="#F1992D"
        app:cpbBackgroundWidth="@dimen/background_width"
        app:cpbProgressColor="#9F3238"
        app:cpbProgressValue="15"
        app:cpbProgressWidth="@dimen/progress_width"
        app:cpbState="clockwise"
        android:layout_width="128dp"
        android:layout_height="128dp"
        android:layout_below="@+id/radio"
        android:layout_centerHorizontal="true"/>

</RelativeLayout>

MainActivity.java

package com.brkckr.circularprogressbar.demo;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.CompoundButton;
import android.widget.RadioButton;
import android.widget.SeekBar;

import com.brkckr.circularprogressbar.CircularProgressBar;

import java.util.Random;

public class MainActivity extends AppCompatActivity
{
    CircularProgressBar circularProgressBar;

    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        circularProgressBar = findViewById(R.id.circularProgressBar);
        Button btnDecrease = findViewById(R.id.btnDecrease);
        Button btnIncrease = findViewById(R.id.btnIncrease);
        Button btnRandom = findViewById(R.id.btnRandom);

        ((SeekBar) findViewById(R.id.seekBarBackground)).setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener()
        {
            @Override
            public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser)
            {
                circularProgressBar.setBackgroundWidth(progress);
            }

            @Override
            public void onStartTrackingTouch(SeekBar seekBar)
            {

            }

            @Override
            public void onStopTrackingTouch(SeekBar seekBar)
            {

            }
        });

        ((SeekBar) findViewById(R.id.seekBarProgress)).setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener()
        {
            @Override
            public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser)
            {
                circularProgressBar.setProgressWidth(progress);
            }

            @Override
            public void onStartTrackingTouch(SeekBar seekBar)
            {

            }

            @Override
            public void onStopTrackingTouch(SeekBar seekBar)
            {

            }
        });

        ((RadioButton) findViewById(R.id.radioClockwise)).setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener()
        {
            @Override
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked)
            {
                if (isChecked)
                {
                    circularProgressBar.setState(CircularProgressBar.State.CLOCKWISE);
                }
            }
        });

        ((RadioButton) findViewById(R.id.radioCounter)).setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener()
        {
            @Override
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked)
            {
                if (isChecked)
                {
                    circularProgressBar.setState(CircularProgressBar.State.COUNTERCLOCKWISE);
                }
            }
        });

        btnDecrease.setOnClickListener(new View.OnClickListener()
        {
            @Override
            public void onClick(View v)
            {
                circularProgressBar.setProgressValueWithAnimation(circularProgressBar.getProgressValue()-5, 200);
            }
        });

        btnIncrease.setOnClickListener(new View.OnClickListener()
        {
            @Override
            public void onClick(View v)
            {
                circularProgressBar.setProgressValueWithAnimation(circularProgressBar.getProgressValue()+5, 300);
            }
        });

        btnRandom.setOnClickListener(new View.OnClickListener()
        {
            @Override
            public void onClick(View v)
            {
                int min = 0;
                int max = 100;

                Random random = new Random();
                int progressValue = random.nextInt(max - min + 1) + min;

                circularProgressBar.setProgressValueWithAnimation((float) progressValue);
            }
        });
    }
}