Android动态折线图绘制实时更新数据_Socket通信动态折线图
2020-05-20 13:25:13  By: shinyuu

项目里需要App端不断地从服务器获取数据,实时生成图表。在线程一个线程中不断的从服务器获取数据,然后在Handler中更新界面,每获取一个数据发送一个Message,Handler收到Message之后更新折线图。图表控件使用的是MPAndroidChart。自己写了一个实时更新折线图的工具类。希望有需要的盆友可以直接拿走使用。


1、实时折线图工具类

import android.graphics.Color;

import com.github.mikephil.charting.charts.LineChart;
import com.github.mikephil.charting.components.AxisBase;
import com.github.mikephil.charting.components.Description;
import com.github.mikephil.charting.components.Legend;
import com.github.mikephil.charting.components.XAxis;
import com.github.mikephil.charting.components.YAxis;
import com.github.mikephil.charting.data.Entry;
import com.github.mikephil.charting.data.LineData;
import com.github.mikephil.charting.data.LineDataSet;
import com.github.mikephil.charting.formatter.IAxisValueFormatter;

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

public class ChartUtils {

    private LineChart lineChart;
    private LineData mLineData;
    private List<Entry> lineList = new ArrayList<>();
    private List<String> xData = new ArrayList<>();


    public void initStateChart(LineChart chart) {
        lineChart = chart;
        lineChart.setBackgroundColor(Color.rgb(255, 255, 255));
        // 不可以缩放
        lineChart.setScaleEnabled(false);

        //启用或禁用描述
        Description description = lineChart.getDescription();
        description.setEnabled(false);

        //新建空数据
        LineDataSet dataSet = new LineDataSet(lineList, "设备波形图");
        //线条颜色
        dataSet.setColor(Color.parseColor("#60B0F2"));
        //圆点颜色
        dataSet.setCircleColor(Color.parseColor("#60B0F2"));
        dataSet.setCircleRadius(1.5f);
        dataSet.setMode(LineDataSet.Mode.CUBIC_BEZIER);
        dataSet.setFillColor(Color.parseColor("#60B0F2"));
        dataSet.setFillAlpha(50);
        //线条宽度
        dataSet.setLineWidth(1f);

        //设置x轴、y轴样式
        YAxis rightAxis = lineChart.getAxisRight();
        YAxis leftAxis = lineChart.getAxisLeft();
        //保证Y轴从0开始,不然会上移一点
        leftAxis.setAxisMinimum(0f);
        rightAxis.setAxisMinimum(300f);
        //设置图表右边的y轴禁用
        rightAxis.setEnabled(false);
        //设置图表左边的y轴禁用
        //设置x轴
        XAxis xAxis = lineChart.getXAxis();
        xAxis.setTextColor(Color.parseColor("#333333"));
        xAxis.setTextSize(11f);
        xAxis.setAxisMinimum(0f);
        //是否绘制轴线
        xAxis.setDrawAxisLine(true);
        //设置x轴上每个点对应的线
        xAxis.setDrawGridLines(true);
        //绘制标签  指x轴上的对应数值
        xAxis.setDrawLabels(true);
        //设置x轴的显示位置
        xAxis.setPosition(XAxis.XAxisPosition.BOTTOM);
        //禁止放大后x轴标签重绘
        xAxis.setGranularity(1f);
        //自定义x轴值
        xAxis.setValueFormatter(LineXiavf0);
        //图表将避免第一个和最后一个标签条目被减掉在图表或屏幕的边缘
        xAxis.setAvoidFirstLastClipping(true);

        Legend l = lineChart.getLegend();
        l.setForm(Legend.LegendForm.LINE);
        l.setVerticalAlignment(Legend.LegendVerticalAlignment.TOP);
        l.setHorizontalAlignment(Legend.LegendHorizontalAlignment.CENTER);
        l.setOrientation(Legend.LegendOrientation.HORIZONTAL);
        l.setDrawInside(false);

        //chart设置数据
        mLineData = new LineData(dataSet);
        //是否绘制线条上的文字
        mLineData.setDrawValues(true);

        lineChart.setData(mLineData);
        lineChart.animateX(500);
        lineChart.setNoDataText("暂无数据");
        lineChart.invalidate();
    }

    //自定义x轴值
    private IAxisValueFormatter LineXiavf0 = new IAxisValueFormatter() {
        @Override
        public String getFormattedValue(float value, AxisBase axis) {
            int p = (int) value;
            if (p < xData.size() && p > -1) {
                return xData.get(p);
            } else {
                return "";
            }
        }
    };

    //添加数据
    public void addEntry(String xValue, int yValue) {
        //添加x轴值
        xData.add(xValue);
        //添加y轴值
        Entry entry = new Entry(xData.size(), yValue);
        mLineData.addEntry(entry, 0);
        //数据刷新
        mLineData.notifyDataChanged();
        //char图标刷新
        lineChart.notifyDataSetChanged();
        //x轴显示最大个数
        lineChart.setVisibleXRangeMaximum(20);
        //x轴移动
        lineChart.moveViewToAnimated(xData.size(), 0, YAxis.AxisDependency.RIGHT, 75);
    }

}


2、通过Socket获取后台发送的数据

public class TcpSocketAsyncTask extends AsyncTask<Void, Void, String> {

    private String ip;
    private String port;

    public TcpSocketAsyncTask(String ip, String port) {
        this.ip = ip;
        this.port = port;
    }

    @Override
    protected String doInBackground(Void... param) {

        try {
            socket = new Socket(ip, Integer.parseInt(port));
            InputStream inputStream = socket.getInputStream();
            DataInputStream input = new DataInputStream(inputStream);
            byte[] b = new byte[10000];
            while (true) {
                int length = input.read(b);
                String msg = new String(b, 0, length);
                Message message = new Message();
                message.obj = msg;
                mHandler.sendMessage(message);
            }
        } catch (Exception ex) {
            ex.printStackTrace();
            Message message = new Message();
            message.obj = ip   ":"   port   "Socket连接异常";
            mHandler.sendMessage(message);
        }
        return "";
    }

}


3、Message配合Handler实现

Handler mHandler = new Handler() {
    @Override
    public void handleMessage(Message msg) {
        try {
            String cussStr = "".equals(mResultTextview.getText().toString()) ? "" : mResultTextview.getText().toString()   "
";
            mResultTextview.setText(cussStr   msg.obj.toString());

            //要在java代码中设置滚动的方法:
            mResultTextview.setMovementMethod(ScrollingMovementMethod.getInstance());
            //下面是设置显示最新的内容:
            mResultTextview.setSelection(mResultTextview.getText().length(), mResultTextview.getText().length());

            int valueTen2 = Integer.parseInt(msg.obj.toString());
            Log.v("Socket 接收数据==========", msg.obj.toString()   ",十进制数据: "   valueTen2);
            mChartUtils.addEntry("", valueTen2);
        }catch (Exception e){
            e.printStackTrace();
        }
    }

};


另外我们在使用MPAndroidChart的时候,需要先导包哦,implementation ´com.github.PhilJay:MPAndroidChart:v3.1.0-alpha´,通过这句代码就可以导入了,然后在界面上引入一个com.github.mikephil.charting.charts.LineChart的View就可以了


猜你喜欢的

快速评论


技术评论

  • 该技术还没有评论、赶快抢沙发吧...
DD记账
top
+