An Android percentage chart that displays the progress of any single given task or information.

Overview

Percentage Chart View

API Download Codacy Android Arsenal Twitter


A Java-based easy to use and highly adjustable custom view that displays the progress of a single given task.
Please feel free to see the library in action in a showcase app available on Google play. This will help you check if a certain design can be achieved.

RING MODE



PIE MODE



FILL MODE



SETUP

Dependency should be declared in your app module level build.gradle file:

dependencies {    

    implementation 'com.ramijemli.percentagechartview:percentagechartview:0.3.1' 
    
}  

HOW TO USE

    <com.ramijemli.percentagechartview.PercentageChartView
        android:id="@+id/view_id"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:pcv_mode="pie"
        app:pcv_orientation="counter_clockwise"
        app:pcv_animDuration="800"
        app:pcv_animInterpolator="anticipate_overshoot"
        app:pcv_progress="10"
        app:pcv_startAngle="90"/>

Attributes

Name Format Default Supported modes Description
pcv_mode enum pie - Sets percentage chart appearance to "ring", "pie", or "fill".
pcv_orientation enum clockwise Pie, Ring Sets progress's drawing direction to "clockwise" or "counter_clockwise".
pcv_startAngle integer 0 All Sets progress's drawing start angle to [0..360].
pcv_animDuration integer 400 All Sets progress update's animation duration.
pcv_animInterpolator enum linear All Sets progress update's animation interpolator to "linear", "accelerate", "decelerate", "accelerate_decelerate", "anticipate", "overshoot", "anticipate_overshoot", "bounce", "fast_out_linear_in", "fast_out_slow_in", "linear_out_slow_in".
pcv_drawBackground boolean true for pie mode
false for ring mode
All Sets whether to draw background or not.
pcv_backgroundColor color #000000 All Sets background color.
pcv_progress integer 0 All Sets current progress.
pcv_progressColor color Accent color All Sets progress color.
pcv_textColor color #ffffff All Sets text color.
pcv_textSize dimension #12sp All Sets text size in SP.
pcv_typeface string System font All Sets progress text's typeface file path in assets folder.
pcv_textStyle flag normal All Sets progress text's style to "normal", "bold", "italic", "bold|italic".
pcv_textShadowColor color #00ffffff All Sets text shadow/glow color.
pcv_textShadowRadius string 0 All Sets text shadow/glow radius.
pcv_textShadowDistX float 0 All Sets text shadow/glow's x-axis distance.
pcv_textShadowDistY float 0 All Sets text shadow/glow's y-axis distance.
pcv_backgroundOffset dimension 0dp Pie, Fill Sets a margin only for background.
pcv_drawBackgroundBar boolean true Ring Sets whether to draw background bar or not.
pcv_backgroundBarThickness dimension 16dp Ring Sets background bar's thickness in DP.
pcv_backgroundBarColor color #000000 Ring Sets background color.
pcv_progressBarThickness dimension 16dp Ring Sets progress bar's thickness in DP.
pcv_progressBarStyle enum round Ring Sets progress bar's style to "round" or "square".
pcv_gradientType enum - All Sets the gradient colors' type for progress to "linear", "radial", or "sweep". (sweep is not supported for fill mode)
pcv_gradientColors string - All Sets the gradient colors for progress in a comma separated hex color values format; "#F44336 , #2196F3 , #00BCD4".
pcv_gradientDistributions string - All Sets the gradient colors' distribution in a comma separated float values format; "0.2 , 0.5 , 0.8".
Values must be monotonic and belong to [0..1]. If ignored colors will be distributed evenly.
pcv_gradientAngle integer pcv_startAngle All Sets linear gradient colors' drawing angle to [0..360].

Start angle

pcv_startAngle and pcv_gradientAngle attributes accept values following the next illustration.

Fluent API

All XML attributes have their Java counterparts except the pcv_mode attribute (for now).

Updates can be set by making the changes and calling apply(). This will make sure to redraw the view only once at the end.

mChart.textColor(Color.BLACK)  
      .textSize(sizeSp)  
      .typeface(typeface)  
      .textShadow(Color.WHITE, 2f, 2f, 2f)  
      .progressColor(Color.RED)  
      .backgroundColor(Color.BLACK)  
      .apply();

For a single update, you can call the needed setter method. e.g. setTextSize(sizeSp).

Progress-based adaptive colors

To use the color per progress feature, you have to pass an AdaptiveColorProvider class using the setAdaptiveColorProvider() method.
Adaptive colors can be applied to progress, background, text, and background bar.
It's worth mentioning that gradient colors have a higher priority than the provided colors, and that you can ignore redefining the methods you don't need as they have an implementation by default.

AdaptiveColorProvider colorProvider = new AdaptiveColorProvider() {  
    @Override  
    public int provideProgressColor(float progress) {  
        if (progress <= 25)  
            return colorOne;  
        else if (progress <= 50)  
            return colorTwo;  
        else if (progress <= 75)  
            return colorThree;  
        else return colorFour;  
    }
  
    @Override  
    public int provideBackgroundColor(float progress) {  
		//This will provide a bg color that is 80% darker than progress color.
        return ColorUtils.blendARGB(provideProgressColor(progress), Color.BLACK, .8f);  
    }  
  
    @Override  
    public int provideTextColor(float progress) {  
        return provideProgressColor(progress);  
    }
  
    @Override  
    public int provideBackgroundBarColor(float progress) {  
        return ColorUtils.blendARGB(provideProgressColor(progress), Color.BLACK, .5f);  
    }  
};

mPieChart.setAdaptiveColorProvider(colorProvider);

Progress changed listener

It's possible to get progress updates by setting an OnProgressChangeListener.

chart.setOnProgressChangeListener(new PercentageChartView.OnProgressChangeListener() {
    @Override
    public void onProgressChanged(float progress) {
        Log.d(TAG, String.valueOf(progress));
    }
});

Text formatter

For text, you can use another unit instead of percentage. You have to pass a ProgressTextFormatter class using the setTextFormatter() method.

mRingChart.setTextFormatter(new ProgressTextFormatter() {  
    @Override  
    public String provideFormattedText(float progress) {  
        int days = (int) (progress * maxDays / 100);  
        return days + " days";  
    }  
});

TO DO

  • Initial release
  • Progress based adaptive color support
  • Text style support
  • Filled background support for ring mode
  • Text typeface support
  • Progress change listener
  • Progress based adaptive color support for text, background and background bar
  • Draw orientation support
  • Text shadow/glow support
  • Background bar and progress bar offset support
  • Text formatter support
  • Gradient colors support
  • Builder pattern based update pipeline
  • New mode/appearance
  • Segmented style support for ring mode
  • SpannableString support

CONTRIBUTION

All bugs, feature requests, feedback, etc. are welcome. Please, feel free to create an issue.

You can contribute by opening pull requests on dev branch. Please try to push commits per feature for a clean commit history.

APPS USING IT

Are you using this library in your app? Let us know and we'll show it here.

CONTRIBUTORS


Rami Jemli

LICENSE

Copyright 2019 Rami Jemli

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.
Comments
  • Percentage is Zero if 100 is passed.

    Percentage is Zero if 100 is passed.

    Hi. When calling chart.setPercentage(100, true) the final percentage displayed is 0%. This is not the case when a number <= 99 is used

    Is this a known issue, and how do I resolve it?

    Best regards

    bug 
    opened by JudeOchalifu 2
  • crashing app

    crashing app

    java.lang.NullPointerException: Attempt to invoke virtual method 'void com.ramijemli.percentagechartview.renderer.BaseModeRenderer.measure(int, int, int, int, int, int)' on a null object reference
    

    crashing app while hiding the keyboard and giving this error in fragment

    bug 
    opened by Pinjari 1
  • compilation failed

    compilation failed

    got the following errors when trying to run app

    com.android.builder.dexing.DexArchiveBuilderException: Failed to process C:\Users\User.User-PC.gradle\caches\transforms-1\files-1.1\percentagechartview-0.3.0.aar\ae6eea35bd6346114908fe1dffe621e2\jars\classes.jar |   -- | -- com.android.builder.dexing.DexArchiveBuilderException: Error while dexing. |   com.android.tools.r8.CompilationFailedException: Compilation failed to complete |   com.android.tools.r8.utils.AbortException: Error: Invoke-customs are only supported starting with Android O (--min-api 26) |  

    opened by Binary-Finery 1
  • 0.3.0 release

    0.3.0 release

    • Fluent API update pipeline.
    • Progress text formatter support.
    • New fill mode support.
    • Adaptive colors related attributes removed.
    • Direct AdaptiveColorProvider support for progress, text, background and background bar.
    • Updated sample app.
    opened by RamiJ3mli 0
  • 0.2.0 release

    0.2.0 release

    • Make Overall code structure change.
    • Rename custom attributes for better self explanatory meanings.
    • Add adaptive color support for text, background, and background bar.
    • Add background offset support for pie mode.
    • Add text shadow support.
    • Optimize onDraw().
    • Add sample app for Google play.
    • Add entry points value and null checks.
    opened by RamiJ3mli 0
  • Add text vertical bias support

    Add text vertical bias support

    Add the ability to shift the text (percentage) which is currently in the center of the progress.

    Now user can set pcv_textVerticalBias between 0 and 1 (0.5 is the default) to shift the text. Also user can do that programmatically from code using setTextVerticalBias(...) method.

    opened by Mahmoood 0
  • ava.lang.NullPointerException: Attempt to invoke virtual method 'void com.ramijemli.percentagechartview.renderer.BaseModeRenderer.setProgress(float, boolean)' on a null object reference

    ava.lang.NullPointerException: Attempt to invoke virtual method 'void com.ramijemli.percentagechartview.renderer.BaseModeRenderer.setProgress(float, boolean)' on a null object reference

    Using a progressbar if I rotate the screen a few times or try to reload a few times eventually the library crashes with Process: com.phpni.member_android, PID: 6451 java.lang.NullPointerException: Attempt to invoke virtual method 'void com.ramijemli.percentagechartview.renderer.BaseModeRenderer.setProgress(float, boolean)' on a null object reference at com.ramijemli.percentagechartview.PercentageChartView.setProgress(PercentageChartView.java:421)

    opened by yams585 10
  • Black Background shown in release version while animating.

    Black Background shown in release version while animating.

    The background of the view changes to black while animating the progress bar. And then it changes to white. This problem only happens in the release version of the app (even without minify). Debug version works fine.

    opened by zubairzahoor 0
Releases(0.3.1)
  • 0.3.1(May 14, 2019)

  • 0.3.0(Apr 15, 2019)

    • Fluent API update pipeline.
    • Progress text formatter support.
    • New fill mode support.
    • Adaptive colors related attributes removed.
    • Direct AdaptiveColorProvider support for progress, text, background and background bar.
    Source code(tar.gz)
    Source code(zip)
  • 0.2.0(Apr 7, 2019)

    • Overall code structure change.
    • Custom attributes change for better self explanatory meanings.
    • Adaptive color support for text, background, and background bar.
    • Background offset support for pie mode.
    • Text shadow support.
    • Optimizations.
    • Sample app for Google play.
    Source code(tar.gz)
    Source code(zip)
  • 0.1.3(Apr 2, 2019)

  • 0.1.2(Apr 1, 2019)

  • 0.1.1(Mar 31, 2019)

  • 0.1.0(Mar 29, 2019)

Owner
Rami Jemli
Android software engineer
Rami Jemli
A lightweight task progress calendar view library for Android

A lightweight task progress calendar view library for Android

İbrahim Süren 128 Oct 21, 2022
Present your progress bars in arc mode with information and total control.

ArcProgressStackView Present your progress bars in arc mode with information and total control. You can check the sample app here. Warn This library i

Basil Miller 249 Sep 10, 2022
Present your progress bars in arc mode with information and total control.

ArcProgressStackView Present your progress bars in arc mode with information and total control. You can check the sample app here. Warn This library i

Devlight 1.3k Nov 29, 2022
Present your progress bars in arc mode with information and total control.

ArcProgressStackView Present your progress bars in arc mode with information and total control. You can check the sample app here. Warn This library i

Devlight 1.3k Nov 29, 2022
Some beautiful android loading drawable, can be combined with any view as the LoadingView or the ProgressBar. Besides, some Drawable can customize the loading progress too.

LoadingDrawable: Android cool animation collection 前言 CircleRotate源码解析 Fish源码解析 LoadingDrawable is some android animations implement of drawable: a li

dinus_developer 4.1k Dec 27, 2022
Material progress circle around any FloatingActionButton. 100% Guidelines.

FABProgressCircle Android library to provide a material progress circle around your FloatingActionButton. This component is compatible with any existe

Jorge Castillo 1.2k Nov 28, 2022
A progress wheel for android, intended for use instead of the standard progress bar.

Deprecation warning This project is no-longer maintained, and has not been maintained for a few years now. If you're looking for an alternative librar

Todd Davies 2.7k Dec 29, 2022
Android loading or progress dialog widget library, provide efficient way to implement iOS like loading dialog and progress wheel

ACProgressLite English Version / 中文版本 An Android loading widget library. Lite and easy to use, strong customizability. Can be used to implement 'iOS'

Cloudist Technology Co., Ltd. 234 Nov 24, 2022
:barber: [Android Library] Stacked dual progress indicator progress-bar

StackedHorizontalProgressBar Specs Featured in Show some ❤️ Android library with ability to show two progress indicators in one horizontal progress ba

Nishant Srivastava 98 Nov 11, 2022
IOSProgressBar is a progress-bar lib for android. And the progress-bar looks like iOS system style

IOSProgressBar is a progress-bar lib for android. And the progress-bar looks like iOS system style

heyangyang 6 Aug 25, 2022
Loading layout is a container view that manages easy switching between loading, completed and other states of your screen with a single line.

Loading layout is a container view that manages easy switching between loading, completed and other states of your screen with a single line.

ValarTech 16 Jul 5, 2022
[Android] Round Corner Progress Bar Library for Android

RoundCornerProgressBar Round corner is cool. Let's make your progress bar to round corner Colorful progress bar with round corner on progress which yo

Akexorcist 2.3k Dec 31, 2022
[Android] Round Corner Progress Bar Library for Android

RoundCornerProgressBar Round corner is cool. Let's make your progress bar to round corner Colorful progress bar with round corner on progress which yo

Akexorcist 2.3k Jan 7, 2023
Android library to display progress like google does in some of his services.

GoogleProgressBar This library is not maintained anymore and there will be no further releases Android library to display different kind of google rel

JPARDOGO 1.3k Dec 27, 2022
Android fillable progress view working with SVG paths. This is a nice option too if you want to create an interesting branding logo for your app. Based on the iOS project: https://github.com/poolqf/FillableLoaders

Android FillableLoaders Android Open Source library providing an interesting fillable progress view working with SVG paths. This is a nice option too

Jorge Castillo 2k Jan 1, 2023
Android AlertDialog with moving dots progress indicator

Spots progress dialog Android AlertDialog with moving spots progress indicator packed as android library. =========== Usage The library available in m

Maksym Dybarskyi 1.1k Dec 26, 2022
A customizable, animated progress bar that features rounded corners. This Android library is designed to look great and be simple to use 🎉

RoundedProgressBar Easy, Beautiful, Customizeable The RoundedProgressBar library gives you a wide range of customizable options for making progress ba

null 541 Jan 1, 2023
A wave view of android,can be used as progress bar.

WaveView ![Gitter](https://badges.gitter.im/Join Chat.svg) A wave view of android,can be used as progress bar. Screenshot APK demo.apk What can be use

Kai Wang 1.3k Dec 28, 2022
A circular android ProgressBar library which extends View, and the usage same as ProgressBar, It has solid,line and solid_line three styles. Besides, progress value can be freely customized.

CircleProgressBar 中文版文档 The CircleProgressBar extends View, It has both solid and line two styles. Besides, progress value can be freely customized. I

dinus_developer 1.2k Jan 3, 2023