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

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

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

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

  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. <SeekBar
  11. android:id="@+id/sensor_sensitivity"
  12. android:layout_width="360dip"
  13. android:layout_height="64dip"
  14. android:layout_x="850dip"
  15. android:layout_y="498dip"
  16. android:progressDrawable="@drawable/suretouch_seekbar_img"
  17. android:thumb="@drawable/suretouch_seekbar_thumb"
  18. style="?android:attr/progressBarStyleHorizontal"
  19. android:paddingLeft="5dip"
  20. android:paddingRight="5dip"
  21. android:paddingBottom="2dip"
  22. android:maxHeight="1dip"  //注意:一定得设置进度条的高度,不然进度条会很高。
  23. android:minHeight="1dip"
  24. android:max="100"
  25. android:progress="0"
  26. />
  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. <SeekBar
  11. android:id="@+id/sensor_sensitivity"
  12. android:layout_width="360dip"
  13. android:layout_height="64dip"
  14. android:layout_x="850dip"
  15. android:layout_y="498dip"
  16. android:progressDrawable="@drawable/suretouch_seekbar_img"
  17. android:thumb="@drawable/suretouch_seekbar_thumb"
  18. style="?android:attr/progressBarStyleHorizontal"
  19. android:paddingLeft="5dip"
  20. android:paddingRight="5dip"
  21. android:paddingBottom="2dip"
  22. android:maxHeight="1dip"  //注意:一定得设置进度条的高度,不然进度条会很高。
  23. android:minHeight="1dip"
  24. android:max="100"
  25. android:progress="0"
  26. />

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

  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. <item
  9. android:state_focused="false"
  10. android:state_pressed="false"
  11. android:drawable="@drawable/seekbar_block" />
  12. </selector>
  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. <item
  9. android:state_focused="false"
  10. android:state_pressed="false"
  11. android:drawable="@drawable/seekbar_block" />
  12. </selector>

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

  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>
  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,代码如下:

  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. }
  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,progressbar样式--不错的更多相关文章

  1. Android课程---Android 如何用滑杆(SeekBar)组件设置图片颜色的透明度(转)

    Android系统支持的颜色是由4个值组成的,前3个为RGB,也就是我们常说的三原色(红.绿.蓝),最后一个值是A,也就是Alpha.这4个值都在0~255之间.颜色值越小,表示该颜色越淡,颜色值越大 ...

  2. MTU介绍以及在windows和linux下怎么设置MTU值

    最大传输单元MTU(Maximum Transmission Unit,MTU)是指一种通信协议的某一层上面所能通过的最大数据包大小(以字节为单位).最大传输单元这个参数通常与通信接口有关(网络接口卡 ...

  3. Android 设置alpha值来制作透明与渐变效果的实例

    Android系统支持的颜色是由4个值组成的,前3个为RGB,也就是我们常说的三原色(红.绿.蓝),最后一个值是A,也就是Alpha.这4个值都在0~255之间.颜色值越小,表示该颜色越淡,颜色值越大 ...

  4. Format a Property Value 设置属性值的格式

    In this lesson, you will learn how to set a display format and an edit mask to a business class prop ...

  5. el-cascader组件根据最后一级向上找到父级并设置默认值

    vue + elementUI项目中,el-cascader级联选择器使用频率非常高,一些基本使用方法可以参考elementUI官方文档,本文主要研究当接口只返回最后一级id时,如何向上找出所有父级数 ...

  6. ng-option指令使用记录,设置默认值需要注意

    ng-options一般有以下用法: 数组作为数据源: label for value in array select as label for value in array label group ...

  7. 《Entity Framework 6 Recipes》中文翻译系列 (14) -----第三章 查询之查询中设置默认值和存储过程返回多结果集

    翻译的初衷以及为什么选择<Entity Framework 6 Recipes>来学习,请看本系列开篇 3-6在查询中设置默认值 问题 你有这样一个用例,当查询返回null值时,给相应属性 ...

  8. EF Core1.0 CodeFirst为Modell设置默认值!

    当我们使用CodeFirst时,有时候需要设置默认值! 如下 ; public string AdminName {get; set;} = "admin"; public boo ...

  9. 使用mysql 命令行,增加 ,删除 字段 并 设置默认值 及 非空

    使用mysql 命令行,增加 ,删除 字段 并 设置默认值 及 非空 添加 alter table table_name add field_name field_type; 添加,并设置默认值,及非 ...

随机推荐

  1. Struts2 OGNL调用公共静态方法

    在实现一个功能的时候用到了Struts2的OGNL 调用后台的静态方法,弄了半天没有出来结果,原来是自己没有在Struts的配置文件里面申明可以在前台使用后台的静态方法 <constant na ...

  2. Objective-C:KVC

    1 概述 1.1 访问方法 Key-value coding(KVC)是一种间接访问对象属性的机制,类似键值对,通过名字(或键)可以直接获得对象的属性值.事实上,key-value coding定义了 ...

  3. poj 1849 Two

    /*poj 1849 two 思考一下会发现 就是求直径 直径上的中点就是两个人分开的地方(不再有交集)*/ #include<cstdio> #define maxn 100010 us ...

  4. 处理ASP.NET 请求(IIS)(2)

    ASP.NET与IIS是紧密联系的,由于IIS6.0与IIS7.0的工作方式的不同,导致ASP.NET的工作原理也发生了相应的变化. IIS6(IIS7的经典模式)与IIS7的集成模式的不同 IIS6 ...

  5. gridview实现表格编辑功能

    .net开发者对gridview应该非常熟悉,数据展现.数据编辑.数据删除,这些gridview都能很好的完成.最近在做东西的时候遇到 这样的一个需求,就是利用gridview实现类似Excel一样直 ...

  6. 编程基础-msdn编程指南笔记

    此博仅为笔记,摘自msdn编程指南文档,链接地址:http://msdn.microsoft.com/zh-cn/library/67ef8sbd.aspx 注释:// 单行注释 /* 多行注释*/ ...

  7. 什么是html,什么是php

    学了这么长时间的网站建设,好像对这两个概念说以来还是语无伦次的,所以就来写一写了.html是什么呢,官方解释:超文本标记语言,超文本就是指页面可以包含图片,连接等非文字元素.超文本标记语言也是一种规范 ...

  8. ASP.NET MVC5框架揭秘 学习笔记01

    1.自治视图 在早期(作者也没说明是多早,自己猜吧),我们倾向于将所有与UI相关的操作糅合在一起(现在我身边还有很多人这样做),这些操作包括UI界面的呈现. 用户交互操作的捕捉与响应(UI处理逻辑). ...

  9. js实现图片自动切换效果。

    js实现图片自动切换效果,简单实用,原谅我只是一只小菜鸟还在学大神天天写博文装逼. <script language="javascript"> setInterval ...

  10. WPF 媒体播放器(MediaElement)使用实例(转)

    在WPF 中可以使用MediaElement 为应用程序添加媒体播放控件,以完成播放音频.视频功能.由于MediaElement 属于UIElement,所以它同时也支持鼠标及键盘的操作.本篇将使用M ...