【Android】利用HelloChart绘制曲线

1、将jar包放到app下的libs文件夹中

2、build.gradle(app)：

implementation files('libs\\hellocharts-library-1.5.8.jar')

3、MainActivity.java

package com.dj.drawlinestest;

import android.graphics.Color;
import android.os.Bundle;
import android.os.Handler;
import android.view.View;

import androidx.appcompat.app.AppCompatActivity;

import java.util.ArrayList;
import java.util.LinkedList;
import java.util.List;
import java.util.Random;

import lecho.lib.hellocharts.gesture.ContainerScrollType;
import lecho.lib.hellocharts.gesture.ZoomType;
import lecho.lib.hellocharts.model.Axis;
import lecho.lib.hellocharts.model.AxisValue;
import lecho.lib.hellocharts.model.Line;
import lecho.lib.hellocharts.model.LineChartData;
import lecho.lib.hellocharts.model.PointValue;
import lecho.lib.hellocharts.model.ValueShape;
import lecho.lib.hellocharts.model.Viewport;
import lecho.lib.hellocharts.view.LineChartView;

public class MainActivity extends AppCompatActivity {
    
    

    LineChartView lineChart;

    Random mRandom;
    Handler mHandler;
    MyRunnable mRunnable;
    DrawLinesUtil mDrawLinesUtil;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
    
    
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mRandom = new Random();

        lineChart = findViewById(R.id.LineChart);
        mDrawLinesUtil = new DrawLinesUtil(lineChart);

        mRunnable = new MyRunnable();
        mHandler = new Handler();
        mHandler.postDelayed(mRunnable, 0);
    }

    private class MyRunnable implements Runnable {
    
    
        @Override
        public void run() {
    
    
            Integer number = Math.abs(mRandom.nextInt()) % 50 + 50;
            mDrawLinesUtil.updateLocNumList(number);
            mDrawLinesUtil.display_chart();
            mHandler.postDelayed(this, 1000);
        }
    }

}

4、activity_main.xml

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

    <lecho.lib.hellocharts.view.LineChartView
        android:id="@+id/LineChart"
        android:layout_width="match_parent"
        android:layout_height="500dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:alpha="0.6"></lecho.lib.hellocharts.view.LineChartView>

</LinearLayout>

5、工具类：

DrawLinesUtil.java

package com.dj.drawlinestest;

import android.graphics.Color;
import android.view.View;

import java.util.ArrayList;
import java.util.LinkedList;
import java.util.List;

import lecho.lib.hellocharts.gesture.ContainerScrollType;
import lecho.lib.hellocharts.gesture.ZoomType;
import lecho.lib.hellocharts.model.Axis;
import lecho.lib.hellocharts.model.AxisValue;
import lecho.lib.hellocharts.model.Line;
import lecho.lib.hellocharts.model.LineChartData;
import lecho.lib.hellocharts.model.PointValue;
import lecho.lib.hellocharts.model.ValueShape;
import lecho.lib.hellocharts.model.Viewport;
import lecho.lib.hellocharts.view.LineChartView;

public class DrawLinesUtil {
    
    

    LineChartView lineChart;
    private boolean inited;
    private int pointNumber;
    private List<PointValue> mPointValues ;
    private List<AxisValue>  mAxisXValues ;
    private List<Integer>    mLocNumList  ;


    /**
     * 构造函数
     * @param lineChart
     */
    public DrawLinesUtil(LineChartView lineChart) {
    
    
        this.lineChart = lineChart;
        this.inited = false;
        this.pointNumber = 60; // +默认显示60个点
        this.mPointValues    = new ArrayList<>();  // 数据点
        this.mAxisXValues    = new ArrayList<>();  // X轴标注
        this.mLocNumList     = new LinkedList<>(); // 数据源
    }


    /**
     * set  get
     * @return
     */
    public int getPointNumber() {
    
    
        return pointNumber;
    }

    public void setPointNumber(int pointNumber) {
    
    
        this.pointNumber = pointNumber;
    }

    public LineChartView getLineChart() {
    
    
        return lineChart;
    }

    public void setLineChart(LineChartView lineChart) {
    
    
        this.lineChart = lineChart;
    }


    public List<Integer> getLocNumList() {
    
    
        return mLocNumList;
    }

    /**
     * 供外部调用 添加数据
     * @param number
     */
    public void updateLocNumList(Integer number){
    
    
        if (mLocNumList.size() >= pointNumber) {
    
    
            mLocNumList.remove(0);
        }
        mLocNumList.add(number);
    }


    /**
     * 供外部调用 画曲线
     */
    public void display_chart()
    {
    
    
        if( ! inited ){
    
    
            setAttribute();
        }
        getXLables();
        getPoints();
        draw_linechart();
    }


    /**
     * 设置行为属性，支持缩放、滑动以及平移
     */
    private void setAttribute(){
    
    
        lineChart.setInteractive(true);
        lineChart.setZoomType(ZoomType.HORIZONTAL);
        lineChart.setMaxZoom((float) 2);//最大方法比例
        lineChart.setContainerScrollEnabled(true, ContainerScrollType.HORIZONTAL);
        lineChart.setVisibility(View.GONE);
        inited = true;
    }


    /**
     * 设置X轴的显示
     */
    private void getXLables(){
    
    
        mAxisXValues.clear();
        for (int i = 0; i < mLocNumList.size(); i++) {
    
    
            mAxisXValues.add(new AxisValue(i).setLabel(""));//这里设置x轴的内容
        }
    }


    /**
     * 图表的每个点的显示
     */
    private void getPoints() {
    
    
        mPointValues.clear();
        //Log.v(TAG,"getPoints"+mLocNumList.size());
        for (int i = 0; i < mLocNumList.size(); i++) {
    
    
            mPointValues.add(new PointValue(i, mLocNumList.get(i)));
        }
    }

    /**
     * 内部方法 画曲线
     */
    private void draw_linechart(){
    
    

        Line line = new Line(mPointValues).setColor(Color.parseColor("#FFCD41"));//("#FFCD41"));  //折线的颜色（橙色）
        List<Line> lines = new ArrayList<>();
        line.setShape(ValueShape.CIRCLE);//折线图上每个数据点的形状  这里是圆形 （有三种 ：ValueShape.SQUARE  ValueShape.CIRCLE  ValueShape.DIAMOND）
        line.setCubic(true);//曲线是否平滑，即是曲线还是折线
        line.setFilled(true);//是否填充曲线的面积
        line.setHasLabels(false);//曲线的数据坐标是否加上备注
        line.setHasLabelsOnlyForSelected(true);//点击数据坐标提示数据（设置了这个line.setHasLabels(true);就无效）
        line.setHasLines(true);//是否用线显示。如果为false 则没有曲线只有点显示
        line.setHasPoints(true);//是否显示圆点 如果为false 则没有原点只有点显示（每个数据点都是个大的圆点）
        line.setPointRadius(3);
        lines.add(line);
        LineChartData data = new LineChartData();
        data.setLines(lines);

        //坐标轴
        Axis axisX = new Axis(); //X轴
        axisX.setTextSize(0);//设置字体大小
        //axisX.setMaxLabelChars(20); //最多几个X轴坐标，意思就是你的缩放让X轴上数据的个数7<=x<=mAxisXValues.length
        axisX.setValues(mAxisXValues);  //填充X轴的坐标名称
        data.setAxisXBottom(axisX); //x 轴在底部
        //data.setAxisXTop(axisX);  //x 轴在顶部
        // axisX.setHasLines(true); //x 轴分割线

        // Y轴是根据数据的大小自动设置Y轴上限(在下面我会给出固定Y轴数据个数的解决方案)
        Axis axisY = new Axis();  //Y轴
        axisY.setName("");//y轴标注
        axisY.setTextSize(8);//设置字体大小
        data.setAxisYLeft(axisY);  //Y轴设置在左边
        //axisY.setHasLines(true); //Y轴分割线



        //设置行为属性，支持缩放、滑动以及平移
        lineChart.setInteractive(true);
        lineChart.setZoomType(ZoomType.HORIZONTAL);
        lineChart.setMaxZoom((float) 2);//最大方法比例
        lineChart.setContainerScrollEnabled(true, ContainerScrollType.HORIZONTAL);
        lineChart.setLineChartData(data);

        lineChart.setVisibility(View.VISIBLE);

        Viewport v2 = new Viewport(lineChart.getMaximumViewport());
        v2.top    = 100;
        v2.bottom = 0;
        if (mLocNumList.size()>24) {
    
    
            lineChart.setMaximumViewport(v2);
            Viewport v = new Viewport(lineChart.getMaximumViewport());
            v.left = mLocNumList.size() - 24-1;
            lineChart.setCurrentViewport(v);
        }else
        {
    
    
            v2.right  = 24;
            lineChart.setMaximumViewport(v2);
            lineChart.setCurrentViewport(v2);
        }
    }
}