Background style doesn't show up on Progress Bar

Question

I'm trying to do something like this:

This is what my code does:

I've this code in my drawable file:

progress_bar_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@android:id/background">
        <shape
            android:innerRadius="70dp"
            android:shape="ring"
            android:thickness="18dp">
        </shape>
    </item>

<item android:id="@android:id/progress">
    <shape
        android:innerRadius="70dp"
        android:shape="ring"
        android:thickness="18dp">

        <gradient
            android:endColor="#ff0f315f"
            android:startColor="#ff005563"
            android:type="sweep" />
    </shape>
</item>


<item android:id="@android:id/secondaryProgress">
    <shape
        android:innerRadius="70dp"
        android:shape="ring"
        android:thickness="18dp">

        <gradient
            android:endColor="#ff1490e4"
            android:startColor="#ff00c0dd"
            android:type="sweep" />
    </shape>
</item>

</layer-list>

layout:

    <ProgressBar
        android:id="@+id/bar"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="180dp"
        android:layout_height="180dp"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:max="100"
        android:progress="99"
        android:progressDrawable="@drawable/progress_bar_layout"
        android:secondaryProgress="30" />

The problem is that my background style doesn't show up. That's why i'm using progress to do background's job, but as you can see, it doesn't work pretty well bcs the maximum size is 99, and there's a space in the end. Am i missing some code?

Answer 1

Basically, i had to split progress_bar_layout.xml drawable file for each element, so, one file with the progress settings, and another for background settings. And then, i added them to the respective elements.

 android:background="@drawable/circle_shape"
 android:progressDrawable="@drawable/circular_progress_bar" />

Using layer list, the project didn't find the background setting, so this approach solved my problem.

circle_shape.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadius="60dp"
    android:shape="ring"
    android:thickness="10dp"
    android:useLevel="false">

    <solid android:color="@color/blue"></solid>

</shape>

circular_progress_bar.xml

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="270"
    android:toDegrees="270">
    <shape
        android:innerRadius="60dp"
        android:shape="ring"
        android:thickness="10dp"
        android:useLevel="true">

        <solid android:color="@color/blue"></solid>

    </shape>
</rotate>