更新android Seekbar中的垂直拇指答案

【问题标题】：Update vertical thumb in android Seekbar更新android Seekbar中的垂直拇指
【发布时间】：2016-05-08 20:41:36
【问题描述】：

我想更新自定义 Seekbar 的拇指垂直位置。

我目前的状态

但我想让拇指居中在背景的顶部边缘，就像这样

搜索栏 xml

<SeekBar
    android:id="@+id/track_seek_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignBottom="@+id/controls_layout"
    android:layout_alignTop="@+id/details_layout"
    android:layout_marginBottom="-16dp"
    android:layout_marginTop="-16dp"
    android:background="@android:color/transparent"
    android:clipChildren="false"
    android:minHeight="0dp"
    android:paddingEnd="0dp"
    android:paddingLeft="0dp"
    android:splitTrack="false"
    android:paddingRight="0dp"
    android:paddingStart="0dp"
    android:paddingTop="0dp"
    android:progressDrawable="@drawable/media_progress_bar"
    android:thumbOffset="10dp" />

还有这个 media_progress_bar.xml

<item
    android:id="@android:id/background"
    android:top="28dp">
    <shape>
        <solid android:color="@android:color/transparent" />
    </shape>
</item>
<item
    android:id="@android:id/secondaryProgress"
    android:top="28dp">
    <scale
        android:drawable="@android:color/transparent"
        android:scaleWidth="100%" />
</item>
<item
    android:id="@android:id/progress"
    android:top="28dp">
    <scale
        android:drawable="@color/media_seebar_progress"
        android:scaleWidth="100%" />

    <padding
        android:bottom="3dip"
        android:left="3dip"
        android:right="3dip"
        android:top="3dip" />
</item>

任何想法如何实现这一点。

【问题讨论】：

标签： android xml seekbar android-seekbar

【解决方案1】：

我创建了一个扩展 SeekBar

的新类

public class MediaSeekBar extends SeekBar {

private Bitmap thumbDrawable;
public MediaSeekBar(Context context) {
    super(context);
    thumbDrawable = BitmapFactory.decodeResource(getResources(), R.drawable.circle_prgressbar);
}

 public MediaSeekBar(final Context context, final AttributeSet attrs) {
        super(context, attrs);
        thumbDrawable = BitmapFactory.decodeResource(getResources(), R.drawable.circle_prgressbar);
    }

    public MediaSeekBar(final Context context, final AttributeSet attrs, final int defStyle) {
        super(context, attrs, defStyle);
        thumbDrawable = BitmapFactory.decodeResource(getResources(), R.drawable.circle_prgressbar);
    }

 @Override
    protected synchronized void onDraw(final Canvas canvas) {
        super.onDraw(canvas);

        final int width = getMeasuredWidth();
        canvas.drawBitmap(thumbDrawable, (width * getProgress() / getMax()) - (thumbDrawable.getWidth() / 2) , - thumbDrawable.getHeight() / 2, null);

    }
}

我在xml中使用了它

<com.nweave.songflip.custom.MediaSeekBar
        android:id="@+id/track_seek_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/controls_layout"
        android:layout_alignTop="@+id/details_layout"
        android:background="@android:color/transparent"
        android:clipChildren="false"
        android:minHeight="0dp"
        android:paddingEnd="0dp"
        android:splitTrack="false"
        android:paddingLeft="0dp"
        android:paddingRight="0dp"
        android:paddingStart="0dp"
        android:paddingTop="-16dp"
        android:thumb="@android:color/transparent"
        android:progressDrawable="@drawable/media_progress_bar"
        android:thumbOffset="10dp" />

请注意拇指在 xml 中是透明的，因为我重写了 Java 类中的 draw 方法以在所需位置绘制拇指。

【讨论】：