Set fixed values and custom seekbar and progressbar styles for the seekbar Slider

Recently, seekbar and progressbar have been used in the project and must be set according to the design requirements, as shown in. To achieve this effect, you must customize the two controls.
 
1. seekbar

In the first place, to achieve this effect, refer to the custom methods on the Internet. There is no way to achieve this effect.

1. I used an imageview FOR THE BACKGROUND scale image and placed a seekbar ON THE imageview. Because it is a customized tablet application, the resolution is limited to 1280*768, so I am using absolutelayout so that the position and size of imageview and seekbar are fixed, it is estimated that this may cause problems in other la S.

2. The code in the layout file is as follows:

[HTML]
View plaincopyprint?

1. <Imageview
2. Android: layout_width = "400dip"
3. Android: layout_height = "95dip"
4. Android: layout_x = "830dip"
5. Android: layout_y = "484dip"
6. Android: src = "@ drawable/seekbar_background_5" // scale image
7. Android: scaletype = "centercrop"
8. Android: Background = "@ null"
9. />
11. <Seekbar
12. Android: Id = "@ + ID/sensor_sensiti.pdf"
13. Android: layout_width = "360dip"
14. Android: layout_height = "64dip"
15. Android: layout_x = "850dip"
16. Android: layout_y = "498dip"
17. Android: progressdrawable = "@ drawable/suretouch_seekbar_img"
18. Android: thumb = "@ drawable/suretouch_seekbar_thumb"
19. Style = "? Android: ATTR/progressbarstylehorizontal"
20. Android: paddingleft = "5dip"
21. Android: paddingright = "5dip"
22. Android: paddingbottom = "2dip"
23. Android: maxheight = "1dip" // Note: You must set the height of the progress bar. Otherwise, the progress bar will be very high.
24. Android: minheight = "1dip"
25. Android: max = "100"
26. Android: Progress = "0"
27. />

<Imageview Android: layout_width = "400dip" Android: layout_height = "95dip" Android: layout_x = "830dip" Android: layout_y = "484dip" Android: src = "@ drawable/seekbar_background_5" // scale image Android: scaletype = "centercrop" Android: Background = "@ null"/> <seekbar Android: id = "@ + ID/sensor_sensiti.pdf" Android: layout_width = "360dip" Android: layout_height = "64dip" Android: layout_x = "850dip" Android: layout_y = "498dip" android : Progressdrawable = "@ drawable/suretouch_seekbar_img" Android: thumb = "@ drawable/suretouch_seekbar_thumb" style = "? Android: ATTR/progressbarstylehorizontal "Android: paddingleft =" 5dip "Android: paddingright =" 5dip "Android: paddingbottom =" 2dip "Android: maxheight =" 1dip "// note: you must set the height of the progress bar. Otherwise, the progress bar will be very high. Android: minheight = "1dip" Android: max = "100" Android: Progress = "0"/>

3. Customize the slider and add the custom XML file to the drawable file.

[HTML]
View plaincopyprint?

1. <? XML version = "1.0" encoding = "UTF-8"?>
2. <Selector xmlns: Android = "http://schemas.android.com/apk/res/android">
3. <! -- Press status -->
4. <Item
5. Android: state_pressed = "true"
6. Android: drawable = "@ drawable/seekbar_block"/>
8. <! -- Normal no-focus status -->
9. <Item
10. Android: state_focused = "false"
11. Android: state_pressed = "false"
12. Android: drawable = "@ drawable/seekbar_block"/>
14. </Selector>

<? XML version = "1.0" encoding = "UTF-8"?> <Selector xmlns: Android = "http://schemas.android.com/apk/res/android"> <! -- Press status --> <item Android: state_pressed = "true" Android: drawable = "@ drawable/seekbar_block"/> <! -- Normal no-focus status --> <item Android: state_focused = "false" Android: state_pressed = "false" Android: drawable = "@ drawable/seekbar_block"/> </selector>

4. The color of the custom progress bar. Add the required XML file to the drawable.

 

[HTML]
View plaincopyprint?

1. <? XML version = "1.0" encoding = "UTF-8"?>
2. <Layer-list
3. Xmlns: Android = "http://schemas.android.com/apk/res/android">
4. <Item Android: Id = "@ Android: ID/progress">
5. <Clip>
6. <Shape>
7. <Gradient
8. Android: startcolor = "@ color/big_title"
9. Android: centercolor = "@ color/big_title"
10. Android: endcolor = "@ color/big_title"
11. />
12. </Shape>
13. </Clip>
14. </Item>
15. </Layer-List>

<?xml version="1.0" encoding="UTF-8"?>     <layer-list  xmlns:android="http://schemas.android.com/apk/res/android">     <item android:id="@android:id/progress">           <clip>               <shape>                   <gradient                           android:startColor="@color/big_title"                           android:centerColor="@color/big_title"                           android:endColor="@color/big_title"                   />               </shape>           </clip>       </item>  </layer-list>

5. Set the slider position, that is, when you move the slider, you can only stop it on the scale. To realize this effect, I use the method to determine the current value when the slider stops, for example, the second scale is 25. Here, the numbers between 0 and 25 are 13, that is, when the slider slides to the center number greater than 13 and less than 25 to 50, setprogress (25) is set to 25, that is, the second scale position. And so on. The seekbar event has an onstoptrackingtouch. The Code is as follows:

[Java]
View plaincopyprint?

1. Public void onstoptrackingtouch (seekbar ){
2. // Todo auto-generated method stub
3. Int seekprogress = mseekbar. getprogress ();
4. If (seekprogress <13 ){
5. Mseekbar. setprogress (0 );
6. } Else if (seekprogress >=13 & seekprogress <38 ){
7. Mseekbar. setprogress (25 );
8. } Else if (seekprogress >=38 & seekprogress <63 ){
9. Mseekbar. setprogress (50 );
10. } Else if (seekprogress >=63 & seekprogress <88 ){
11. Mseekbar. setprogress (75 );
12. } Else if (seekprogress> = 88 ){
13. Mseekbar. setprogress (100 );
14. }
15. }

public void onStopTrackingTouch(SeekBar seekBar) {// TODO Auto-generated method stubint seekProgress = mSeekBar.getProgress();if(seekProgress<13){mSeekBar.setProgress(0);}else if(seekProgress>=13 && seekProgress<38){mSeekBar.setProgress(25);}else if(seekProgress>=38 && seekProgress<63){mSeekBar.setProgress(50);}else if(seekProgress>=63 && seekProgress<88){mSeekBar.setProgress(75);}else if(seekProgress>=88){mSeekBar.setProgress(100);}}

 

You can also set the progress bar to an imageview background (a black box on the periphery), place a progress bar control on the imageview, and then customize the color of the progress bar. It is only time-consuming to adjust the positions and sizes between them, regardless of how they have achieved the desired effect.