<?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);設定是否可以縮放
效果圖：