您的位置:首页 > 其它

折线图(二)自定义LineChartView的折线图padding的长度

2015-11-16 23:08 435 查看
首先在values文件夹新建attrs.xml文件

<?xmlversion="1.0"encoding="utf-8"?>
<resources>

<declare-styleablename="LineChartView">
<attrname="chartPadding"format="dimension"></attr>
</declare-styleable>

</resources>



/**
*绘制折线图详情
*/
publicclassLineChartViewextendsView

{
/**
*折线图padding
*/
floatchardPading;

publicLineChartView(Contextcontext,AttributeSetattrs){
super(context,attrs);
//获取提供的chardPading长度,如果不提供,默认为100px.注意,拿到的dip单位最终会转化为px
TypedArraytypedArray=context.obtainStyledAttributes(attrs,R.styleable.LineChartView);
chardPading=typedArray.getDimension(R.styleable.LineChartView_chartPadding,100);
}

@Override
protectedvoidonDraw(Canvascanvas){
//绘制坐标轴
drawAxis(canvas);
}

/**
*绘制坐标轴,并且设置100padding给LineChartView
*@paramcanvas
*/
privatevoiddrawAxis(Canvascanvas){
intchartViewHeight=getMeasuredHeight();//获取LineChartView高度
intcharViewWidth=getMeasuredWidth();//获取LineChartView宽度
Paintpaint=newPaint();//画笔
paint.setColor(Color.BLACK);//设置画笔为黑色
paint.setStrokeWidth(5);//设置画笔尖大小为5px

/*
*绘制直线.在2点之间连线
*startX起点的x坐标
*startY起点的y坐标
*endX终点的x坐标
*endY终点的y坐标
*canvas.drawLine(startX,startY,endX,endY)
*/

//绘制直线paddingTop了chardPading的y轴
canvas.drawLine(chardPading,chartViewHeight-chardPading,chardPading,chardPading,paint);

//绘制y轴左边半边箭头
canvas.drawLine(chardPading,chardPading,chardPading-20,chardPading+20,paint);

//绘制y轴右边半边箭头
canvas.drawLine(chardPading,chardPading,chardPading+20,chardPading+20,paint);

//绘制直线paddingLeft了chardPading的x轴,
canvas.drawLine(chardPading,chartViewHeight-chardPading,charViewWidth-chardPading,chartViewHeight-chardPading,paint);

//绘制x轴上半部分箭头
canvas.drawLine(charViewWidth-chardPading,chartViewHeight-chardPading,charViewWidth-chardPading-20,chartViewHeight-chardPading-20,paint);

//绘制x轴下半部分箭头
canvas.drawLine(charViewWidth-chardPading,chartViewHeight-chardPading,charViewWidth-chardPading-20,chartViewHeight-chardPading+20,paint);
}

}
30dp效果:
<?xmlversion="1.0"encoding="utf-8"?>
<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<sam.android.utils.widget.LineChartView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:chartPadding="30dp"
/>

</LinearLayout>


120dp效果:
<?xmlversion="1.0"encoding="utf-8"?>
<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<sam.android.utils.widget.LineChartView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:chartPadding="120dp"
/>

</LinearLayout>


待更新3

                                            
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: