推薦一款簡易的折線圖惰说,效果如下
使用比較簡單
先去這里把View源碼下載下來放入到自己的view目錄 源碼地址
在布局中添加:(com.sp.view.LineView
根據(jù)自己放代碼的位置修改)
<com.sp.view.LineView
android:id="@+id/lineView"
android:layout_width="match_parent"
android:layout_height="350px" />
使用:
((LineView) headView.findViewById(R.id.lineView)).setData(
Arrays.asList("02-1","02-1","02-1","02-1","02-1","02-1","02-1"),
Arrays.asList(1.0f,2.0f,3.0f,4.0f,5.0f,6.0f,7.0f));
可以自己修改的自定義屬性
/**
* 底部間隙大小
*/
private float bootomDes = 10;
/**
* 左邊間隙大小
*/
private float leftDes = 10;
/**
* 縱坐標(biāo)固定值分為幾個間隔 默認(rèn)6個
*/
private int yGapSize = 6;
/**
* 背景色
*/
private int bgColor = 0x66000000;
/**
* 刻度值字體大小
*/
private int scaleTxtSize = 13;
/**
* 刻度字體顏色
*/
private int scaleTxtColor = 0xffffffff;
/**
* 折線顏色
*/
private int lineColor = 0xff2791dc;
/**
* 折線粗細層度
*/
private int lindWidth = 2;
實現(xiàn)細節(jié)
onMeasure
寬度為屏幕寬度或者用戶設(shè)置值奈揍,高度為用戶設(shè)置值否則固定為300dp
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int heightSize = MeasureSpec.getSize(heightMeasureSpec);
int heightMode = MeasureSpec.getMode(heightMeasureSpec);
width = MeasureSpec.getSize(widthMeasureSpec);
switch (heightMode) {
case MeasureSpec.AT_MOST:
height = dp2px(getContext(), 350);
break;
case MeasureSpec.EXACTLY:
height = heightSize;
break;
}
setMeasuredDimension(width, height);
}
onDraw
通過繪制底部文字,背景以及背景框箱蟆,左部文字和畫點和連接先
drawBottomText(canvas);
drawRectLineAndBg(canvas);
drawLeftText(canvas);
drawPointAndLine(canvas);
private void drawPointAndLine(Canvas canvas) {
if (xList==null||xList.size()==0){
return;
}
for (int i = 0; i < yList.size(); i++) {
x= getXPix(i);
y= getYPix(yList.get(i));
if (i<=yList.size()-2){
canvas.drawLine(x,y,getXPix(i+1),getYPix(yList.get(i+1)),linePaint);
}
canvas.drawCircle(x, y, (float) this.DOT_OUTER_CIR_RADIUS, bigCirPaint);
canvas.drawCircle(x, y, (float) this.DOT_INNER_CIR_RADIUS, smallCirPaint);
}
}
private void drawLeftText(Canvas canvas) {
if (yList == null || yList.size() == 0) {
return;
}
canvas.save();
max = getUpOrDownNum(getMaxOrMinNum(yList, true), 0, true);
min = getUpOrDownNum(getMaxOrMinNum(yList, false), 0, false);
incressFloat = increaseBy6(max, min);
for (int i = 0; i < yGapSize+1; i++) {
yShalfList.add(getRoundHalfUp(getUpOrDownNum(getMaxOrMinNum(yList,false),0,false)+(incressFloat*i),1));
}
canvas.translate((width - showLineAreaWidth) / 2, showLineAreaHeight);
yGap = showLineAreaHeight/(yGapSize+2); //2頂部和尾部空出一個格子
for (Float aFloat : yShalfList) {
canvas.translate(0,-yGap);
canvas.drawText(aFloat+" -",0,0,scaleTxtPaint);
}
canvas.restore();
}
private void drawRectLineAndBg(Canvas canvas) {
canvas.drawLine(width - showLineAreaWidth, 0, width - showLineAreaWidth, showLineAreaHeight, linePaint);
canvas.drawLine(width - showLineAreaWidth, showLineAreaHeight, width, showLineAreaHeight, linePaint);
canvas.drawRect(width - showLineAreaWidth, 0, width, showLineAreaHeight, bgPaint);
}
private void drawBottomText(Canvas canvas) {
if (xList == null || xList.size() == 0) {
return;
}
canvas.save();
canvas.translate(width - showLineAreaWidth, showLineAreaHeight + ((bootomDes + bottomTxtHeight) / 2) + bottomTxtHeight / 2);
xGap = showLineAreaWidth / (xList.size() + 1);
for (String aFloat : xList) {
canvas.translate(xGap, 0);
canvas.drawText(aFloat, 0, 0, scaleTxtPaint);
}
canvas.restore();
}
具體查看源碼吧 源碼地址