ProgressBar custom layout corners not working

Question

I'm trying to create a custom progressBar in my Android app, but I'm stuck in applying the corners on the progress layout.

Here is the intended result:

My code is this:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

<item android:id="@android:id/background">
    <shape>
        <padding
            android:bottom="1dp"
            android:left="1dp"
            android:right="1dp"
            android:top="1dp" />
        <solid android:color="@android:color/white" />
    </shape>
</item>

<item android:id="@android:id/progress" android:gravity="center">
    <clip>
        <shape android:shape="rectangle">
            <corners
                android:bottomRightRadius="20dp"
                android:topRightRadius="20dp" />
            <solid android:color="#026B91" />
        </shape>
    </clip>
</item>

And the layout result from the code:

I can't seem to do the round corner from the progress layout, I tried different approaches but nothing works. What am I missing? Thanks

Thanks for the reply. I doesn't affect it, plus I need that padding for the intended design. — Phantom, Sep 21 '17 at 10:16
@AndyDeveloper I tried that, but no changes in the final result. — Phantom, Sep 21 '17 at 10:50
Strange the I just copy and paste your code and remove that padding and it is working for me. — Andy Developer, Sep 21 '17 at 10:52
@AndyDeveloper Can you copy your code in a pastebin and paste the link here? — Phantom, Sep 21 '17 at 10:54
@Phantom see my answer this is what I do and the output is the screenshot. — Andy Developer, Sep 21 '17 at 11:09
@Phantom may be you are setting background instead of progressDrawable in progressbar — Andy Developer, Sep 21 '17 at 11:10
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/154985/discussion-between-andy-developer-and-phantom). — Andy Developer, Sep 21 '17 at 11:36
Have you seen this one https://stackoverflow.com/questions/42646574/progress-bar-with-rounded-corners — Stefanija, Sep 21 '17 at 18:27
@Merian Thank you so much, that was exactly the answer I was looking for. Cheers — Phantom, Sep 21 '17 at 21:55

score -1 · Answer 1 · answered Sep 21 '17 at 10:27

-1

Use below drawable as your progressbar drawable.

<?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>
    <solid
            android:color="@color/progbar_color" />
    <corners android:radius="60dp"/>
</shape>
</item>

<item
android:id="@android:id/progress">
<clip>
    <shape>
        <solid
            android:color="@color/progbar_track_color" />
        <corners android:radius="60dp"/>
    </shape>
</clip>
</item>

</layer-list>

answered Sep 21 '17 at 10:27

Sathyaram T

27
2

@pskink Thanks, but then do you know another approach on how can I achieve my design? – Phantom Sep 21 '17 at 10:37
@pskink Thanks, I tried the one but it doesn't work. Thanks for the other answer also, but I'm trying to do this via XML. I'm still searching for a solution for that. – Phantom Sep 21 '17 at 10:49

score -1 · Answer 2 · answered Sep 21 '17 at 10:28

Try the below code:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

<item android:id="@android:id/background">
    <shape>
        <padding
            android:bottom="1dp"
            android:left="1dp"
            android:right="1dp"
            android:top="1dp" />
        <solid android:color="@android:color/white" />
    </shape>
</item>

<item android:id="@android:id/progress" android:gravity="center">
    <clip>
        <shape android:shape="rectangle">
            <corners
                android:radius="0dp"
                android:bottomRightRadius="20dp"
                android:topRightRadius="20dp" />
            <solid android:color="#026B91" />
        </shape>
    </clip>
</item>

My experience is that if you want to set android:bottomRightRadius="20dp" and android:topRightRadius="20dp" you should set android:radius="0dp" also.

Thanks, but still the same result. – Phantom Sep 21 '17 at 10:50 — Phantom, Sep 21 '17 at 10:50

ProgressBar custom layout corners not working

2 Answers2