Android 自定义SeekBar 实现分段显示不同背景颜色的示例代码

在最近的开发工作中，要实现一个调色板的进度条，SeekBar要分成10段显示不同颜色，功夫不负有心人，终于实现了这个功能，下面分享给大家
示例图：

1.自定义SeekBar

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.os.Build;
import android.util.AttributeSet;
import android.widget.SeekBar;


public class MulticolourSeekBar extends SeekBar {

 
 private Paint mMulticlourPaint;

 
 private int mMulticlourCount = 9;

 
 private int mMulticlourWidth = 2;

 
 private int mMulticlourColor = Color.WHITE;

 
 private boolean isShowTopOfThumb = false;

 public MulticolourSeekBar(Context context) {
 super(context);
 init();
 }

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

 public MulticolourSeekBar(Context context, AttributeSet attrs, int defStyleAttr) {
 super(context, attrs, defStyleAttr);
 init();
 }

 
 private void init() {
 //创建绘制刻度线的画笔
 mMulticlourPaint = new Paint();
 mMulticlourPaint.setColor(mMulticlourColor);
 mMulticlourPaint.setAntiAlias(true);

 //Api21及以上调用，去掉滑块后面的背景
 if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
  setSplitTrack(false);
 }
 }

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

 //极限条件校验
 if (getWidth() <= 0 || mMulticlourCount <= 0) {
  return;
 }

 //获取每一份的长度
// int length = (getWidth() - getPaddingLeft() - getPaddingRight() - mMulticlourCount * mMulticlourWidth) / (mMulticlourCount + 1);
 int length = (getWidth() - getPaddingLeft() - getPaddingRight()) / (mMulticlourCount + 1);
 //计算刻度线的顶部坐标和底部坐标
 int rulerTop = getHeight() / 2 - getMinimumHeight() / 2;
 int rulerBottom = rulerTop + getMinimumHeight();

 //获取滑块的位置信息
 Rect thumbRect = null;
 if (getThumb() != null) {
  thumbRect = getThumb().getBounds();
 }
 //绘制刻度线
// for (int i = 1; i <= mMulticlourCount; i++) {
//  //计算刻度线的左边坐标和右边坐标
//  int rulerLeft = i * length + getPaddingLeft();
//  int rulerRight = rulerLeft + mMulticlourWidth;
//
//  //判断是否需要绘制刻度线
//  if (!isShowTopOfThumb && thumbRect != null && rulerLeft - getPaddingLeft() > thumbRect.left && rulerRight - getPaddingLeft() < thumbRect.right) {
//  continue;
//  }
//
//  //进行绘制
//  canvas.drawRect(rulerLeft, rulerTop, rulerRight, rulerBottom, mMulticlourPaint);
// }
 for (int i = 0; i <= mMulticlourCount; i++) {
  int left = getPaddingLeft() + i * length;
  int right = left + length;
  if (i % 3 == 0) {
  mMulticlourPaint.setColor(Color.RED);
  } else if (i % 3 == 1) {
  mMulticlourPaint.setColor(Color.YELLOW);
  } else {
  mMulticlourPaint.setColor(Color.BLUE);
  }
  if (i == 0) {
  canvas.drawCircle(getPaddingLeft() + 10, 20, 10, mMulticlourPaint);
  left += 10;
  canvas.drawRect(left, 10, right, 30, mMulticlourPaint);
  } else if (i == mMulticlourCount) {
  right -= 10;
  canvas.drawRect(left, 10, right, 30, mMulticlourPaint);
  canvas.drawCircle(right, 20, 10, mMulticlourPaint);
  } else {
  canvas.drawRect(left, 10, right, 30, mMulticlourPaint);
  }
 }
 }

 
 public void setRulerCount(int mRulerCount) {
 this.mMulticlourCount = mRulerCount;
 requestLayout();
 }

 
 public void setRulerWidth(int mRulerWidth) {
 this.mMulticlourWidth = mRulerWidth;
 requestLayout();
 }

 
 public void setRulerColor(int mRulerColor) {
 this.mMulticlourColor = mRulerColor;
 if (mMulticlourPaint != null) {
  mMulticlourPaint.setColor(mRulerColor);
  requestLayout();
 }
 }

 
 public void setShowTopOfThumb(boolean isShowTopOfThumb) {
 this.isShowTopOfThumb = isShowTopOfThumb;
 requestLayout();
 }
}

2.activity_main.xml

3.shape_progress_drawable.xml

4.shape_thumb_icon.xml

总结

到此这篇关于Android 自定义SeekBar 实现分段显示不同背景颜色的文章就介绍到这了,更多相关Android 自定义SeekBar 背景颜色内容请搜索考高分网以前的文章或继续浏览下面的相关文章希望大家以后多多支持考高分网！