需求效果：

项目中要求做一个带有音乐倒计时播放功能的拖动条，设计稿效果图如下：

效果预览

图中白条位置代表音乐播放起始点，红条位置代表音乐播放暂停点，深黄色区域表示不能播放区域。要求音乐播放起始点和暂停点之间的距离满足以下关系：

浅黄色区域为白条和红条可移动区域
当白条和红条间距离大于4秒，白条距离红条4秒处开始移动，经过4秒与红条重合。
当白条和红条间距离小于4秒，白条距离红条开始移动，经过两者间距等值换算的秒数后重合。

实现方案：

初步方案：采用系统自带Seekbar作为基本组件，SecondProgress填充深黄色区域，progress填充浅黄色区域，thumb作为红条，外加绘制白条。
趟坑：
1. 系统自带seekbar在使用AppCompat系列主题时能准确展示效果，使用android:Theme系列主题会出现效果偏差，效果偏差体现为。效果如图所示：
  
  i. AppCompat系列主题
  
  correct_01 correct_02
  ii. android:Theme系列主题
  
  error_01 error_02
  (ps:不要问我为什么不用AppCompat系列主题，该应用暂时没接入，不能因为自己的原因随便引入其他库)
2. 系统自带Seekbar不支持设置thumb位置，图中效果是找UI美工做过修改位置弥补的。这里就不上图了。
3. style="?android:attr/seekBarStyle" 风格自带16dip paddingLeft和16dip paddingRight

解决方案：(放弃自带Thumb)

将白条，自定义红条，seekbar放在RelativeLayout容器中，存在问题是三者起始坐标不对齐。(坑3)
i. 计算seekbar的左边距与当前控件之间的距离，然后移动到起始点

 private void moveTimeNeedle(int progress) {
     int left = sbRecordProgress.getPaddingLeft();
     float percent = progress / (float) sbRecordProgress.getMax();
     int width = sbRecordProgress.getWidth();
     int boundsWidth = sbRecordProgress.getProgressDrawable().getBounds().width();
     float percentX = boundsWidth * percent;
     timeNeedle.setTranslationX(left - timeNeedle.getWidth() / 2 + percentX);
     System.out.println("moveTimeNeedle,left=" + left + ",timeNeedle,width=" + timeNeedle.getWidth() + ",progressWidth=" + width + "，boundsWidth= " + boundsWidth + ",percentX=" + percentX + "percent=" + percent);
 }

红条同步seek进度,确定seek进度位置，并且移动

 sbRecordProgress.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
     @Override
     public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
         updateThumb(seekBar.getProgress(),seekBar.getSecondaryProgress());
     }

 });

  private void updateThumb(int progress,int secondProgress) {
         if (progress <secondProgress ) {
             return;
         }
         int left = sbRecordProgress.getPaddingLeft();
         float percent = progress / (float) sbRecordProgress.getMax();
         int width = sbRecordProgress.getWidth();
         int boundsWidth = sbRecordProgress.getProgressDrawable().getBounds().width();
         float percentX = boundsWidth * percent;
         float translationX = left - ivThumb.getWidth() / 2 + percentX;
         ivThumb.setTranslationX(translationX);
         System.out.println("updateThumb,left=" + left + ",timeNeedle,width=" + ivThumb.getWidth() + ",progressWidth=" + width + "，boundsWidth= " + boundsWidth + ",percentX=" + percentX + "percent=" + percent);
     }

在页面加载的时候需要将各个UI组件移动到起始位置，但是获取不到进度条宽度(宽度=0)

这是由于在onCreate的时候View的测量工作还没有完成，导致拿不到宽度。解决方案：把取值放到view的一个线程中

 sbRecordProgress.post(new Runnable() {
     @Override
     public void run() {
         int boundsWidth = sbRecordProgress.getProgressDrawable().getBounds().width();
         int top = sbRecordProgress.getTop();
         int left = sbRecordProgress.getLeft();
         System.out.println("top=" + top + ",left=" + left);
     }
 });