android 横向条形统计图,Android 横向条形统计图

Android 横向条形统计图

Android 横向条形统计图

先看下效果图↑↑

写作思路和网上各种统计图都是一样的。

废话少说上代码：

package com.ustcsoft.yzyx.zxjy.view;

import android.content.Context;

import android.graphics.Canvas;

import android.graphics.Paint;

import android.graphics.Path;

import android.graphics.Rect;

import android.util.AttributeSet;

import android.util.Log;

import android.view.View;

import com.ustcsoft.yzyx.zxjy.R;

import com.ustcsoft.yzyx.zxjy.utils.DensityUtil;

import java.util.List;

/**

* TODO 因为行高和间距都是固定的，所以当统计条数改变时，请在布局文件中设置好高度

* 水平进度条

* Created by cuihuihui on 2017/5/5.

*/

public class HorizontalChartView extends View {

/**

* 最大值

*/

private float maxValue ;

/**

* 统计项目

*/

private List barList;

/**

* 线的宽度

*/

private int lineStrokeWidth;

/**

* 统计条宽度

*/

private int barWidth;

/**

* 两条统计图之间空间

*/

private int barSpace;

/**

* 各画笔

*/

private Paint barPaint, linePaint, textPaint, scoreTextPaint;

/**

* 矩形区域

*/

private Rect barRect, topRect;

private Path textPath;

private int itemNameWidth;

private int scoreTextHeight;

/**

* 项目名和条形图之间的距离

*/

private int betweenMargin;

public HorizontalChartView(Context context, AttributeSet attrs) {

super(context, attrs);

init(context);

}

/**

* 初始化设置

*/

private void init(Context context) {

barPaint = new Paint();

barPaint.setColor(getResources().getColor(R.color.score_blue));

linePaint = new Paint();

linePaint.setColor(getResources().getColor(R.color.lineColor));

lineStrokeWidth = DensityUtil.dip2px(context, 0.5f);

linePaint.setStrokeWidth(lineStrokeWidth);

textPaint = new Paint();

textPaint.setColor(getResources().getColor(R.color.text_light_black));

textPaint.setTextSize(DensityUtil.dip2px(context, 13));

textPaint.setAntiAlias(true);

scoreTextPaint = new Paint();

scoreTextPaint.setTextSize(DensityUtil.dip2px(context, 13));

scoreTextPaint.setColor(getResources().getColor(R.color.white));

barRect = new Rect(0, 0, 0, 0);

textPath = new Path();

barWidth = DensityUtil.dip2px(context, 18);

barSpace = DensityUtil.dip2px(context, 20);

scoreTextHeight = DensityUtil.dip2px(context, 13);

itemNameWidth = DensityUtil.dip2px(context, 86);

betweenMargin = scoreTextHeight / 2;

}

// @Override

// protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

// super.onMeasure(widthMeasureSpec, heightMeasureSpec);

// int width = measureWidth(widthMeasureSpec);

// int height = measureHeight(heightMeasureSpec);

// //设置宽高

// setMeasuredDimension(width, height);

// }

@Override

protected void onDraw(Canvas canvas) {

super.onDraw(canvas);

float lineViewWidth = (float) ((this.getWidth() - itemNameWidth) * 0.8);//线的宽度占总宽度的0.8，剩余的部分显示分数

float scoreWidth = lineViewWidth / 5;

int scoreAdd = (int) (maxValue / 5);

if (isInEditMode()) {

return;

}

for (int i = 0; i < barList.size(); i++) {

barRect.left = itemNameWidth;

barRect.top = barSpace * (i + 2) + barWidth * i;

barRect.right = (int) (lineViewWidth * (barList.get(i).getScore() / maxValue)) + itemNameWidth;

barRect.bottom = barRect.top + barWidth;

if ((barList.get(i).getScore() / maxValue) >= 0.6) {

barPaint.setColor(getResources().getColor(R.color.score_blue));

} else {

barPaint.setColor(getResources().getColor(R.color.score_red));

}

canvas.drawRect(barRect, barPaint);

canvas.drawText(barList.get(i).getScore() + "分", barRect.right, barRect.bottom - (barWidth - scoreTextHeight), textPaint);

canvas.drawText(barList.get(i).getItemName(), itemNameWidth - betweenMargin - textPaint.measureText(barList.get(i).getItemName()), barRect.bottom - (barWidth - scoreTextHeight), textPaint);

canvas.drawText(String.valueOf(scoreAdd * (i + 1)), itemNameWidth + scoreWidth * (i + 1) - textPaint.measureText(String.valueOf(scoreAdd * (i + 1))) / 2, barSpace, textPaint);

}

// canvas.drawText(String.valueOf(maxValue), itemNameWidth + lineViewWidth - textPaint.measureText(String.valueOf(maxValue)) / 2, barSpace, textPaint);

canvas.drawText("0(分)", itemNameWidth - betweenMargin - textPaint.measureText("0(分)"), barSpace, textPaint);

canvas.drawLine(itemNameWidth, 0, itemNameWidth, this.getHeight(), linePaint);

}

/**

* 设置统计项目列表

*

* @param barList

*/

public void setBarList(List barList) {

this.barList = barList;

if (barList == null) {

throw new RuntimeException("BarChartView.setItems(): the param items cannot be null.");

}

if (barList.size() == 0) {

return;

}

maxValue = barList.get(0).getScore();

for (Bar bar : barList) {

if (bar.getScore() > maxValue) {

maxValue = bar.getScore();

}

}

invalidate();

}

public static class Bar {

int score;

String itemName;

public Bar(int score, String itemName) {

this.score = score;

this.itemName = itemName;

}

public int getScore() {

return score;

}

public void setScore(int score) {

this.score = score;

}

public String getItemName() {

return itemName;

}

public void setItemName(String itemName) {

this.itemName = itemName;

}

}

//根据xml的设定获取宽度

private int measureWidth(int measureSpec) {

int specMode = MeasureSpec.getMode(measureSpec);

int specSize = MeasureSpec.getSize(measureSpec);

//wrap_content

if (specMode == MeasureSpec.AT_MOST) {

}

//fill_parent或者精确值

else if (specMode == MeasureSpec.EXACTLY) {

}

Log.i("这个控件的宽度----------", "specMode=" + specMode + " specSize=" + specSize);

return specSize;

}

//根据xml的设定获取高度

private int measureHeight(int measureSpec) {

int specMode = MeasureSpec.getMode(measureSpec);

int specSize = MeasureSpec.getSize(measureSpec);

//wrap_content

if (specMode == MeasureSpec.AT_MOST) {

}

//fill_parent或者精确值

else if (specMode == MeasureSpec.EXACTLY) {

}

Log.i("这个控件的高度----------", "specMode:" + specMode + " specSize:" + specSize);

return specSize;

}

}

使用也很简单：

在布局文件中手动设置属性；

注意高度是根据统计项目多少来设置的！

android:id="@+id/score_checklist"

android:layout_width="match_parent"

android:layout_height="230dp"/>

scoreList = (HorizontalChartView) findViewById(R.id.score_checklist);

List barList = new ArrayList<>();

barList.add(new HorizontalChartView.Bar(18, "听力"));

barList.add(new HorizontalChartView.Bar(15, "语法"));

barList.add(new HorizontalChartView.Bar(17, "词法"));

barList.add(new HorizontalChartView.Bar(20, "阅读理解"));

barList.add(new HorizontalChartView.Bar(10, "说"));

scoreList.setBarList(barList);

搞定。。。

当然还有很多不完善的地方，大家自己修改下。

Android 横向条形统计图相关教程