LeafChart-实现自己的小型图表库(2)

一. 设计

  1. 上次写的七日化利率表设计很粗糙,也没有体现面向对象的思想。数据处理都在控件中,而且表格列数比较固定,对于数据和列数不匹配的情况,只能从左向右依次显示数据。另外扩展性很差。
  2. 根据图表的属性,分别抽象出坐标轴、坐标刻度、点、线等类。所以在使用的时候初始化这些数据就可以控制图表的展示。
  3. 抽象出折线统计图和条形统计图公共部分AbsLeafChart,这个类主要处理了控件的有关尺寸、初始化坐标轴和坐标轴刻度、计算每个点在控件的坐标。
  4. 折线统计图LeafLineChart继承AbsLeafChart,只负责画折线图。

二.类介绍

AxisValue 坐标轴刻度

类型 属性 介绍
String label 刻度值
float pointX x 坐标
float pointY y 坐标

Axis 坐标轴

类型 属性 介绍
List values 刻度集合
boolean hasLines 是否连线
boolean isShowText 是否显示坐标轴刻度值
Typeface typeface 刻度字体
int textSize 刻度字体大小
int textColor 刻度字体颜色
int axisColor x/y轴颜色
float axisWidth x/y轴宽度
int axisLineColor 平行于x/y轴的坐标轴颜色
float axisLineWidth 平行于x/y轴的坐标轴宽度
float startX 坐标轴起点x坐标
float startY 坐标轴起点y坐标
float stopX 坐标轴终点x坐标
float stopY 坐标轴终点y坐标

PointValue 点

类型 属性 介绍
float x 占x轴总长度权重
float y 占x轴总长度权重
float diffX 距离原点长度
float diffY 距离原点长度
float originX x坐标
float originY y坐标
String label 标签

ChartData 图表数据

类型 属性 介绍
List values 点集合
boolean hasLabels 是否显示标签
int labelColor 标签背景色
float labelRadius 标签背景弧度

Line extends ChartData 折线

类型 属性 介绍
int lineColor 折线颜色
float lineWidth 折线的宽度
boolean hasPoints 是否画圆点
boolean hasLines 是否画线条
int pointColor 圆点颜色
float pointRadius 圆点半径
boolean isCubic 是否是曲线
boolean isFill 是否填充
int fillColr 填充色

三、实现

暂时只实现了折线图,这里只介绍折线图实现

AbsLeafChart中的相关方法:

尺寸控制

@Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        initViewSize();

        resetAsixSize();

        resetLineSize();
    }

控件宽高和控件内间距初始化

protected void initViewSize() {
        mWidth = getMeasuredWidth();
        mHeight = getMeasuredHeight();
        leftPadding = LeafUtil.dp2px(mContext, 20);
        rightPadding = LeafUtil.dp2px(mContext, 10);
        topPadding = LeafUtil.dp2px(mContext, 15);
        bottomPadding = LeafUtil.dp2px(mContext, 20);
    }

设置坐标轴位置

protected void resetAsixSize() {
        if(axisX != null){
            List<AxisValue> values = axisX.getValues();
            int sizeX = values.size(); //几条y轴
            float xStep = (mWidth - leftPadding) / sizeX;
            axisX.setStepSize(xStep);
            for (int i = 0; i < sizeX; i++) {
                AxisValue axisValue = values.get(i);
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值