案例使用的图片如下:
1.在res/drawable目录下新增一个xml风格文件,seekbar_define_style.xml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
<? 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:drawable = "@drawable/hou" />
<!-- 中 -->
< item
android:id = "@android:id/progress"
android:drawable = "@drawable/qian" />
< item
android:id = "@android:id/secondaryProgress"
android:drawable = "@drawable/qian" />
</ layer-list >
|
2.在res/drawable下定义个seekbar_thumb.xml文件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
|
<? 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 = "true" android:drawable = "@drawable/ic_launcher" />
<!-- 普通无焦点状态 -拖动按钮--> < item android:state_focused = "false" android:state_pressed = "false" android:drawable = "@drawable/orbino_icon_pack_006" />
<!-- 有焦点状态--> < item android:state_focused = "true" android:state_pressed = "false" android:drawable = "@drawable/ios" />
<!-- 有焦点 --> < item android:state_focused = "true" android:drawable = "@drawable/ios" />
</ selector >
|
3.在res/layut下定义布局资源文件seekbar_define.xml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
|
<? xml version = "1.0" encoding = "utf-8" ?>
< ScrollView xmlns:android = "<a href=" http://schemas.android.com/apk/res/android" rel = "nofollow" >http://schemas.android.com/apk/res/android</ a >"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
< LinearLayout
android:layout_width = "fill_parent"
android:layout_height = "fill_parent"
android:orientation = "vertical"
>
< TextView
android:id = "@+id/seekbar_tetview_one"
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:text = "SeekBar自定义"
/>
< TextView
android:id = "@+id/seekbar_tetview_two"
android:layout_width = "wrap_content"
android:layout_height = "wrap_content"
android:text = "SeekBar拖动时信息提示"
/>
< SeekBar
android:layout_width = "321px"
android:layout_height = "wrap_content"
android:layout_centerInParent = "true"
android:maxHeight = "20px"
android:minHeight = "20px"
android:paddingLeft = "18px"
android:paddingRight = "18px"
android:max = "100"
android:progressDrawable = "@drawable/seekbar_define_style"
android:thumb = "@drawable/seekbar_thumb"
android:id = "@+id/seekBar" />
</ LinearLayout >
</ ScrollView >
|
4.定义java文件通过 引用布局文件:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
|
package com.test;
import android.R.integer;
import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.widget.SeekBar;
import android.widget.SeekBar.OnSeekBarChangeListener;
import android.widget.TextView;
public class SeekBarDemo_DefineDemo extends Activity {
private SeekBar seekBar;
private TextView textView_one, textView_two;
@Override
protected void onCreate(Bundle savedInstanceState) {
super .onCreate(savedInstanceState);
setContentView(R.layout.seekbar_define);
seekBar = (SeekBar) findViewById(R.id.seekBar);
textView_one = (TextView) findViewById(R.id.seekbar_tetview_one);
textView_two = (TextView) findViewById(R.id.seekbar_tetview_two);
seekBar.setOnSeekBarChangeListener(seekbarChangeListener);
}
private OnSeekBarChangeListener seekbarChangeListener = new OnSeekBarChangeListener() {
// 停止拖动时执行
@Override
public void onStopTrackingTouch(SeekBar seekBar) {
// TODO Auto-generated method stub
textView_two.setText( "停止拖动了!" );
}
// 在进度开始改变时执行
@Override
public void onStartTrackingTouch(SeekBar seekBar) {
// TODO Auto-generated method stub
textView_two.setText( "进度开始改变" );
}
// 当进度发生改变时执行
@Override
public void onProgressChanged(SeekBar seekBar, int progress,
boolean fromUser) {
textView_two.setText( "正在进行拖动操作,还没有停下来一直再拖动" );
Message message = new Message();
Bundle bundle = new Bundle(); // 存放数据
float pro = seekBar.getProgress();
float num = seekBar.getMax();
float result = (pro / num) * 100 ;
bundle.putFloat( "key" , result);
message.setData(bundle);
message.what = 0 ;
handler.sendMessage(message);
}
};
/**
* 用Handler来更新UI
*/
private Handler handler = new Handler() {
@Override
public void handleMessage(Message msg) {
textView_one.setText( "当前拖动位置占 : "
+ msg.getData().getFloat( "key" ) + "/100" );
}
};
} |
最后执行效果:
二:使用颜色显示,和尚面是一样的,只有我们定义颜色资源来替代图片资源文件seekbar_define_color_style.xml:如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
|
<? 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:paddingTop = "3px"
android:paddingBottom = "3px" >
< shape >
< corners android:radius = "10dip" />
< gradient android:startColor = "#ffffffff" android:centerColor = "#ff000000" android:endColor = "#ff808A87" android:centerY = "0.45" android:angle = "270" />
</ shape >
</ item >
< item android:id = "@android:id/progress"
android:paddingTop = "3px"
android:paddingBottom = "3px" >
< clip >
< shape >
< corners android:radius = "10dip" />
< gradient android:startColor = "#ffffffff" android:centerColor = "#ffFFFF00" android:endColor = "#ffAABD00" android:centerY = "0.45" android:angle = "270" />
</ shape >
</ clip >
</ item >
</ layer-list >
|
之后再SeekBar标签使用如下属性进行引入:其他保持不变
1
|
android:progressDrawable="@drawable/seekbar_define_color_style" |
执行效果:
由于SeekBar的属性thumb引入了自定义的seekbar_thumb.xml文件,拖动图标是我们自定义的图片:除去这个属性
1
|
android:thumb="@drawable/seekbar_thumb" |
就回复系统默认状态效果最后效果如下:
我们可以通过颜色值再次休息seekbar_thumb.xml文件,使拖动按钮设置成自定义颜色: