zoukankan      html  css  js  c++  java
  • 动态修改SeekBar的颜色

    方法一

    1. 需求:需要改变其默认颜色,样式

    2.滑竿样式

    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" android:height="5dp">
            <shape>
                <corners android:radius="5dp"/>
                <solid android:color="#C9C7C7"/>           <!--  颜色-->
            </shape>
        </item>
    
        <item android:id="@android:id/secondaryProgress" android:height="5dp">
            <clip>
                <shape>
                    <corners android:radius="5dp"/>
                    <solid android:color="#C9C7C7"/>            <!-- 颜色-->
                </shape>
            </clip>
        </item>
    
        <item android:id="@android:id/progress" android:height="5dp">
            <clip>
                <shape>
                    <corners android:radius="5dp"/>
                    <solid android:color="@color/colorPrimary"/>   <!--  颜色-->
                </shape>
            </clip>
        </item>
    </layer-list>

    3. 滑块样式

    select_seekbar.xml

    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <!-- 按下状态-->
        <item  android:state_pressed="true"  android:drawable="@drawable/shape1"/>
    
        <!-- 有焦点状态 -->
        <item  android:state_focused="true"  android:drawable="@drawable/shape"/>
    
        <!-- 普通状态 -->
        <item android:drawable="@drawable/shape" />
    </selector>

    shape.xml

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval"
        android:useLevel="false">
        <solid android:color="@color/colorPrimary"></solid>  <!-- 颜色-->
        <size
            android:width="12dp"
            android:height="12dp"></size>
    </shape>

    shap1.xml

    <?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape="oval"
        android:useLevel="false">
        <solid android:color="@color/colorAccent"></solid> <!-- 颜色-->
        <size
            android:width="14dp"
            android:height="14dp"></size>
    </shape>

    4.布局引用

    <SeekBar
    android:id="@+id/seekbar"
    android:layout_width="368dp"
    android:maxHeight="6dip"
    android:minHeight="6dip"
    android:layout_height="40dp"
    android:max="100"
    android:progressDrawable="@drawable/seekbar"
    android:thumb="@drawable/select_seekbar"
    android:progress="30" />

    <!--maxHeight
    minHeight可以控制滑竿粗线-- >

    方法二

    5.不利用xml,直接修改

     public void setSeekBarColor(SeekBar seekBar, int color){
            LayerDrawable layerDrawable = (LayerDrawable)        
    seekBar.getProgressDrawable(); Drawable dra
    =layerDrawable.getDrawable(2); dra.setColorFilter(color, PorterDuff.Mode.SRC); Drawable dra2=seekBar.getThumb(); seekBar.getThumb().setColorFilter(color, PorterDuff.Mode.SRC_ATOP); seekBar.invalidate(); }

    6.效果图

    二 实现seekbar颜色渐变

    1. 效果

        <SeekBar
                    android:id="@+id/vSeekBarECHO"
                    android:layout_width="@dimen/dp_160"
                    android:layout_height="wrap_content"
                    android:maxHeight="@dimen/dp_13"
                    android:minHeight="@dimen/dp_13"
                    android:translationX="@dimen/dp_m_51"
                    android:rotation="270"
                    android:translationY="@dimen/dp_70"
                    android:paddingStart="0dp"
                    android:saveEnabled="false"
                    android:progressDrawable="@drawable/seekbar_progress_color"
                    android:splitTrack="false"
                    android:thumb="@drawable/icon_seek_block_25"
                    android:thumbOffset="0dp" />

    seekbar_progress_color.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>
                <stroke  android:width="@dimen/dp_1" android:color="#E5E5E5"/>
                <corners android:radius="@dimen/dp_5" />
                <!--
                
                    android:endColor="#FBFBFB"
                    android:centerColor="#9E9D9D"
                    android:startColor="#626060"-->
                <solid android:color="#FAFAFA"/>
                
                <gradient
                    android:angle="0"
                    android:endColor="#FBFBFB"
                    android:centerColor="#FBFBFB"
                    android:startColor="#FBFBFB" />
            
            
            </shape>
        </item>
        
        
        <!-- 第二进度条的背景色 -->
        <item android:id="@android:id/secondaryProgress">
            <clip>
                <shape android:shape="rectangle">
                    <solid android:color="@color/colorSingerName" />
                </shape>
            </clip>
        </item>
        
        
        <!-- <item android:id="@+android:id/background" android:drawable="@drawable/bar_dn" /> -->
        <!-- 可拖动的进度条颜色 -->
        <item android:id="@android:id/progress">
            <clip>
                <shape>
                    <stroke  android:width="@dimen/dp_1" android:color="#E5E5E5"/>
                    <corners android:radius="@dimen/dp_5" />
                    <gradient
                        android:angle="0"
                        android:centerColor="@color/colorSeekBarPro50"
                        android:endColor="@color/colorSeekBarPro100"
                        android:startColor="@color/colorSeekBarPro0" />
                </shape>
            </clip>
        </item>
        
    </layer-list>

    icon_seek_block_25

    今天多一点积累,明天少一分烦恼
  • 相关阅读:
    2019年春季学期第三周作业
    2019春第二周作业+一些的挑战作业
    查找整数
    寒假作业3编辑总结
    寒假作业2编辑总结
    对自己影响最大的老师
    2019春第九周作业
    2019春第八周作业
    2019春第七周作业
    2019春第六周作业
  • 原文地址:https://www.cnblogs.com/galibujianbusana/p/7066168.html
Copyright © 2011-2022 走看看