Custom Seek Bar for Android

Question

enter image description here Hello Dears ,

I need to create custom Seek Bar with the dashed progress line .

I tried to design the progress line with layer list , but one item is overwriting the previous item. Please see the code below.

How it can be done by XML or by Canvas?

Please your help!

<item>

    <shape android:shape="line">
        <stroke android: color="#ff0000"

            android:dashWidth="20px"
            android:dashGap="10px"
            android: width="2dp"/>
    </shape>

</item>

<item android:end="200dp">


    <shape android:shape="line">

        <stroke android: color="#ff0000"
            android:dashWidth="30px"
            android:dashGap="10px"
            android: width="2dp"/>
    </shape>
</item>