I have a progress bar that is supposed to look like the attached image:
And I've made it a long way. I'm very close the only part that isn't working is the rounded corners for the progressDrawable. Here is what mine looks like. (Notice, circled in red, that the fill inside the white outline does not have rounded corners):
So, I've found a couple of ways to make this work when the progress bar is colored in with a shape, gradient, or color. BUT, I can't get it with an image as the progressDrawable.
Here is my class that extends ProgressBar
public class RoundedProgressBar extends ProgressBar{
private Paint paint;
public RoundedProgressBar(Context context) {
super(context);
setup();
}
public RoundedProgressBar(Context context, AttributeSet attrs) {
super(context, attrs);
setup();
}
public RoundedProgressBar(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
setup(); ;
}
protected void setup()
{
paint = new Paint();
}
@Override
protected synchronized void onDraw(Canvas canvas) {
// First draw the regular progress bar, then custom draw our text
super.onDraw(canvas);
paint.setColor(Color.WHITE);
paint.setStyle(Paint.Style.STROKE);
RectF r = new RectF(0,0,getWidth()-1,getHeight()-1);
canvas.drawRoundRect(r,getHeight()/2,getHeight()/2, paint);
}
}
Here is my selector:
<layer-list
xmlns:android="http://schemas.android.com/apk/res/android"
>
<item
android:id="@android:id/background"
android:drawable="@drawable/slider_track" />
<item
android:id="@android:id/secondaryProgress"
android:drawable="@drawable/slider_track" />
<item
android:id="@android:id/progress"
android:drawable="@drawable/slider_track_progress" />
</layer-list>
Here are the images used in the selector:
slider_track->
slider_track_progress->
Here is where I embed my progressbar in the layout for my activity
<com.android.component.RoundedProgressBar
android:id="@+id/player_hp_bar"
android:layout_width="fill_parent"
android:layout_height="36dip"
android:layout_marginLeft="30dip"
android:layout_marginRight="30dip"
android:max="100"
style="?android:attr/progressBarStyleHorizontal"
android:progressDrawable="@drawable/slider_layer_list"
android:progress="20"
android:maxHeight="12dip"
android:minHeight="12dip"
/>
Anyone know how to make this work?
Not sure if you can actually round out the edges through API, but you could very easily add a new layer between your white outline, and your actual progress object? The layer could be an exact cutout of the white outline, and thus the progress bar would not show outside the outline.