[Android初級]自定義SeekBar樣式(簡單說明)

    關於Android的組件SeekBar的使用,其實各個網上的用法也都一樣,這裏也是差不多的用法,但你看到我的博文,自然也要說清楚怎麼個用法啦,接下來,看代碼。


一 . 如上圖。我們先創建佈局,添加組件和他的背景等屬性,主要看

android:progressDrawable="@drawable/po_seekbar"
<pre name="code" class="html">android:thumb="@drawable/seekbar_thumb"


<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:paddingTop="10dp" >

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="自定義樣式的SeekBar" />

    <SeekBar
        android:id="@+id/my_seekbar"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:focusable="true"
        android:maxHeight="8dp"
        android:paddingLeft="16dp"
        android:paddingRight="16dp"
        android:progress="50"
        android:progressDrawable="@drawable/po_seekbar"
        android:secondaryProgress="50"
        android:thumb="@drawable/seekbar_thumb" />

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="系統自帶的樣式" />

    <SeekBar
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" />

    <ProgressBar
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" />

</LinearLayout>

二. 配置拖動條的背景色、進度條的填充色等,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="#868F7E" />
        </shape>
    </item>
    <!-- 第二進度條的背景色 -->
    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape android:shape="rectangle" >
                <solid android:color="#98E3D9" />
            </shape>
        </clip>
    </item>
     <!-- <item android:id="@+android:id/background" android:drawable="@drawable/bar_dn" /> -->
    <!-- 可拖動的進度條顏色 -->
    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <solid android:color="#3DCCB4" />
            </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:state_focused="true" android:state_pressed="false" android:drawable="@drawable/seekbar_thumb_normal" />
    <item android:state_focused="true" android:state_pressed="true" android:drawable="@drawable/seekbar_thumb_pressed" />
    <item android:state_focused="false" android:state_pressed="true" android:drawable="@drawable/seekbar_thumb_pressed" />
    <item android:drawable="@drawable/seekbar_thumb_normal" />
</selector>
四、java代碼使用方式如下

private SeekBar mSeekBar;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		mSeekBar = (SeekBar) findViewById(R.id.my_seekbar);
		mSeekBar.setOnSeekBarChangeListener(new OnSeekBarChangeListener() {
			//當開始被拖動的時候調用
			@Override
			public void onStopTrackingTouch(SeekBar seekBar) {
			}
			//當結束拖動的時候調用
			@Override
			public void onStartTrackingTouch(SeekBar seekBar) {
			}
			//當進度改變的時候調用
			@Override
			public void onProgressChanged(SeekBar seekBar, int progress,
					boolean fromUser) {
				Log.i(TAG, "onProgressChanged->fromUser="+fromUser+",progress="+progress);
				seekBar.setSecondaryProgress(progress);//設置第二進度條的值
			}
		});
	}

最後,爲了方便留個demo下載連接,點擊如意門

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章