When is indeterminate progressbar coming to Android Support Library

AndroidMaterial DesignAndroid Support-LibraryAndroid AppcompatAndroid Progressbar

Android Problem Overview


My applications UI is built using the Android Support Library, but there is currently no AppCompat version of the (intederminate) progressbar, which my app really needs.

I would prefer to not use any third party libraries to achieve material design progressbars, so I'm wondering if anyone sits on information about why it's not included in the support library, and if there is any sign of it arriving (and when).

Android Solutions


Solution 1 - Android

Material Components Library

You can use the LinearProgressIndicator with the android:indeterminate="true" attribute:

<com.google.android.material.progressindicator.LinearProgressIndicator
    android:indeterminate="true"
    app:indicatorColor="?attr/colorPrimary"/>

enter image description here

You can also use different colors using:

<com.google.android.material.progressindicator.LinearProgressIndicator
        android:indeterminate="true"
        app:indicatorColor="@array/progress_colors"
        app:indeterminateAnimationType="contiguous"/>

with:

  <integer-array name="progress_colors">
    <item>@color/...</item>
    <item>@color/....</item>
    <item>@color/....</item>
  </integer-array>

enter image description here

You can also use the CircularProgressIndicator component to have a circular progress indicator:

<com.google.android.material.progressindicator.CircularProgressIndicator
    android:indeterminate="true"
    app:indicatorColor="?attr/colorPrimary"/>

enter image description here

Note: It requires at least the version 1.3.0-alpha04


Jetpack compose

With 1.0.x you can use the LinearProgressIndicator or CircularProgressIndicator

// Indeterminate
CircularProgressIndicator()
LinearProgressIndicator()

// Determinate
CircularProgressIndicator(progress = ..)
LinearProgressIndicator(progress = ..)

Example:

var progress by remember {  mutableStateOf(0.1f) }

LinearProgressIndicator(
    backgroundColor = Color.White,
    progress = progress,
    color = Blue
)

AppCompat

You can use a ProgressBar with an AppCompat style.

Just add this in your layout:

<ProgressBar
        style="@style/Base.Widget.AppCompat.ProgressBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:indeterminate="true"
        android:visibility="visible" />

If you would like an Horizontal progress bar use:

  <ProgressBar
        style="@style/Base.Widget.AppCompat.ProgressBar.Horizontal"
        android:layout_width="match_parent"
        android:layout_height="8dp"
        android:layout_marginTop="24dp"
        android:indeterminate="true"
        android:visibility="visible" />

They follow the official material guidelines.

Solution 2 - Android

This is an answer to an old question, but I figured fellow readers might be interested in this solution:

Newer versions (26.1.+) of the Support Library contain a class called CircularProgressDrawable that implements the exact look of the native Material indeterminate drawable. In order to easily use this in a layout, you can build a MaterialProgressBar like this:

public class MaterialProgressBar extends ProgressBar{
    // Same dimensions as medium-sized native Material progress bar
    private static final int RADIUS_DP = 16;
    private static final int WIDTH_DP = 4;

    public MaterialProgressView(Context context, AttributeSet attrs) {
        super(context, attrs);
 
        // The version range is more or less arbitrary - you might want to modify it
        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP
                || Build.VERSION.SDK_INT > Build.VERSION_CODES.O_MR1) {

            final DisplayMetrics metrics = getResources().getDisplayMetrics();
            final float screenDensity = metrics.density;

            CircularProgressDrawable drawable = new CircularProgressDrawable(context);
            drawable.setColorSchemeColors(getResources().getColor(R.color.colorPrimary));
            drawable.setCenterRadius(RADIUS_DP * screenDensity);
            drawable.setStrokeWidth(WIDTH_DP * screenDensity);
            setIndeterminateDrawable(drawable);
        }
    }
}

Solution 3 - Android

I am just trying to improve the answer by Mr Gabriele Mariotti using styles.

  1. Write a style like this

     <style name="infinite_progress_horizontal" parent="Widget.AppCompat.ProgressBar.Horizontal">
         <item name="android:layout_width">match_parent</item>
         <item name="android:layout_height">wrap_content</item>
         <item name="android:indeterminate">true</item>
     </style>
    
  2. Use it with your progressbar like this.

     <ProgressBar style="@style/infinite_progress_horizontal" />
    

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionJoakimView Question on Stackoverflow
Solution 1 - AndroidGabriele MariottiView Answer on Stackoverflow
Solution 2 - AndroidFD_View Answer on Stackoverflow
Solution 3 - AndroidrahulrvpView Answer on Stackoverflow