UI

2019-01-21 Android UI之SeekBar实际开

2019-01-21  本文已影响0人  flynnny

本文结合网上资料和实际用到的功能,对Android SeekBar 做一点总结。其中重点是水平的进度条

SeekBar 基本属性

    android:max:设置进度的最大值。
    android:progress:设置当前第一进度值。
    android:secondaryProgress:设置当前第二进度值。
    android:visibility:设置是否显示,默认显示。

与setProgress(int)和incrementProgressBy(int)对应的还有setSecondaryProgress(int)和incrementSecondaryProgressBy(int)方法,用于设置第二进度值。

SeekBar 实际开发中会用到的属性

1、有时候thunb不居中,就是下面的高度没调好,当然也可以在thumb的文件中调整具体高度,不过最开始写的时候,高度最好要和图片的高度相符。

android:adjustViewBounds="true"
android:maxHeight="XXdp"
android:maxWidth="XXdp"
android:minHeight="XXdp"
android:minWidth="XXdp"

设置最大(最小)高度(宽度)时,需要同时设置android:adjustViewBounds="true"才会生效。

2、设置左右边距(seekbar默认有空隙)

android:paddingStart="0dp"
android:paddingEnd="0dp"

3、thumb左右显示不全

android:thumbOffset="0dp"//不设置这个属性的话,你的圆点在最左边的时候是会显示不全的。

4、通过android:progressDrawable="@drawable/XXX"设置美观的seekbar(提供一个demo )下面的demo实现了进度条的颜色渐变

<?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="#e6e6e6" />
            <corners android:radius="3dp" />
        </shape>
    </item>
    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape>
                <!--<solid android:color="#30a6ff" />-->
                <corners android:radius="3dp" />
                <gradient
                    android:angle="0"
                    android:centerY="0.35"
                    android:centerColor="#af74fd"
                    android:startColor="#b37cfc"
                    android:endColor="#903dfc" />
            </shape>
        </clip>
    </item>
    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <gradient
                    android:angle="0"

                    android:centerY="0.5"
                    android:startColor="#b37cfc"
                    android:endColor="#903dfc" />  />
                <!--<solid android:color="#30a6ff" />-->
                <corners android:radius="3dp" />
            </shape>
        </clip>
    </item>
</layer-list>

5、android:thumb="@drawable/XXX"实现自定义的thumb(提供一个demo)

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <corners android:radius="6dp"/>
    <size
        android:width="12dp"
        android:height="12dp"
        />
    <solid android:color="#9e7aff"/>
</shape>
上一篇 下一篇

猜你喜欢

热点阅读