如何以编程方式设置Android SeekBar进度可绘制

Question

我遇到了以编程方式设置SeekBar的进度drawable的问题。 当我在.xml文件中设置它时，一切正常。

<SeekBar
 android:id="@+id/sb"
 android:layout_width="fill_parent"
 android:layout_height="wrap_content"
 .....
 android:progressDrawable="@drawable/seek_bar"/>

但是，当我尝试从像这样的代码设置它时，我遇到了问题：

seekBar.setProgressDrawable(getResources().getDrawable(R.drawable.seek_bar));

背景可绘制然后占据整个搜索栏，我以后无法修改进度 - 拇指移动但是可绘制的进度仍然填满整个搜索栏。此外，搜索栏失去了圆角。似乎进度可绘制在搜索栏的顶部。

我尝试了android progressBar does not update progress view/drawable上提供的解决方案，但它对我不起作用。

Answer 1

我通过使用.xml形状作为我的SeekBar的背景解决了这个问题。 可以通过setProgressDrawable（）方法使用的完整SeekBar解决方案应该是这样的：

//seek_bar.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"
    android:drawable="@drawable/seek_bar_background"/>
<item android:id="@android:id/progress"
    android:drawable="@drawable/seek_bar_progress" />
</layer-list>

//seek_bar_background.xml
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >

<gradient
    android:angle="270"
    android:startColor="#8a8c8f"
    android:endColor="#58595b" />

<corners android:radius="5dip" />

</shape>

//seek_bar_progress.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"
    android:drawable="@drawable/seek_bar_background"/>
<item android:id="@android:id/progress">
    <clip android:drawable="@drawable/seek_bar_progress_fill" />
</item>

</layer-list>

//seek_bar_progress_fill.xml
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >

<gradient
    android:startColor="#b3d27e"       
    android:endColor="#93c044"
    android:angle="270"
 />
 <corners android:radius="5dip" />  

</shape>

在代码中，您可以像这样使用它：

progressBar.setProgressDrawable(getResources().getDrawable(R.drawable.seek_bar));

Answer 2

上面给出的答案是使用xml，但是如果有人想以编程方式执行此操作，请在下面进行操作。

public class SeekBarBackgroundDrawable extends Drawable {

private Paint mPaint = new Paint();
private float dy;

public SeekBarBackgroundDrawable(Context ctx) {
    mPaint.setColor(Color.WHITE);
    dy = ctx.getResources().getDimension(R.dimen.one_dp);
}

@Override
public void draw(Canvas canvas) {
    canvas.drawRect(getBounds().left,getBounds().centerY()-dy/2,getBounds().right,getBounds().centerY()+dy/2,mPaint);
}

@Override
public void setAlpha(int i) {
    mPaint.setAlpha(i);
}

@Override
public void setColorFilter(ColorFilter colorFilter) {

}

@Override
public int getOpacity() {
    return PixelFormat.TRANSLUCENT;
}

}

上面的类是针对搜索栏的背景（在可绘制的进度下始终存在的部分）

public class SeekBarProgressDrawable extends ClipDrawable {

private Paint mPaint = new Paint();
private float dy;
private Rect mRect;


public SeekBarProgressDrawable(Drawable drawable, int gravity, int orientation, Context ctx) {
    super(drawable, gravity, orientation);
    mPaint.setColor(Color.WHITE);
    dy = ctx.getResources().getDimension(R.dimen.two_dp);
}

@Override
public void draw(Canvas canvas) {
    if (mRect==null) {
        mRect = new Rect(getBounds().left, (int)(getBounds().centerY() - dy / 2), getBounds().right, (int)(getBounds().centerY() + dy / 2));
        setBounds(mRect);
    }

    super.draw(canvas);
}


@Override
public void setAlpha(int i) {
    mPaint.setAlpha(i);
}

@Override
public void setColorFilter(ColorFilter colorFilter) {

}

@Override
public int getOpacity() {
    return PixelFormat.TRANSLUCENT;
}

}

以上是可绘制的进度。注意它是一个可绘制的剪辑。这里很酷的部分是我设置的边界是我想要的，以及颜色。这样可以对您的drawable进行微调。

//Custom background drawable allows you to draw how you want it to look if needed
    SeekBarBackgroundDrawable backgroundDrawable = new SeekBarBackgroundDrawable(mContext);
    ColorDrawable progressDrawable = new ColorDrawable(Color.BLUE);
    //Custom seek bar progress drawable. Also allows you to modify appearance.
    SeekBarProgressDrawable clipProgressDrawable = new SeekBarProgressDrawable(progressDrawable,Gravity.LEFT,ClipDrawable.HORIZONTAL,mContext);
    Drawable[] drawables = new Drawable[]{backgroundDrawable,clipProgressDrawable};

    //Create layer drawables with android pre-defined ids
    LayerDrawable layerDrawable = new LayerDrawable(drawables);
    layerDrawable.setId(0,android.R.id.background);
    layerDrawable.setId(1,android.R.id.progress);

    //Set to seek bar
    seekBar.setProgressDrawable(layerDrawable);

上面的代码使用自定义drawable来编辑搜索栏。我这样做的主要原因是我将编辑背景可绘制的外观，因此它具有“凹槽”（虽然尚未实现）。你不能用xml定义的drawable（至少不容易）。

我注意到的另一件事是这个过程阻止了SeekBar变得像拇指可绘制一样宽。它设定了drawables的界限，使它们永远不会变高。

Answer 3

我之前在代码中更改了搜索和进度条的问题。一旦我真正必须加载drawable两次才能正常生效。我认为这与改变图像后的填充有关。

我只是在猜这里，但尝试用

设置填充

 getResources().getDrawable(R.drawable.seek_bar) // once
 seekBar.setProgressDrawable(getResources().getDrawable(R.drawable.seek_bar)); //twice
 seekBar.setPadding(int,int,int,int)

并且也无法使它失效。

 seekBar.postInvalidate()

非常hacky，我不喜欢它，但它在我之前解决了类似的问题

Answer 4

您可以在XML中使用android：maxHeight来限制背景高度

<SeekBar
    android:id="@+id/original_volume"
    android:layout_width="120dp"
    android:layout_height="wrap_content"
    android:maxHeight="2dp"/>

它不会夹住拇指