更新 android 搜索栏中的垂直缩略图
Update vertical thumb in android 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>
关于如何实现这一点的任何想法。
我创建了一个新的 class,它扩展了 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 方法 class 以在所需位置绘制拇指。
我想更新自定义搜索栏的拇指的垂直位置。
我目前的状态
但我想让拇指居中在背景的上边缘,就像这样
搜索栏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>
关于如何实现这一点的任何想法。
我创建了一个新的 class,它扩展了 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 方法 class 以在所需位置绘制拇指。