安卓 垂直SeekBar

时间:2021-09-30 06:19:19


import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.view.MotionEvent;

import androidx.appcompat.widget.AppCompatSeekBar;


/**
* @author zhangwei on 2019/12/11.
*/
public class VerticalSeekBar extends AppCompatSeekBar {

private Drawable mThumb;
private OnSeekBarChangeListener mOnSeekBarChangeListener;

public VerticalSeekBar(Context context) {
super(context);
}

public VerticalSeekBar(Context context, AttributeSet attrs) {
super(context, attrs);
}

public VerticalSeekBar(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}

@Override
public void setOnSeekBarChangeListener(OnSeekBarChangeListener l) {
mOnSeekBarChangeListener = l;
}

@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(h, w, oldh, oldw);
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(heightMeasureSpec, widthMeasureSpec);
setMeasuredDimension(getMeasuredHeight(), getMeasuredWidth());
}

@Override
protected void onDraw(Canvas c) {
c.rotate(-90);
c.translate(-getHeight(), 0);

super.onDraw(c);
}

@Override
public synchronized void setProgress(int progress) {
super.setProgress(progress);
onProgressRefresh(getProgress() / (float) getMax(), true);
}

@Override
public void setProgress(int progress, boolean animate) {
super.setProgress(progress, animate);
onProgressRefresh(getProgress() / (float) getMax(), true);
}

public void onProgressRefresh(float scale, boolean fromUser) {
Drawable thumb = mThumb;
if (thumb != null) {
setThumbPos(getHeight(), thumb, scale, Integer.MIN_VALUE);
invalidate();
}
if (mOnSeekBarChangeListener != null) {
mOnSeekBarChangeListener.onProgressChanged(this, getProgress(), fromUser);
}
}

private void setThumbPos(int w, Drawable thumb, float scale, int gap) {
int available = w - getPaddingLeft() - getPaddingRight();

int thumbWidth = thumb.getIntrinsicWidth();
int thumbHeight = thumb.getIntrinsicHeight();

int thumbPos = (int) (scale * available 0.5f);

// int topBound = getWidth() / 2 - thumbHeight / 2 - getPaddingTop();
// int bottomBound = getWidth() / 2 thumbHeight / 2 - getPaddingTop();
int topBound, bottomBound;
if (gap == Integer.MIN_VALUE) {
Rect oldBounds = thumb.getBounds();
topBound = oldBounds.top;
bottomBound = oldBounds.bottom;
} else {
topBound = gap;
bottomBound = gap thumbHeight;
}
thumb.setBounds(thumbPos, topBound, thumbPos thumbWidth, bottomBound);
}

@Override
public void setThumb(Drawable thumb) {
mThumb = thumb;
super.setThumb(thumb);
}

void onStartTrackingTouch() {
if (mOnSeekBarChangeListener != null) {
mOnSeekBarChangeListener.onStartTrackingTouch(this);
}
}

void onStopTrackingTouch() {
if (mOnSeekBarChangeListener != null) {
mOnSeekBarChangeListener.onStopTrackingTouch(this);
}
}

private void attemptClaimDrag() {
if (getParent() != null) {
getParent().requestDisallowInterceptTouchEvent(true);
}
}

@Override
public boolean onTouchEvent(MotionEvent event) {
if (!isEnabled()) {
return false;
}
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
setPressed(true);
onStartTrackingTouch();
if (!getThumb().getBounds().contains(getHeight() - (int) event.getY(), (int) event.getX())) {
setProgress(getMax() - (int) (getMax() * event.getY() / getHeight()));
}
break;

case MotionEvent.ACTION_MOVE:
attemptClaimDrag();
if (!getThumb().getBounds().contains(getHeight() - (int) event.getY(), (int) event.getX())) {
setProgress(getMax() - (int) (getMax() * event.getY() / getHeight()));
}
break;
case MotionEvent.ACTION_UP:
case MotionEvent.ACTION_CANCEL:
onStopTrackingTouch();
setPressed(false);
break;
default:
}
return true;
}
}

 

自定义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:gravity="center_vertical|fill_horizontal">
        <layer-list>
            <item>
                <shape>
                    <corners android:radius="5dp" />
                    <gradient
                        android:centerColor="#3d4C9DE6"
                        android:endColor="#1f000000"
                        android:startColor="#1f000000" />
                </shape>
            </item>
            <item
                android:bottom="1dp"
                android:left="1dp">
                <shape>
                    <corners android:radius="5dp" />
                    <size android:height="10dp" />
                    <gradient
                        android:centerColor="#ffC6D9E6"
                        android:endColor="#ffCCDDE7"
                        android:startColor="#FFE0F3FF" />
                </shape>
            </item>
        </layer-list>

    </item>

    <item
        android:id="@android:id/progress"
        android:gravity="center_vertical|fill_horizontal">
        <clip>
            <layer-list>
                <item>
                    <shape>
                        <corners android:radius="5dp" />
                        <gradient
                            android:endColor="#1f000000"
                            android:startColor="#1f000000" />
                    </shape>
                </item>
                <item
                    android:bottom="1dp"
                    android:left="1dp">
                    <shape>
                        <size android:height="10dp" />
                        <corners android:radius="5dp" />
                        <gradient
                            android:centerColor="#FF589EFF"
                            android:endColor="#FF589EFF"
                            android:startColor="#FF589EFF" />
                    </shape>
                </item>
            </layer-list>
        </clip>
    </item>

</layer-list>

 

布局中使用

    <com.boe.mhealth.myview.seekbar.VerticalSeekBar
        android:id="@ id/massager_home_power_seekBar"
        android:layout_width="wrap_content"
        android:layout_height="281dp"
        android:duplicateParentState="true"
        android:max="15"
        android:paddingStart="10dp"
        android:paddingEnd="12dp"
        android:progressDrawable="@drawable/progress_bg"
        android:splitTrack="false"
        android:thumb="@mipmap/icon_thumb"
        app:layout_constraintEnd_toEndOf="@id/massager_home_power_value"
        app:layout_constraintStart_toStartOf="@id/massager_home_power_value"
        app:layout_constraintTop_toBottomOf="@id/massager_home_power_value" />