Convert Figma logo to code with AI

Todd-Davies logoProgressWheel

A progress wheel for android, intended for use instead of the standard progress bar.

2,646
709
2,646
9

Top Related Projects

A beautiful, slim Android ProgressBar.

CircleProgress, DonutProgress, ArcProgress

Android loading animations

A small Android library allowing you to have a smooth and customizable horizontal or circular indeterminate ProgressBar

A material style progress wheel compatible with 2.3

Quick Overview

ProgressWheel is an Android library that provides a customizable, circular progress indicator. It offers a more visually appealing alternative to the standard Android ProgressBar, allowing developers to create smooth, animated progress wheels for their applications.

Pros

  • Highly customizable with various attributes for colors, sizes, and animations
  • Smooth animations for progress updates
  • Lightweight and easy to integrate into existing Android projects
  • Supports both determinate and indeterminate progress modes

Cons

  • Limited to circular progress indicators only
  • May require additional effort to match certain design requirements
  • Not actively maintained (last update was several years ago)
  • Lacks some advanced features found in newer progress indicator libraries

Code Examples

  1. Basic usage in XML layout:
<com.todddavies.components.progressbar.ProgressWheel
    android:id="@+id/progress_wheel"
    android:layout_width="80dp"
    android:layout_height="80dp"
    ProgressWheel:barColor="#5588FF"
    ProgressWheel:rimColor="#44000000"
    ProgressWheel:barWidth="4dp"
    ProgressWheel:rimWidth="4dp" />
  1. Setting progress programmatically:
ProgressWheel progressWheel = findViewById(R.id.progress_wheel);
progressWheel.setProgress(75); // Set progress to 75%
  1. Using indeterminate mode:
ProgressWheel progressWheel = findViewById(R.id.progress_wheel);
progressWheel.spin(); // Start spinning animation

Getting Started

  1. Add the dependency to your build.gradle file:
dependencies {
    implementation 'com.github.Todd-Davies:ProgressWheel:1.2'
}
  1. Add the ProgressWheel to your layout XML:
<com.todddavies.components.progressbar.ProgressWheel
    android:id="@+id/progress_wheel"
    android:layout_width="80dp"
    android:layout_height="80dp" />
  1. Use the ProgressWheel in your Activity or Fragment:
ProgressWheel progressWheel = findViewById(R.id.progress_wheel);
progressWheel.setProgress(0); // Set initial progress
// Update progress as needed
progressWheel.setProgress(50); // Set progress to 50%

Competitor Comparisons

A beautiful, slim Android ProgressBar.

Pros of NumberProgressBar

  • Offers a linear progress bar with numerical percentage display
  • Provides more customization options for colors and styles
  • Easier to integrate into existing layouts due to its linear design

Cons of NumberProgressBar

  • Limited to horizontal orientation only
  • Lacks the ability to display indeterminate progress
  • May not be as visually appealing for certain design aesthetics

Code Comparison

ProgressWheel:

ProgressWheel wheel = (ProgressWheel) findViewById(R.id.progress_wheel);
wheel.setProgress(50);
wheel.setText("50%");

NumberProgressBar:

NumberProgressBar bnp = (NumberProgressBar) findViewById(R.id.number_progress_bar);
bnp.setProgress(50);
bnp.setMax(100);

Both libraries offer simple ways to set progress, but NumberProgressBar provides a more traditional approach with separate methods for setting progress and maximum value. ProgressWheel combines text and progress in a single circular design, while NumberProgressBar separates these elements in a linear layout.

The choice between these libraries depends on the specific design requirements of your project. ProgressWheel offers a unique circular design, while NumberProgressBar provides a more conventional linear progress indicator with built-in numerical display.

CircleProgress, DonutProgress, ArcProgress

Pros of CircleProgress

  • More customization options for the progress circle appearance
  • Supports gradient colors for the progress arc
  • Includes animation features for smoother progress updates

Cons of CircleProgress

  • Less documentation and usage examples compared to ProgressWheel
  • Fewer stars and forks on GitHub, potentially indicating less community support
  • May have a steeper learning curve due to more complex customization options

Code Comparison

ProgressWheel:

ProgressWheel wheel = (ProgressWheel) findViewById(R.id.progress_wheel);
wheel.setProgress(50);

CircleProgress:

CircleProgress circleProgress = findViewById(R.id.circle_progress);
circleProgress.setProgress(50);
circleProgress.setGradientColors(new int[]{Color.BLUE, Color.GREEN});

Both libraries offer similar basic functionality for setting progress, but CircleProgress provides additional methods for customization, such as setting gradient colors for the progress arc.

Android loading animations

Pros of Android-SpinKit

  • Offers a wider variety of animation styles (8 different types)
  • Provides more customization options for each animation
  • Includes XML support for easy integration into layouts

Cons of Android-SpinKit

  • Larger library size due to multiple animation options
  • May have a slightly higher performance impact for complex animations
  • Requires more setup code for custom animations

Code Comparison

ProgressWheel:

ProgressWheel wheel = findViewById(R.id.progress_wheel);
wheel.setProgress(75);

Android-SpinKit:

SpinKitView spinKit = findViewById(R.id.spin_kit);
Sprite doubleBounce = new DoubleBounce();
spinKit.setIndeterminateDrawable(doubleBounce);

Both libraries offer simple implementation, but Android-SpinKit requires specifying the animation type. ProgressWheel focuses on a single, customizable wheel animation, while Android-SpinKit provides multiple pre-built animations. The choice between the two depends on the specific project requirements, such as the need for variety in loading animations or a preference for a simpler, more focused solution.

A small Android library allowing you to have a smooth and customizable horizontal or circular indeterminate ProgressBar

Pros of SmoothProgressBar

  • Offers a wider variety of animation styles and customization options
  • Provides smoother animations with interpolated progress updates
  • Supports both horizontal and circular progress indicators

Cons of SmoothProgressBar

  • Slightly more complex implementation due to additional features
  • May have a higher performance overhead for simple use cases
  • Less straightforward customization of individual progress segments

Code Comparison

ProgressWheel:

ProgressWheel wheel = (ProgressWheel) findViewById(R.id.progress_wheel);
wheel.setProgress(75);

SmoothProgressBar:

SmoothProgressBar progressBar = (SmoothProgressBar) findViewById(R.id.progress_bar);
progressBar.setProgress(75);
progressBar.setSmoothProgressDrawableBackgroundColor(Color.BLUE);
progressBar.setSmoothProgressDrawableColors(new int[]{Color.RED, Color.GREEN});

Both libraries provide easy-to-use progress indicators for Android applications. ProgressWheel focuses on a simple, circular progress wheel with basic customization options. SmoothProgressBar offers more advanced features and animation styles, including both horizontal and circular progress indicators. While SmoothProgressBar provides greater flexibility, it may be overkill for simpler use cases where ProgressWheel could suffice. The choice between the two depends on the specific requirements of your project and the desired level of customization.

A material style progress wheel compatible with 2.3

Pros of materialish-progress

  • More recent updates and active development
  • Supports Material Design aesthetics
  • Offers a wider variety of progress indicators (circular, linear, and determinate)

Cons of materialish-progress

  • Larger library size due to additional features
  • May have a steeper learning curve for beginners
  • Potentially higher resource consumption due to more complex animations

Code Comparison

ProgressWheel:

ProgressWheel wheel = (ProgressWheel) findViewById(R.id.progress_wheel);
wheel.setProgress(50);

materialish-progress:

CircularProgressDrawable progressDrawable = new CircularProgressDrawable(context);
progressDrawable.setStyle(CircularProgressDrawable.DEFAULT);
imageView.setImageDrawable(progressDrawable);
progressDrawable.start();

Summary

ProgressWheel is a simpler, lightweight option for basic circular progress indicators. materialish-progress offers more features and adheres to Material Design principles but may be more complex to implement. The choice between the two depends on project requirements, design preferences, and the need for additional progress indicator types.

Convert Figma logo designs to code with AI

Visual Copilot

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

README

Project frozen Project unmaintained

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 library, consider the below options:

If, on the other hand, you'd like to take over maintinance of the project or modernise it, feel free to do so; just send me pull requests or an email (at todd434@gmail.com).

Progress Wheel

This is a custom component for Android intended for use instead of a progress bar.

Sample Image Sample Image 3 Sample Image 4

Compare it side by side with the Android 2x progress wheel:

Sample Image 5

A complete walkthrough of how to use this component in your app

XML:
To implement the view in your xml layout do the following:

  1. Add the following to your attrs.xml file (in res/values):
<declare-styleable name="ProgressWheel">
        <attr name="pwText" format="string" />
        <attr name="pwTextColor" format="color" />
        <attr name="pwTextSize" format="dimension" />
        <attr name="pwBarColor" format="color" />
        <attr name="pwRimColor" format="color" />
        <attr name="pwRimWidth" format="dimension" />
        <attr name="pwSpinSpeed" format="dimension" />
        <attr name="pwDelayMillis" format="integer" />
        <attr name="pwCircleColor" format="color" />
        <attr name="pwRadius" format="dimension" />
        <attr name="pwBarWidth" format="dimension" />
        <attr name="pwBarLength" format="dimension" />
        <attr name="pwContourColor" format="color"/>
        <attr name="pwContourSize" format="dimension"/>
</declare-styleable>
  1. Add the following code to the root view of your layout: xmlns:ProgressWheel="http://schemas.android.com/apk/res/com.visualdenim.schooltraq"

  2. Add the widget code in the appropriate place in your xml file. Here's a sample implementation:

<com.todddavies.components.progressbar.ProgressWheel   
    android:id="@+id/pw_spinner"     
    android:layout_width="200dp"    
    android:layout_height="200dp"   
    android:layout_centerInParent="true"   
    ProgressWheel:pwText="Authenticating..."    
    ProgressWheel:pwTextColor="#222"   
    ProgressWheel:pwTextSize="14sp"   
    ProgressWheel:pwRimColor="#330097D6"   
    ProgressWheel:pwBarLength="60dp"    
    ProgressWheel:pwBarColor="#0097D6"   
    ProgressWheel:pwBarWidth="5dp"   
    ProgressWheel:pwRimWidth="2dp" /> 

Java:
First you need to either get a ProgressWheel from a layout file, or initalise one. Do this by:

  • ProgressWheel pw = new ProgressWheel(myContext, myAttributes);
  • ProgressWheel pw = (ProgressWheel) findViewById(R.id.pw_spinner);

To spin the progress wheel, you just call .startSpinning() and to stop it spinning, you call .stopSpinning()

Incrementing the progress wheel is slightly more tricky, you call .incrementProgress(). However, this is out of 360,
(because a circle has 360 degrees), and will automatically reset once you get past 360. A percentage display is
automatically displayed.

Using as a dependency

Add this to your build.gradle:

	repositories {
	    maven { url "https://jitpack.io" }
	}
	
	dependencies {
	    compile 'com.github.Todd-Davies:ProgressWheel:1.2'
	}

Using as a library project

To use it as a library in Android Studio, please edit build.gradle.

Modify:

apply plugin: 'android'

Into:

apply plugin: 'android-library'

Since Android SDK Tools revision 17 (released March 2012), this component can be used as a library project. In this case, you do not need to copy anything into your project's attrs.xml, and you must use the following namespace URI, instead of the above:

xmlns:ProgressWheel="http://schemas.android.com/apk/res-auto"

Otherwise, usage should be the same.

Todd Davies - @Todd__Davies - 2012