zhu的工作日记：带移动提示的seekBar的Demo（android）

工作点滴，汇聚成雨
（带移动提示的seekBar的Demo）

ViewGroup的代码如下：（TVSeekBar.java）

/**
 * 一个seekBar，上面有一个会跟着滑动的textview， 它继承线性布局，里面添加seekbar与textview，
 * 通过改变textview的位置来达到目的
 * 
 * @author iamzhuwh
 */
public class TVSeekBar extends LinearLayout {
    private Context mContext;
    private TextView tv;
    private SeekBar seekBar;
    private int mProgress;

public TVSeekBar(Context context, AttributeSet attrs) {
    super(context, attrs);
    mContext = context;
}

public TVSeekBar(Context context) {
    super(context);
    mContext = context;
}

@Override
protected void onFinishInflate() {
    initTv();
    initSeekBar();
}

/** 初始化seekBar */
private void initSeekBar() {
    seekBar = (SeekBar) getChildAt(0);
    seekBar.setOnSeekBarChangeListener(new OnSeekBarChangeListener() {

        @Override
        public void onStopTrackingTouch(SeekBar seekBar) {
        }

        @Override
        public void onStartTrackingTouch(SeekBar seekBar) {
        }
        /**seekBar移动的监听回调，invalidate()方法通知父容器重新走绘测流程*/
        @Override
        public void onProgressChanged(SeekBar seekBar, int progress,
                boolean fromUser) {
            mProgress = progress;
            tv.setText("进度:" + progress);
            invalidate();
        }
    });
}

/** 初始化textview */
private void initTv() {
    tv = (TextView) getChildAt(1);
    tv.setText("进度");
}

/**重写此方法，通过重新定义孩子的位置，来达到移动效果*/
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {

    // 在测量方法调用setMeasuredDimension()
    int width = tv.getMeasuredWidth();
    int height = tv.getMeasuredHeight();
    int mLeft;
    WindowManager systemService = (WindowManager) getContext()
            .getSystemService(Context.WINDOW_SERVICE);
    int windowWidth = systemService.getDefaultDisplay().getWidth();
    int temp = windowWidth * mProgress / seekBar.getMax();
    if (temp + width < windowWidth) {
        mLeft = temp;
    } else {
        mLeft = windowWidth - width;
    }
    // 在onlayout中去给孩子布局
    int mTop = 15;
    int mRight = width + mLeft;
    int mBottom = height + mTop;
    // 给tv部分布局
    tv.layout(mLeft, mTop, mRight, mBottom);

    // 给seekBar部分布局
    int cLeft = 0;
    int cTop = mBottom + 18;
    int cRight = seekBar.getMeasuredWidth();
    int cBottom = seekBar.getMeasuredHeight() + cTop;
    seekBar.layout(cLeft, cTop, cRight, cBottom);
}
}

xml部分代码如下：（seekbar_tv.xml）

<?xml version="1.0" encoding="utf-8"?>
<com.example.test.TVSeekBar xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >

<SeekBar
    android:id="@+id/seekBar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    />

<TextView
    android:text="进度"
    android:id="@+id/tv"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
     />
</com.example.test.TVSeekBar>

activity_main.xml的代码如下：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.test.MainActivity" >

<include layout="@layout/seekbar_tv" />
</RelativeLayout>

内容虽然简单，也罢，留着日后要用时留个记录。