HelloCharts图表库之柱状图

HelloCharts项目giuhub网址：https://github.com/lecho/hellocharts-android；
柱状图的使用
1,在布局文件中声明控件

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

    <lecho.lib.hellocharts.view.ColumnChartView  android:id="@+id/ccv" android:layout_width="match_parent" android:layout_height="match_parent" />

</LinearLayout>

2，在Activity中的处理
步骤：

1. 找到控件
2. 初始化数据
3. 设置数据

4. 设置点击事件

   详细设置见代码：

public class MyColumnChartActivity extends Activity {

    private ColumnChartView chart;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_mycolumnchart);
        chart = (ColumnChartView) findViewById(R.id.ccv);
        chart.setOnValueTouchListener(new ColumnChartOnValueSelectListener() {
            @Override
            public void onValueSelected(int i, int i1, SubcolumnValue subcolumnValue) {
                Toast.makeText(MyColumnChartActivity.this, "i:" + i + ",i1:" + i1, Toast.LENGTH_SHORT).show();
            }

            @Override
            public void onValueDeselected() {
                Toast.makeText(MyColumnChartActivity.this, "黑人???", Toast.LENGTH_SHORT).show();
            }
        });
        generateData();
    }

    private void generateData() {
        //一个柱状图需要一个柱子集合
        List<Column> columnList = new ArrayList<>();
        //每根柱子又可以分为多根柱子
        List<SubcolumnValue> subcolumnValueList;
        int columns = 7;//一共7根柱子
        int subColumn = 1;//每根柱子的子柱子为1根
        for (int i = 0; i < columns; i++) {
            subcolumnValueList = new ArrayList<>();
            for (int j = 0; j < subColumn; j++) {
                //每根子柱子需要一个值和颜色
                subcolumnValueList.add(new SubcolumnValue((float) Math.random(), ChartUtils.pickColor()));
            }
            //每根柱子需要一个子柱子集合
            Column column = new Column(subcolumnValueList);
            //这一步是能让圆柱标注数据显示带小数的重要一步
            ColumnChartValueFormatter chartValueFormatter = new SimpleColumnChartValueFormatter(2);
            column.setFormatter(chartValueFormatter);
            column.setHasLabels(true);//是否直接显示标注（其它的一些设置类似折线图）
            columnList.add(column);
        }
        ColumnChartData data = new ColumnChartData(columnList);
        Axis axisX = new Axis();
        Axis axisY = new Axis().setHasLines(true);
        axisX.setName("段位");
        axisY.setName("出场率%");
        axisY.hasLines();//是否显示网格线
        axisY.setTextColor(Color.BLACK);//颜色
        //给轴设置值
        List<AxisValue> list = new ArrayList<>();
        for (int i = 0; i < 7; i++) {
            list.add(new AxisValue(i).setLabel("周" + (i + 1)));//i代表位置，label则是在轴上该位置的标注
        }
        //给x轴设置值
        axisX.setValues(list);
        data.setAxisXBottom(axisX);
        //设置是否让多根子柱子在同一根柱子上显示（会以断层的形式分开），由于这里子柱子只有一根，故设置true也无意义，读者可自行尝试
        data.setStacked(false);
        chart.setColumnChartData(data);
    }
}

4，HelloCharts还支持数值变化时的动画效果
使用chart.startDataAnimation()即可产生动画，在调用该方法前让数值化生变化即可观察到动画效果

prepareDataAnimation();//执行动画前改变数值
chart.startDataAnimation();

private void prepareDataAnimation() {
            for (Column column : data.getColumns()) {
                for (SubcolumnValue value : column.getValues()) {
                    value.setTarget((float) Math.random() * 100);
                }
            }
        }

5，HelloChrts默认支持缩放效果
chart.setZoomType(ZoomType.HORIZONTAL);设置缩放模式（水平缩放，垂直缩放，双向缩放）
chart.setZoomEnabled(true);设置是否可以缩放
效果图：