Android學習筆記--如何修改SeekBar的樣式

自定義SeekBar樣式

谷歌是怎麼定義的?

    <SeekBar 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content"
        style="@android:style/Widget.SeekBar"/>

谷歌定義的SeekBar的樣式全在@android:style/Widget.SeekBar中,通過樣式可以觀察發現谷歌是如何定義SeekBar的。可以通過修改樣式,覆蓋原來樣式,從而達到我們需要的效果。

    <style name="Widget.SeekBar">
        <item name="indeterminateOnly">false</item>
        <!--progressDrawable定義了背景圖,進度圖,和緩衝圖-->
        <item name="progressDrawable">@drawable/progress_horizontal</item>
        <item name="indeterminateDrawable">@drawable/progress_horizontal</item>
        <item name="minHeight">20dip</item>
        <item name="maxHeight">20dip</item>
        <!--thumb定義了滑塊的圖片-->
        <item name="thumb">@drawable/seek_thumb</item>
        <item name="thumbOffset">8dip</item>
        <item name="focusable">true</item>
        <item name="mirrorForRtl">true</item>
    </style>

如果想改變SeekBar的背景圖,進度圖,和緩存圖等,我們可以自定義progressDrawable,例如
progress_horizotal.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!--這是SeekBar的背景圖-->
    <item android:id="@android:id/background" android:drawable="@drawable/seekbar_background">
    </item>
    <!-- 這是緩存進度圖-->
    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape>
                <corners android:radius="5dip" />
                <gradient
                        android:startColor="#80ffd300"
                        android:centerColor="#80ffb600"
                        android:centerY="0.75"
                        android:endColor="#a0ffcb00"
                        android:angle="270"
                />
            </shape>
        </clip>
    </item>
    <!--這是SeekBar的進度圖-->
    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <corners android:radius="5dip" />
                <solid android:color="@color/blue"/>
            </shape>
        </clip>
    </item>

</layer-list>

然後在定義SeekBar的時候可以這樣使用:

   <SeekBar
                style="@android:style/Widget.SeekBar"
                <!--覆蓋原來進度的樣式-->               android:progressDrawable="@drawable/progress_horizotal"
                <!--覆蓋滑塊的樣式-->  
                android:thumb="@drawable/seekbar_thumb"
                android:minHeight="3dp"
                android:maxHeight="3dp"
                android:max="100"
                android:progress="50"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:layout_marginLeft="4dp"
                android:layout_marginRight="4dp"/>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章