使用系統(tǒng)自帶的seek bar则吟,有一個(gè)問題槐臀,點(diǎn)擊滑動(dòng)條的時(shí)候,滑塊會(huì)過去氓仲。水慨。。
這里有個(gè)第三方庫敬扛,效果可以看下:
https://github.com/MAXDeliveryNG/slideview
這個(gè)庫做的還挺漂亮的晰洒,但是他有一個(gè)硬傷,在剛開始點(diǎn)擊滑塊的時(shí)候啥箭,滑塊會(huì)右移谍珊。。
嘗試過給滑塊設(shè)置一個(gè)margin急侥,讓滑塊的右邊和滑動(dòng)條的右邊挨著砌滞,這樣可以一定程度上解決上面的問題,但是這樣做的話坏怪,滑塊就不跟手了贝润,滑塊會(huì)先到達(dá)后面,這時(shí)候只能手動(dòng)計(jì)算滑動(dòng)的距離铝宵,來修正這個(gè)問題打掘。。。
有點(diǎn)麻煩胧卤,就放棄了唯绍。
然后就自己畫一個(gè)view,本來我是用如下這種布局方式枝誊,然后設(shè)置監(jiān)聽touch事件,但是感覺有點(diǎn)low惜纸,于是就自己畫了叶撒。
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="match_parent"
>
<ImageView
android:layout_width="270dp"
android:layout_height="45dp"
android:layout_marginStart="7dp"
android:layout_marginEnd="7dp"
android:layout_marginTop="12dp"
android:background="@drawable/layer_seekbar_progress"
android:clickable="true"
/>
<TextView
android:layout_width="270dp"
android:layout_height="45dp"
android:layout_marginStart="7dp"
android:layout_marginEnd="7dp"
android:layout_marginTop="12dp"
android:gravity="center"
android:textStyle="bold"
android:text="dsjfgdhjsfjksdhfl"
android:textColor="#ffffff"/>
<ImageView
android:id="@+id/image"
android:layout_width="wrap_content"
android:layout_height="70dp"
android:background="@mipmap/btn_slide_to_pay"
android:clickable="false"/>
</FrameLayout>
具體的做法就是給滑動(dòng)條設(shè)置touch時(shí)間的監(jiān)聽,然后動(dòng)態(tài)的更改滑塊的位置和背景色耐版。
最后效果還不錯(cuò)祠够。剛開始點(diǎn)擊滑塊,滑塊也不會(huì)向右移動(dòng)粪牲。
接下來古瓤,來看自定義的view。
具體代碼如下:
public class EPSlideView extends View {
private Paint paint;
private Bitmap slideBitmap;
private int margin;
private int slideBgWidth;
private int slideBgHeight;
private int slideBgRadius;
private int grey;
private int green;
private int white;
private int slideLeft;
private boolean slideIsMoving;
private int lastX;
private OnStopTrackingTouchListener onStopTrackingTouch;
private boolean isStartAnimator;
private int textSize;
private Rect textRect;
private int cleanColor;
public EPSlideView(Context context) {
super(context);
}
public EPSlideView(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
}
{
paint = new Paint();
paint.setStyle(Paint.Style.FILL);
paint.setAntiAlias(true);
paint.setStrokeJoin(Paint.Join.ROUND);
paint.setStrokeCap(Paint.Cap.ROUND);
margin = getResources().getDimensionPixelOffset(R.dimen.slide_margin);
slideBgWidth = getResources().getDimensionPixelOffset(R.dimen.slide_bg_width);
slideBgHeight = getResources().getDimensionPixelOffset(R.dimen.slide_bg_height);
slideBgRadius = getResources().getDimensionPixelOffset(R.dimen.slide_bg_radius);
textSize = getResources().getDimensionPixelOffset(R.dimen.common_text_size_16sp);
grey = ContextCompat.getColor(getContext(), R.color.grey_A8A8A9);
green = ContextCompat.getColor(getContext(), R.color.green_6bcd00);
white = ContextCompat.getColor(getContext(), R.color.white_color);
cleanColor = ContextCompat.getColor(getContext(), R.color.clear_color);
slideLeft = 0;
}
@Override
protected void onAttachedToWindow() {
super.onAttachedToWindow();
slideBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.btn_slide_to_pay);
textRect = new Rect(slideBitmap.getWidth(), margin, slideBgWidth, slideBgHeight + margin);
}
@Override
protected void onDetachedFromWindow() {
super.onDetachedFromWindow();
slideBitmap.recycle();
}
@Override
public boolean onTouchEvent(MotionEvent event) {
int action = event.getAction();
switch (action) {
case MotionEvent.ACTION_DOWN:
lastX = (int) event.getRawX();
if (isStartAnimator) {
return false;
}
// check finger is touch above slide
if (event.getX() > slideLeft && event.getX() < slideBitmap.getWidth() + slideLeft) {
slideIsMoving = true;
return true;
}
return false;
case MotionEvent.ACTION_MOVE:
int dx = (int) event.getRawX() - lastX;
slideLeft += dx;
if (slideLeft < 0) {
slideLeft = 0;
}
if (slideLeft > slideBgWidth + margin * 2 - slideBitmap.getWidth()) {
slideLeft = slideBgWidth + margin * 2 - slideBitmap.getWidth();
}
if (slideIsMoving) {
invalidate();
lastX = (int) event.getRawX();
}
break;
case MotionEvent.ACTION_UP:
if (slideIsMoving) {
if (onStopTrackingTouch != null) {
if (slideLeft + slideBitmap.getWidth() >= slideBgWidth + margin * 2) {
onStopTrackingTouch.success();
} else {
onStopTrackingTouch.fail();
if (slideLeft > 0) {
backZero();
}
}
}
slideIsMoving = false;
}
break;
default:
break;
}
return super.onTouchEvent(event);
}
@Override
protected void onDraw(Canvas canvas) {
// paint grey bg
paint.setColor(grey);
canvas.drawRoundRect(slideLeft + slideBitmap.getWidth() - margin * 2, margin, slideBgWidth + margin,
slideBgHeight + margin, slideBgRadius, slideBgRadius, paint);
//paint green bg
paint.setColor(green);
canvas.drawRoundRect(margin, margin, slideLeft + margin * 2,
slideBgHeight + margin, slideBgRadius, slideBgRadius, paint);
//paint text
paint.setTextSize(textSize);
paint.setColor(cleanColor);
canvas.drawRect(textRect, paint);
paint.setColor(white);
paint.setTypeface(Typeface.create(Typeface.DEFAULT, Typeface.BOLD));
Paint.FontMetricsInt fontMetrics = paint.getFontMetricsInt();
int baseline = (textRect.bottom + textRect.top - fontMetrics.bottom - fontMetrics.top) / 2;
paint.setTextAlign(Paint.Align.CENTER);
canvas.drawText(getResources().getString(R.string.confirm_amount_seekbar_text),
textRect.centerX(), baseline, paint);
//paint slide
canvas.drawBitmap(slideBitmap, slideLeft, 0, paint);
super.onDraw(canvas);
}
public void backZero() {
ObjectAnimator slideAnimator = ObjectAnimator.ofInt(this,
"slideLeft", this.slideLeft, 0);
slideAnimator
.setDuration(300).start();
slideAnimator.addListener(new Animator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animation) {
isStartAnimator = true;
}
@Override
public void onAnimationEnd(Animator animation) {
isStartAnimator = false;
}
@Override
public void onAnimationCancel(Animator animation) {
}
@Override
public void onAnimationRepeat(Animator animation) {
}
});
}
@Keep
public void setSlideLeft(int slideLeft) {
this.slideLeft = slideLeft;
invalidate();
}
public void setOnStopTrackingTouch(OnStopTrackingTouchListener onStopTrackingTouch) {
this.onStopTrackingTouch = onStopTrackingTouch;
}
public interface OnStopTrackingTouchListener {
void success();
void fail();
}