自定义View画报表

自定义view

package com.redcircle.redcircle.Widget;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;

import com.redcircle.redcircle.utils.DpTools;

import java.util.ArrayList;
import java.util.List;

/**
* Created by Administrator on 2015/10/12.
*/
public class HistogramView extends View {
private int width;
private int height;
private float topBarHeight = 50;
private float bottomBarHeight = 50;
private float HistogramWidth = 20;
private float mSpacing = 50;
private Paint mPaintWhite;
private Paint mPaintBackground;
private Paint mPaintHistogram;
private List<Histogram> mData;
private Paint mPaintHistogramPro;

public void setData(List<Histogram> data) {
this.mData = data;
//        requestLayout();//onMeasure方法
invalidate();//onDraw方法
}

public HistogramView(Context context, AttributeSet attrs) {
super(context, attrs);
initData();
topBarHeight = DpTools.dip2px(context,50);
bottomBarHeight = DpTools.dip2px(context,50);
HistogramWidth = DpTools.dip2px(context,20);
mSpacing = DpTools.dip2px(context,50);

mPaintWhite = new Paint();
mPaintWhite.setColor(Color.WHITE);

mPaintBackground = new Paint();
mPaintBackground.setARGB(255, 212, 212, 212);

mPaintHistogram = new Paint();
mPaintHistogram.setARGB(255, 183, 183, 183);
mPaintHistogram.setStrokeWidth(HistogramWidth);
mPaintHistogram.setStyle(Paint.Style.FILL);
mPaintHistogram.setTextSize(HistogramWidth);
mPaintHistogram.setTextAlign(Paint.Align.CENTER);

mPaintHistogramPro = new Paint();
mPaintHistogramPro.setARGB(255, 254, 135, 69);
mPaintHistogramPro.setStrokeWidth(HistogramWidth);
}
public void initData(){
mData = new ArrayList<>();
mData.add(new Histogram("张三",30));
mData.add(new Histogram("李四", 35));
mData.add(new Histogram("王五",40));
mData.add(new Histogram("张三", 45));
mData.add(new Histogram("李四", 50));
mData.add(new Histogram("王五", 55));
mData.add(new Histogram("张三",60));
mData.add(new Histogram("李四", 65));
mData.add(new Histogram("王五", 70));
mData.add(new Histogram("张三", 75));
mData.add(new Histogram("李四", 80));
mData.add(new Histogram("张三", 30));
mData.add(new Histogram("张三", 30));
mData.add(new Histogram("李四", 50));
mData.add(new Histogram("王五", 55));
mData.add(new Histogram("张三", 60));
mData.add(new Histogram("李四", 65));
mData.add(new Histogram("王五", 70));
mData.add(new Histogram("张三", 75));
mData.add(new Histogram("李四",80));
mData.add(new Histogram("张三", 30));
mData.add(new Histogram("张三", 30));
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
if (mData==null){
width = getDefaultSize(getSuggestedMinimumWidth(),widthMeasureSpec);
}else {
width = (int) ((mData.size()+1)*mSpacing);
}
height = getDefaultSize(getSuggestedMinimumHeight(),heightMeasureSpec);
setMeasuredDimension(width, height);
}

@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawRect(0, 0, width, topBarHeight, mPaintWhite);
canvas.drawRect(0, topBarHeight, width, height - bottomBarHeight, mPaintBackground);
canvas.drawRect(0, height - bottomBarHeight, width, height, mPaintWhite);

if (mData!=null){
for (int i =0;i<mData.size();i++){
Histogram histogram = mData.get(i);
canvas.drawLine(mSpacing*(i+1),height-bottomBarHeight,mSpacing*(i+1),topBarHeight,mPaintHistogram);
canvas.drawLine(mSpacing*(i+1),height-bottomBarHeight,mSpacing*(i+1),height - topBarHeight - (height - topBarHeight - bottomBarHeight) * histogram.getPercent() / 100,mPaintHistogramPro);

String percent = histogram.getPercent()+"%";
canvas.drawText(percent,mSpacing*(i+1),topBarHeight,mPaintHistogram);

canvas.save();
canvas.rotate(-45, mSpacing * (i + 1), height - bottomBarHeight + 5);
canvas.drawText(histogram.getName(), mSpacing * (i + 1) - mPaintBackground.measureText(histogram.getName()), height - bottomBarHeight + 35, mPaintHistogram);
canvas.restore();
}
}
}
}

布局文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.redcircle.redcircle.Widget.HistogramView
android:id="@+id/histogramview"
android:layout_width="match_parent"
android:layout_height="match_parent">

</com.redcircle.redcircle.Widget.HistogramView>

</HorizontalScrollView>

</LinearLayout>

获得比例和姓名所需要的类

package com.redcircle.redcircle.Widget;

/**
* Created by Administrator on 2015/10/13.
*/
public class Histogram {
private String name;
private int percent;

public Histogram(){}

public Histogram(String name, int percent) {
this.name = name;
this.percent = percent;
}

public String getName() {
return name;
}

public void setName(String name) {
this.name = name;
}

public int getPercent() {
return percent;
}

public void setPercent(int percent) {
this.percent = percent;
}
}

工具类dp与px转换

package com.redcircle.redcircle.utils;

import android.content.Context;

/**
* Created by Administrator on 2015/10/13.
*/
public class DpTools {
/**
* 根据手机的分辨率从 dp 的单位 转成为 px(像素)
*/
public static int dip2px(Context context, float dpValue) {
final float scale = context.getResources().getDisplayMetrics().density;
return (int) (dpValue * scale + 0.5f);
}

/**
* 根据手机的分辨率从 px(像素) 的单位 转成为 dp
*/
public static int px2dip(Context context, float pxValue) {
final float scale = context.getResources().getDisplayMetrics().density;
return (int) (pxValue / scale + 0.5f);
}
}

另一种滚动报表的方式

HistogramActivity

public class HistogramActivity extends BaseActivity {
private List<Histogram> mData;
private ScrollHistogramView histogramView;
private Button button;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
histogramView = (ScrollHistogramView) findViewById(R.id.scroll_histogram);
button = (Button) findViewById(R.id.button);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
initData();
histogramView.setData(mData);
}
});
}
public void initData(){
mData = new ArrayList<>();
mData.add(new Histogram("张三",30));
mData.add(new Histogram("李四", 35));
mData.add(new Histogram("王五",40));
mData.add(new Histogram("张三", 45));
mData.add(new Histogram("李四",50));
mData.add(new Histogram("王五", 55));
mData.add(new Histogram("张三",60));
mData.add(new Histogram("李四", 65));
mData.add(new Histogram("王五", 70));
mData.add(new Histogram("张三", 75));
mData.add(new Histogram("李四", 80));
mData.add(new Histogram("张三", 30));
mData.add(new Histogram("张三", 30));
mData.add(new Histogram("李四", 50));
mData.add(new Histogram("王五", 55));
mData.add(new Histogram("张三", 60));
mData.add(new Histogram("李四", 65));
mData.add(new Histogram("王五", 70));
mData.add(new Histogram("张三", 75));
mData.add(new Histogram("李四",80));
mData.add(new Histogram("张三", 30));
mData.add(new Histogram("张三", 30));
}
}

ScrollHistogramView

package com.redcircle.redcircle.Widget;

import android.content.Context;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.HorizontalScrollView;

import com.redcircle.redcircle.R;

import java.util.List;

/**
* Created by Administrator on 2015/10/12.
*/
public class ScrollHistogramView extends HorizontalScrollView {
private HistogramView histogramView;

public ScrollHistogramView(Context context, AttributeSet attrs) {
super(context, attrs);
LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View view = inflater.inflate(R.layout.histogram_view,null);
histogramView = (HistogramView) view.findViewById(R.id.histogramview);
this.addView(view);
}
public void setData(List<Histogram>mData){
histogramView.setData(mData);
}
}

HistogramView中需要添加一个方法，以通知它重新测量和重绘

public void setData(List<Histogram> data) {
this.mData = data;
requestLayout();//onMeasure方法
invalidate();//onDraw方法
}

布局文件

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<com.redcircle.redcircle.Widget.ScrollHistogramView
android:id="@+id/scroll_histogram"
android:layout_width="match_parent"
android:layout_height="match_parent">

</com.redcircle.redcircle.Widget.ScrollHistogramView>
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="刷新界面"/>

</RelativeLayout>

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<com.redcircle.redcircle.Widget.HistogramView
android:id="@+id/histogramview"
android:layout_width="match_parent"
android:layout_height="match_parent">

</com.redcircle.redcircle.Widget.HistogramView>

</LinearLayout>