184
Android 自定義SeekBar樣式
Android係統自帶的SeekBar的樣式比較單一，而且不同品牌手機被定製了之後樣式也不一樣，為了SeekBar的樣式和應用的風格統一，就需要自定義SeekBar的樣式，先看效果圖：
<SeekBar
android:layout_width=”192dip”
android:layout_height=”wrap_content”
android:progressDrawable=”@drawable/seekbar_style”
android:thumb=”@drawable/thumb_bg”
android:id=”@+id/seekWeight”
android:max=”70″
android:paddingLeft=”17dip”
android:paddingRight=”17dip”
/>
1.改變按鈕的樣式。
這個很簡單，直接則layout文件裏指定android:thumb屬性即可，如上麵紅色字體，需要注意的是SeekBar的寬的左右的padding一定要指定。
2.改變長條的顏色。
這裏隻需指定android:progressDrawable屬性即可，下麵是seekbar_style文件，放在drawable文件夾下。
<?xml version=”1.0″ encoding=”utf-8″?>
<layer-list xmlns:android=”https://schemas.android.com/apk/res/android”>
<item android:id=”@android:id/background”>
<shape>
<corners android:radius=”10dip” />
<gradient
android:startColor=”#d4d4d4″
android:centerColor=”#ffffff”
android:endColor=”#ffffff”
android:centerY=”0.45″
android:angle=”270″/>
</shape>
</item>
<item android:id=”@android:id/progress”>
<clip>
<shape>
<corners android:radius=”10dip” />
<gradient
android:startColor=”#ffd202″
android:centerColor=”#ffc004″
android:endColor=”#fbc600″
android:centerY=”0.45″
android:angle=”270″/>
</shape>
</clip>
</item>
</layer-list>
紅色的<item android:id=”@android:id/background”>指定了SeekBar背景的顏色。android:startColor，android:centerColor，android:endColor分別指定了開始，中間，結尾的顏色，使SeekBar有了立體的效果。綠色的<item android:id=”@android:id/progress”>指定了SeekBar滾過的部分的顏色。
3.SeekBar上麵動態變化的彈出框顯示當前值。
原理是在SeekBar上麵方一個TextView，在SeekBar的監聽OnSeekBarChangeListener裏動態改變TextView的layoutParams的leftMargin屬性。
layout：
<LinearLayout
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:orientation=”vertical”
>
<TextView
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:background=”@drawable/bg_seektv”
android:textColor=”#000000″
android:textStyle=”bold”
android:id=”@+id/tvWeight”
android:gravity=”center”
android:layout_marginLeft=”7dip”
/>
<SeekBar
android:layout_width=”192dip”
android:layout_height=”wrap_content”
android:progressDrawable=”@drawable/seekbar_style”
android:thumb=”@drawable/thumb_bg”
android:id=”@+id/seekWeight”
android:max=”70″
android:paddingLeft=”17dip”
android:paddingRight=”17dip”
/>
</LinearLayout>
代碼：
seekStrength.setOnSeekBarChangeListener(mSeekChange);
private OnSeekBarChangeListener mSeekChange = new OnSeekBarChangeListener() {
@Override
public void onStopTrackingTouch(SeekBar seekBar) {
// TODO Auto-generated method stub
}
@Override
public void onStartTrackingTouch(SeekBar seekBar) {
// TODO Auto-generated method stub
}
@Override
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
// TODO Auto-generated method stub
int iStrength = seekBar.getProgress() + 1;
LinearLayout.LayoutParams paramsStrength = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT,LinearLayout.LayoutParams.WRAP_CONTENT);
paramsStrength.leftMargin = (int) ((iStrength-1)*5*fDensity+7*fDensity);
tvStrength.setLayoutParams(paramsStrength);
}
}
具體數值需要根據情況調整，大致思路就是這樣。
最後更新：2017-04-03 08:26:11