免费注册 查看新帖 |

Chinaunix

  平台 论坛 博客 文库
最近访问板块 发新帖
查看: 2311 | 回复: 2
打印 上一主题 下一主题

[Android] Android绘制电池电量图标 [复制链接]

论坛徽章:
0
跳转到指定楼层
1 [收藏(0)] [报告]
发表于 2015-07-28 10:33 |只看该作者 |倒序浏览
代码
  1. public class PowerIconView extends View {
  2.     private int borderColor = 0xffc0c0c0;
  3.     private int fillColor = 0xffdedede;
  4.     private int selectColor = 0xff12b657;
  5.     private int selectAlertColor = 0xffe04d4d;
  6.      
  7.     private float width;
  8.     private float height;
  9.     private float borderWidth = 2;
  10.     private float corner;
  11.     private float headerWidth;
  12.      
  13.     private float value = 0;
  14.      
  15.     public PowerIconView(Context context) {
  16.         super(context);
  17.     }
  18.     public PowerIconView(Context context, AttributeSet attrs) {
  19.         super(context, attrs);
  20.     }
  21.      
  22.     public void setValue(float value){
  23.         this.value = value;
  24.         this.invalidate();
  25.     }
  26.      
  27.     public void onDraw(Canvas canvas) {
  28.         width = getWidth();
  29.         height = getHeight();
  30.         headerWidth = width / 7;
  31.         corner = height / 5;
  32.         drawBackGround(canvas);
  33.         if (value > 0){
  34.             drawSelectView(canvas);
  35.         }
  36.     }
  37.     /**
  38.      * 绘制背景
  39.      * @param canvas
  40.      */
  41.     private void drawBackGround(Canvas canvas) {
  42.         Paint paint = new Paint();
  43.         paint.setStrokeWidth(1);
  44.         paint.setAntiAlias(true);
  45.         paint.setColor(fillColor);
  46.         paint.setStyle(Paint.Style.FILL);
  47.          
  48.         Path path = new Path();
  49.         path.moveTo(0, corner);
  50.         path.quadTo(0, 0, corner, 0);
  51.         path.lineTo(width - headerWidth - corner, 0);
  52.         path.quadTo(width - headerWidth, 0, width - headerWidth, corner);
  53.         path.lineTo(width - headerWidth, height / 4);
  54.         path.lineTo(width - corner / 2, height / 4);
  55.         path.quadTo(width, height / 4, width, height / 4 + corner / 2);
  56.         path.lineTo(width, height / 4 * 2 - corner / 2);
  57.         path.quadTo(width, height / 4 * 3, width - corner / 2, height / 4 * 3);
  58.         path.lineTo(width - headerWidth, height / 4 * 3);
  59.         path.lineTo(width - headerWidth, height - corner);
  60.         path.quadTo(width - headerWidth, height, width - headerWidth - corner, height);
  61.         path.lineTo(corner, height);
  62.         path.quadTo(0, height, 0, height - corner);
  63.         path.lineTo(0, corner);
  64.         path.close();
  65.         canvas.drawPath(path, paint);
  66.          
  67.         paint.setColor(borderColor);
  68.         paint.setStrokeWidth(borderWidth);
  69.         paint.setStyle(Paint.Style.STROKE);
  70.         canvas.drawPath(path, paint);
  71.     }
  72.     /**
  73.      * 绘制电量选中效果
  74.      * @param canvas
  75.      */
  76.     private void drawSelectView(Canvas canvas){
  77.         Paint paint = new Paint();
  78.         paint.setStrokeWidth(1);
  79.         paint.setAntiAlias(true);
  80.         paint.setColor(value <= 50 ? selectAlertColor : selectColor);
  81.         paint.setStyle(Paint.Style.FILL);
  82.         Path path = new Path();
  83.         path.moveTo(borderWidth, borderWidth + corner / 2);
  84.         path.quadTo(borderWidth, borderWidth, borderWidth + corner / 2, borderWidth);
  85.         float xTo = (value / 100.0f) * (width - 2 * borderWidth);
  86.         if (value >= 100){ //满电
  87.             path.lineTo(width - headerWidth - borderWidth - corner / 2, borderWidth);
  88.             path.quadTo(width - headerWidth - borderWidth, borderWidth, width - headerWidth - borderWidth, borderWidth + corner / 2);
  89.             path.lineTo(width - headerWidth - borderWidth, height / 4 + borderWidth);
  90.             path.lineTo(width - borderWidth, height / 4 + borderWidth);
  91.             path.lineTo(width - borderWidth, height / 4 * 3 - borderWidth);
  92.             path.lineTo(width - headerWidth - borderWidth, height / 4 * 3 - borderWidth);
  93.             path.lineTo(width - headerWidth - borderWidth, height - borderWidth - corner / 2);
  94.             path.quadTo(width - headerWidth - borderWidth, height - borderWidth, width - headerWidth - borderWidth - corner / 2, height - borderWidth);
  95.             path.lineTo(borderWidth + corner / 2, height - borderWidth);
  96.             path.quadTo(borderWidth, height - borderWidth, borderWidth, height - borderWidth - corner / 2);
  97.             path.lineTo(borderWidth, borderWidth + corner / 2);
  98.             path.close();
  99.         } else if (xTo < corner / 2){ //电量最低
  100.             path.lineTo(borderWidth + corner / 2, height -borderWidth);
  101.             path.quadTo(borderWidth, height - borderWidth, borderWidth, height -borderWidth - corner / 2);
  102.             path.lineTo(borderWidth, borderWidth + corner / 2);
  103.         } else if ((borderWidth + corner / 2 + xTo) > (width - headerWidth)){ //电量超出了右侧的正极图形处
  104.             path.lineTo(width - headerWidth - borderWidth - corner / 2, borderWidth);
  105.             path.quadTo(width - headerWidth - borderWidth, borderWidth, width - headerWidth - borderWidth, borderWidth + corner / 2);
  106.             path.lineTo(width - headerWidth - borderWidth, height / 4 + borderWidth);
  107.             path.lineTo(borderWidth + xTo, height / 4 + borderWidth);
  108.             path.lineTo(borderWidth + xTo, height / 4 * 3 - borderWidth);
  109.             path.lineTo(width - headerWidth - borderWidth, height / 4 * 3 - borderWidth);
  110.             path.lineTo(width - headerWidth - borderWidth, height - borderWidth - corner / 2);
  111.             path.quadTo(width - headerWidth - borderWidth, height - borderWidth, width - headerWidth - borderWidth - corner / 2, height - borderWidth);
  112.             path.lineTo(borderWidth + corner / 2, height - borderWidth);
  113.             path.quadTo(borderWidth, height - borderWidth, borderWidth, height - borderWidth - corner / 2);
  114.             path.lineTo(borderWidth, borderWidth + corner / 2);
  115.         } else { //电量只需要填充矩形区域
  116.             path.lineTo(borderWidth + xTo, borderWidth);
  117.             path.lineTo(borderWidth + xTo, height - borderWidth);
  118.             path.lineTo(borderWidth + corner / 2, height - borderWidth);
  119.             path.quadTo(borderWidth, height - borderWidth, borderWidth, height - borderWidth - corner / 2);
  120.             path.lineTo(borderWidth, borderWidth + corner / 2);
  121.         }
  122.         canvas.drawPath(path, paint);
  123.     }
  124. }
复制代码
代码
  1. 使用方式:
  2. <com.example.component.PowerIconView
  3.                         android:id="@+id/piv_power_icon"
  4.                         android:layout_width="24dip"
  5.                         android:layout_height="12dip"
  6.                         android:layout_marginRight="12dip"
  7.                         />
复制代码

论坛徽章:
80
20周年集字徽章-庆
日期:2020-10-28 14:09:1215-16赛季CBA联赛之北京
日期:2020-10-28 13:32:5315-16赛季CBA联赛之北控
日期:2020-10-28 13:32:4815-16赛季CBA联赛之天津
日期:2020-10-28 13:13:35黑曼巴
日期:2020-10-28 12:29:1520周年集字徽章-周	
日期:2020-10-31 15:10:0720周年集字徽章-20	
日期:2020-10-31 15:10:07ChinaUnix元老
日期:2015-09-29 11:56:3020周年集字徽章-年
日期:2020-10-28 14:14:56
2 [报告]
发表于 2015-08-06 14:51 |只看该作者
好东西      

论坛徽章:
59
2015七夕节徽章
日期:2015-08-24 11:17:25ChinaUnix专家徽章
日期:2015-07-20 09:19:30每周论坛发贴之星
日期:2015-07-20 09:19:42ChinaUnix元老
日期:2015-07-20 11:04:38荣誉版主
日期:2015-07-20 11:05:19巳蛇
日期:2015-07-20 11:05:26CU十二周年纪念徽章
日期:2015-07-20 11:05:27IT运维版块每日发帖之星
日期:2015-07-20 11:05:34操作系统版块每日发帖之星
日期:2015-07-20 11:05:36程序设计版块每日发帖之星
日期:2015-07-20 11:05:40数据库技术版块每日发帖之星
日期:2015-07-20 11:05:432015年辞旧岁徽章
日期:2015-07-20 11:05:44
3 [报告]
发表于 2015-08-11 15:33 |只看该作者
这个不错。我在我的应用中使用了。
您需要登录后才可以回帖 登录 | 注册

本版积分规则 发表回复

  

北京盛拓优讯信息技术有限公司. 版权所有 京ICP备16024965号-6 北京市公安局海淀分局网监中心备案编号:11010802020122 niuxiaotong@pcpop.com 17352615567
未成年举报专区
中国互联网协会会员  联系我们:huangweiwei@itpub.net
感谢所有关心和支持过ChinaUnix的朋友们 转载本站内容请注明原作者名及出处

清除 Cookies - ChinaUnix - Archiver - WAP - TOP