六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 116|回复: 0

Android统计图例子

[复制链接]

升级  44%

36

主题

36

主题

36

主题

秀才

Rank: 2

积分
116
 楼主| 发表于 2012-12-10 14:32:49 | 显示全部楼层 |阅读模式
Android统计图例子

<div id="cnblogs_post_body">今天为统计图写了一个小例子,希望对有的朋友有帮助。

效果图:

原理挺简单,用画布实现。
做得比较简单,可以根据实际需要自己做一些相应的更改,里面有注释。
主要代码
控件类 StatisticsOneView.java
<div class="cnblogs_code" >View Code <div id="cnblogs_code_open_acf5ea77-c1d2-4a0e-8304-10c057318280" class="cnblogs_code_hide">  1 package com.harlan.statistics.view;  2   3 import android.content.Context;  4 import android.graphics.Canvas;  5 import android.graphics.Color;  6 import android.graphics.Paint;  7 import android.view.View;  8   9 10 /** 11 * 统计图实例(注:其中有部分值没有实际意义,只是为了达到更好的展示效果,有需要有可以做适当修改) 12 * @author Harlan Song 13 * @weibo: weibo.com/markdev 14 * 2012-8-29 15  */ 16 public class StatisticsOneView extends View { 17     private int xPoint = 0;// 原点X坐标 18     private int yPoint = 0;// 原点Y坐标 19     private int xLengh = 240;// X轴长度 20     private int yLengh = 320;// Y轴长度 21     private int xScale = 5;// X轴一个刻度长度 22     private int yScale = 5;// Y轴一个刻度长度 23     private int widthBorder = 40;// 内边缘宽度,为了统计图不靠在屏幕的边缘上,向边缘缩进距离。最好大于30。 24     private String[] xLableArray;// X轴标签 25     private int[] yLableArray;// Y轴标签 26     private int[] dataArray;// 画折线的数值 27 28     public StatisticsOneView(Context context) { 29         super(context); 30 31     } 32 33     /** 34      * 实例化值 35      * @param screenWidth     手机屏幕宽度 36      * @param ScreenHeight  手机屏幕高度 37      * @param xLable        X轴标签 38      * @param yLable        Y轴标签 39      * @param dataArray     统计数据 40      */ 41     public void initValue(int screenWidth, int ScreenHeight, String[] xLable, 42             int[] yLable, int[] dataArray) { 43         // 38 是手机状态栏的大概高度,这是i9100上测试的,如果应用有标题栏需要在这个基础上加,差不多两倍吧。 44         xPoint += widthBorder; 45         yPoint = ScreenHeight - widthBorder - 38; 46         xLengh = screenWidth - widthBorder * 2; 47         yLengh = ScreenHeight - widthBorder * 2 - 38; 48         xScale = getScale(xLable.length - 1, xLengh); 49         yScale = getScale(yLable.length - 1, yLengh); 50         xLableArray = xLable; 51         yLableArray = yLable; 52         this.dataArray = dataArray; 53     } 54 55     @Override 56     protected void onDraw(Canvas canvas) { 57         super.onDraw(canvas); 58 59         // 设置画笔 60         Paint paint = new Paint(); 61         paint.setStyle(Paint.Style.STROKE);// 设置画笔样式 62         paint.setAntiAlias(true);// 去锯齿 63         paint.setColor(Color.BLACK);// 设置颜色 64         paint.setTextSize(12);// 设置字体 65         // 画X轴轴线 66         canvas.drawLine(xPoint, yPoint, xPoint + xLengh, yPoint, paint); 67         // 画X轴箭头 68         canvas.drawLine(xPoint + xLengh - 6, yPoint - 3, xPoint + xLengh, 69                 yPoint, paint); 70         canvas.drawLine(xPoint + xLengh - 6, yPoint + 3, xPoint + xLengh, 71                 yPoint, paint); 72         // 画Y轴轴线 73         canvas.drawLine(xPoint, yPoint, xPoint, yPoint - yLengh, paint); 74         // 画Y轴箭头 75         canvas.drawLine(xPoint + 3, yPoint - yLengh + 6, xPoint, yPoint 76                 - yLengh, paint); 77         canvas.drawLine(xPoint - 3, yPoint - yLengh + 6, xPoint, yPoint 78                 - yLengh, paint); 79 80         for (int i = 0; xLableArray != null && i < xLableArray.length; i++) { 81             // 画X轴刻度 82             canvas.drawLine(xPoint + xScale * i, yPoint - 3, xPoint + xScale 83                     * i, yPoint, paint); 84             // 画X轴刻度标签 85             canvas.drawText(xLableArray, xPoint + xScale * i - 16, 86                     yPoint + 15, paint); 87          88             89             // 画折线 90             if (dataArray != null && dataArray.length > 0 91                     && i < dataArray.length) { 92                 int ydata = getYDataPoint(dataArray); 93                 if (ydata != 0) { 94                     canvas.drawCircle(xPoint + xScale * i,ydata, 2, paint); 95                     if(dataArray.length>i+1){ 96                         canvas.drawLine(xPoint + xScale * i,getYDataPoint(dataArray), xPoint + xScale * (i+1), getYDataPoint(dataArray[i+1]), paint); 97                     } 98                 } 99                 100                 101             }102             103 104         }105 106         for (int i = 0; yLableArray != null && i < yLableArray.length; i++) {107             // 画Y轴刻度108             canvas.drawLine(xPoint, yPoint - yScale * i, xPoint + 3, yPoint109                     - yScale * i, paint);110             // 画Y轴刻度标签111 112             canvas.drawText(String.valueOf(yLableArray), xPoint - 30, yPoint113                     - yScale * i + 3, paint);114         }115 116     }117 118     /**119      * 得到每一等分的长度120      * 121      * @param num122      *            所要分成的等份123      * @param length124      *            要分割的总长度125      * @return126      */127     private int getScale(int num, int length) {128         if (num > 0 && length > 0) {129             length -= 10;// 为了美观,缩进130             length = length - (length % num);131             return length / num;132         } else {133             return 0;134         }135 136     }137 138     /**139      * 得到点的Y坐标140      * @param data141      * @return142      */143     private int getYDataPoint(int data) {144         int y = 0;145         double yScale_db=(double)yScale;146         double pxSize = yScale_db/ yLableArray[1];147         int pxSize_int=(int)pxSize;148         int last=0;149         if((last=data%yLableArray[1])==0){150             y =yPoint-(data/yLableArray[1]*yScale);151         }else{152             y =yPoint-(data/yLableArray[1]*yScale)-pxSize_int*last;153         }154         return y;155     }156 157 }
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表