如何自定义seekBar的样式?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何自定义seekBar的样式?相关的知识,希望对你有一定的参考价值。

所谓的自定义,不是从android提供的样式中选一个,是完完全全的自己定义进度条的边框粗细,边框颜色,填充颜色,滑块的形状,颜色等等。更进一步的,问问该如何自定义系统栏里面电池、信号、通知等等的图标和布局?这个问题是好奇,主要还是问第一个问题。拜谢

需求:
下载中的颜色要自定义,要替换为另外的一个颜色 方法:
就是在 在drawable中新建一个progressBar_style.xml文件, 这个属性进行设置,
有两个方案:
第一,设置两张图片:
第二种,设置背景颜色:
其中的属性还要进一步研究具体作用
参考技术A 好吧 我已经差不多明白了 可是还有一堆属性不知道啥意思,求解 这五条都是啥意思...测试了好几个数据后依然一头雾水.... 参考技术B 请问楼主,怎么把seekbar设置成半圆型的。如何自定义啊。。。。。。等候楼主答复 参考技术C   SeekBar的默认样式:
  style="@android:style/Widget.SeekBar"
  自定义方法如下:
  <style name="Widget.SeekBar">
  <item name="android:indeterminateOnly">false</item>
  <item name="android:progressDrawable">@android:drawable/progress_horizontal</item>
  <item name="android:indeterminateDrawable">@android:drawable/progress_horizontal</item>
  <item name="android:minHeight">20dip</item>
  <item name="android:maxHeight">20dip</item>
  <item name="android:thumb">@android:drawable/seek_thumb</item>
  <item name="android:thumbOffset">8dip</item>
  <item name="android:focusable">true</item>
  </style>
  这里最重要的几个属性:
  android:progressDrawable:背景,进度条,次进度条的设置。
  android:indeterminateDrawable:背景,进度条,次进度条的设置【进度不确定】。
  android:thumb:拖拽的图标。
参考技术D seekBar啊seekBar,郁闷死我了.....求大牛啊...

转 为SeekBar滑块设置固定值以及自定义Seekbar,progressbar样式--不错

原文网址:http://blog.csdn.net/jdsjlzx/article/details/7804080

最近在项目中使用到了seekbar和progressbar,且必须按照设计要求来进行设置,如下图。要实现这个效果就必须对这两个控件进行自定义。
 
 一,SeekBar
  
   一开始要实现这个效果参考网上的自定义方法根本无法达到这个效果,没办法只能投机取巧了。

 1,背景刻度的图片我是用了一个ImageView,然后在ImageView上放一个SeekBar。因为是个定制的平板应用,分辨率是限定的1280*768,所以我使用的是AbsoluteLayout这样ImageView和SeekBar的位置和大小都是固定的了,估计在其他布局中这样使用会有问题。

2,在布局文件中的代码如下:

[html] view plaincopy
 
  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" //刻度图片  
  7.     android:scaleType="centerCrop"  
  8.     android:background="@null"  
  9.     />  
  10.       
  11.    <SeekBar  
  12.     android:id="@+id/sensor_sensitivity"  
  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"  //注意:一定得设置进度条的高度,不然进度条会很高。  
  24.     android:minHeight="1dip"  
  25.         android:max="100"  
  26. android:progress="0"          
  27.    />  
[html] view plain copy
 
  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" //刻度图片  
  7.     android:scaleType="centerCrop"  
  8.     android:background="@null"  
  9.     />  
  10.       
  11.    <SeekBar  
  12.     android:id="@+id/sensor_sensitivity"  
  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"  //注意:一定得设置进度条的高度,不然进度条会很高。  
  24.     android:minHeight="1dip"  
  25.         android:max="100"  
  26. android:progress="0"          
  27.    />  


 3,自定义滑块,在drawable文件中加入自定义的xml文件。

[html] view plaincopy
 
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <selector xmlns:android="http://schemas.android.com/apk/res/android">         
  3.     <!-- 按下状态 -->      
  4.     <item         
  5.         android:state_pressed="true"         
  6.         android:drawable="@drawable/seekbar_block" />        
  7.                   
  8.     <!-- 普通无焦点状态 -->      
  9.     <item         
  10.         android:state_focused="false"         
  11.         android:state_pressed="false"       
  12.         android:drawable="@drawable/seekbar_block" />     
  13.     
  14. </selector>   
[html] view plain copy
 
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <selector xmlns:android="http://schemas.android.com/apk/res/android">         
  3.     <!-- 按下状态 -->      
  4.     <item         
  5.         android:state_pressed="true"         
  6.         android:drawable="@drawable/seekbar_block" />        
  7.                   
  8.     <!-- 普通无焦点状态 -->      
  9.     <item         
  10.         android:state_focused="false"         
  11.         android:state_pressed="false"       
  12.         android:drawable="@drawable/seekbar_block" />     
  13.     
  14. </selector>   


4,自定义进度条的颜色,同样在drawable中加入自定义需要的xml文件。

 

[html] view plaincopy
 
  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>  
[html] view plain copy
 
  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>  


5,设置滑块的位置,也就是当滑动滑块后只能让其停在刻度上,要现实这个效果我采用的方法是当滑块停止的时候判断当前的值,比如第二个刻度是25,这里在0到25中去个中间数比如13,也就是当滑块滑到大于13小于25到50的中间数时就setProgress(25),这样就设定在25的位置也就是第二个刻度位置。后面的以此类推。seekbar的事件中有个OnStopTrackingTouch,代码如下:

[java] view plaincopy
 
  1. public void onStopTrackingTouch(SeekBar 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.     }  
[java] view plain copy
 
  1. public void onStopTrackingTouch(SeekBar 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.     }  

 

对于ProgressBar的设置同样是采用一个ImageView为背景(外围的黑框),在ImageView上放一个ProgressBar控件,然后自定义进度条的颜色。只是在调整它们之间的位置和大小的时候比较费时点,不管怎样已经达到了想要的效果。

技术分享

 

技术分享

以上是关于如何自定义seekBar的样式?的主要内容,如果未能解决你的问题,请参考以下文章

转 为SeekBar滑块设置固定值以及自定义Seekbar,progressbar样式--不错

自定义垂直拖动的seekbar进度条

Android 仿vivo的SeekBar样式

android关于自定义seekbar控件的问题(将横向seekbar改成竖向seekbar)

Android 自定义 SeekBar

自定义seekbar详解