美文网首页
Android 使用SeekBar时动态显示进度且随SeekBa

Android 使用SeekBar时动态显示进度且随SeekBa

作者: Angelicas | 来源:发表于2017-06-06 21:46 被阅读460次

    好久没有更新博客了!在滑动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>
    

    源码地址

    相关文章

      网友评论

          本文标题:Android 使用SeekBar时动态显示进度且随SeekBa

          本文链接:https://www.haomeiwen.com/subject/nmqsfxtx.html