Normally the horizontal progress bar will display yellow color which most of you may not like.
Unlike other views, changing the background for progress bar will not work. It will only change background image, but not the bar which shows the progress.
There is one more property in xml, android:progressDrawable. You should change this. But the drawable must be a clip drawable. A clip drawable clips the diagram based on the value set.
So let us create a file called clip.xml
android:drawable, in this case bg is the .png or .xml picture to be used for clip drawable. It should be present in your res/drawable folder. Clip orientation horizontal and gravity left are default values.
Next we should use this in our progress bar
That's all. Our customized progress bar is ready.
But do you notice the text which also gives the time left in number. How is that shown? How do we show a text in progress bar?
That can be achieved by creating a text view with same alignment properties as the progress bar. In my case the progress bar and textview both are to the right of score which is shown as 100.
Unlike other views, changing the background for progress bar will not work. It will only change background image, but not the bar which shows the progress.
There is one more property in xml, android:progressDrawable. You should change this. But the drawable must be a clip drawable. A clip drawable clips the diagram based on the value set.
So let us create a file called clip.xml
<?xml version="1.0" encoding="utf-8"?>
<clip xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/bg"
android:clipOrientation="horizontal"
android:gravity="left"
>
</clip> android:drawable, in this case bg is the .png or .xml picture to be used for clip drawable. It should be present in your res/drawable folder. Clip orientation horizontal and gravity left are default values.
Next we should use this in our progress bar
........
<ProgressBar
android:id="@+id/time"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="match_parent"
android:layout_height="30dp"
android:layout_alignParentTop="true"
android:progressDrawable="@drawable/clipdraw"
android:layout_toRightOf="@id/score"/>
......
That's all. Our customized progress bar is ready.
But do you notice the text which also gives the time left in number. How is that shown? How do we show a text in progress bar?
That can be achieved by creating a text view with same alignment properties as the progress bar. In my case the progress bar and textview both are to the right of score which is shown as 100.
........
<ProgressBar
android:layout_alignParentRight="true"
android:layout_toRightOf="@id/score"
other lines.....
/>
<TextView
android:layout_alignParentRight="true"
android:progressDrawable="@drawable/clipdraw"
android:layout_toRightOf="@id/score"
other lines.....
/>
......