Android 使用SeekBar时动态显示进度且随SeekBar一起移动

好久没有更新博客了！在滑动SeekBar的时候，要同时显示进度，而且通常要求最小值比0小，按照惯例，先看看效果图：


一、自定义控件 用于在SeekBar上方，跟随SeekBar一块移动的控件显示进度

package la.trytry.seekbar;

import android.content.Context;
import android.util.AttributeSet;
import android.view.ViewGroup;

/**
 * @author: lijuan
 * @description:
 * @date: 2017-05-31
 * @time: 17:49
 */
public class CustomLayout extends ViewGroup {

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

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

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

    @Override
    protected void onLayout(boolean changed, int l, int t, int r, int b) {

    }
}

二、MainActivity，代码很简单！稍微看下就懂的了~

package la.trytry.seekbar;

import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.util.Log;
import android.view.ViewGroup;
import android.widget.SeekBar;
import android.widget.TextView;

public class MainActivity extends Activity {
    private SeekBar seekbar = null;
    private int startValue = 0;
    private int endValue = 100;
    private int totalValue;
    private TextView text, mTvStartValue, mTvEndValue;
    private int screenWidth;//屏幕宽度
    private CustomLayout textMoveLayout;//自定义随着拖动条一起移动的空间
    private float moveStep = 0;//托动条的移动步调
    private ViewGroup.LayoutParams layoutParams;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        screenWidth = getWindowManager().getDefaultDisplay().getWidth();
        text = new TextView(this);
        text.setBackgroundColor(Color.rgb(245, 245, 245));
        text.setTextColor(Color.rgb(0, 161, 229));
        text.setTextSize(16);
        layoutParams = new ViewGroup.LayoutParams(screenWidth, 50);
        textMoveLayout = (CustomLayout) findViewById(R.id.textLayout);
        textMoveLayout.addView(text, layoutParams);
        text.layout(0, 20, screenWidth, 80);

        seekbar = (SeekBar) findViewById(R.id.seekbar);
        mTvStartValue = (TextView) findViewById(R.id.start_value);
        mTvEndValue = (TextView) findViewById(R.id.end_value);

        seekbar.setOnSeekBarChangeListener(new OnSeekBarChangeListener());
        init();
    }

    public void init() {
        mTvStartValue.setText(String.valueOf(startValue));
        mTvEndValue.setText(String.valueOf(endValue));
        text.setText(String.valueOf(startValue));
        seekbar.setEnabled(true);
        seekbar.setMax(Math.abs(endValue));
        seekbar.setProgress(startValue);

        if (startValue < 0 && endValue < 0) {
            totalValue = Math.abs(startValue) - Math.abs(endValue);
        } else if (startValue < 0 && endValue > -1) {
            totalValue = endValue + Math.abs(startValue);
        } else {
            totalValue = endValue - startValue;
        }
        moveStep = (float) (((float) screenWidth / totalValue) * 0.8);
    }

    private class OnSeekBarChangeListener implements
            SeekBar.OnSeekBarChangeListener {

        // 触发操作，拖动
        public void onProgressChanged(SeekBar seekBar, int progress,
                                      boolean fromUser) {
            text.layout((int) (progress * moveStep), 20, screenWidth, 80);
            text.setText(check(progress));
        }

        // 表示进度条刚开始拖动，开始拖动时候触发的操作
        public void onStartTrackingTouch(SeekBar seekBar) {

        }

        // 停止拖动时候
        public void onStopTrackingTouch(SeekBar seekBar) {
        }
    }

    private String check(int progress) {
        int curValue = totalValue * progress/Math.abs(endValue);
        if (startValue <0 && endValue < 0) {
            curValue = startValue + curValue;
        } else if (startValue < 0 && endValue > -1) {
            curValue = curValue + startValue;
        }
        Log.e("check", totalValue+"，"+curValue+"，"+ seekbar.getMax());
        return String.valueOf(curValue);
    }
}

三、po_seekbar.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">
        <shape>
            <solid android:color="#c6c6c6" />
        </shape>
    </item>
    <item android:id="@*android:id/secondaryProgress">
        <clip>
            <shape>
                <solid android:color="#c6c6c6" />
            </shape>
        </clip>
    </item>
    <item android:id="@*android:id/progress">
        <clip>
            <shape>
                <solid android:color="#06a7fa" />
            </shape>
        </clip>
    </item>
</layer-list>

四、seekbar_thumb.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@mipmap/seekbar_nomal" android:state_focused="true" android:state_pressed="false"/>
    <item android:drawable="@mipmap/seekbar_press" android:state_focused="true" android:state_pressed="true"/>
    <item android:drawable="@mipmap/seekbar_press" android:state_focused="false" android:state_pressed="true"/>
    <item android:drawable="@mipmap/seekbar_nomal"/>

</selector>

五、activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#F5F5F5"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" >

        <la.trytry.seekbar.CustomLayout
            android:id="@+id/textLayout"
            android:layout_width="match_parent"
            android:layout_height="40dp" />

        <SeekBar
            android:id="@+id/seekbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:focusable="true"
            android:maxHeight="4dp"
            android:minHeight="4dp"
            android:paddingLeft="5dp"
            android:paddingRight="5dp"
            android:progressDrawable="@drawable/po_seekbar"
            android:thumb="@drawable/seekbar_thumb" />
    </LinearLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <TextView
            android:id="@+id/start_value"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_marginLeft="14dp"
            android:textColor="#959595" />

        <TextView
            android:id="@+id/end_value"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_marginRight="14dp"
            android:textColor="#959595" />
    </RelativeLayout>

</LinearLayout>

好了，本篇文章就这样啦，存在总结不到位的地方还望指导，感谢^_^

源码地址