Android开发 - 实时心率控件图

数据处理流程：

graph LR
心率数据-->心率仓库
心率仓库-->根据采样率获取心率数据
根据采样率获取心率数据--> 打印数据

思路篇：

• 整个控件分成上下两层。上层画线条，下层画表格
  • 线条篇
    • 1.线条决定使用Path来画，而Path的数据，则使用一个Int数组来保存
    • 2.Int数组的大小，是依据采样频率 * 显示秒数 来决定的
    • 3.读取数据赋值到Path里，需要指定 x , y 的值
    • 4.X 依据采样频率，可以计算出每个点的 X 的值
    • 5.Y 的位置，则是依据值的大小，以及控件应该设置一个MAX最大值的大小的比例，计算出Y的绝对位置。
    • 6.线条走动，则是将数组内数据的移动 Int[n] = Int[n+1]
    • 7.在实际情况中，极有可能是先采集的数据，再对数据进行播放，所以控件内部需要维护一个数据仓库，数据添加不需要考虑其他问题，而速率问题则由控件内部维护。
    • 8.而速率，则是根据采样率，来进行控制速度从数据仓库定时取出。
    • 9.但是在实际情况中，有时候需要对速率进行慢速播放，实速播放，以及加速播放。所以需要一个控制播放速度。
  • 表格篇
    • 1.线条绘制由一个基准线标准，可以将线条的绘制维持在基准线上下，而不会导致线条偏移离谱
    • 2.由基准线衍生出来的表格，需要可以自定义表格的行数，线条宽度，以及颜色，等。

代码篇：

先看属性：

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="HeartView">
        <!--心电线的宽度-->
        <attr name="heart_line_border" format="dimension" />
        <!--每个表格的行数（就是小格子数）-->
        <attr name="heart_grid_row" format="integer" />
        <!--大表格的边框的宽度-->
        <attr name="heart_grid_border" format="dimension" />
        <!--每个小格子的宽高-->
        <attr name="heart_grid_row_height" format="dimension" />
        <!--每个小格子的线的宽度-->
        <attr name="heart_grid_line_border" format="dimension" />
        <!--基准线-->
        <attr name="heart_base_line" format="integer" />
        <!--最大值-->
        <attr name="heart_max" format="integer" />
        <!--最小值-->
        <attr name="heart_min" format="integer" />
        <!--数据采集频率-->
        <attr name="heart_hz" format="integer" />
        <!--一个控件，可以显示的心率的时长-->
        <attr name="heart_show_seconds" format="float" />
        <!--心率线条的颜色-->
        <attr name="heart_color" format="color" />
        <!--表格线条的颜色-->
        <attr name="heart_grid_line_color" format="color" />
        <!--表格边框的颜色-->
        <attr name="heart_grid_border_color" format="color" />
        <!--控制播放速度的调整 值越小，播放速度越慢 -->
        <attr name="heart_speed" format="float" />
    </declare-styleable>
</resources>

实现代码：

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.util.AttributeSet;
import android.view.View;

import androidx.annotation.ColorInt;
import androidx.annotation.FloatRange;

import java.util.Timer;
import java.util.TimerTask;
import java.util.concurrent.LinkedBlockingDeque;

/**
 * 显示心电的控件
 */
public class HeartView extends View
{
    // 数据的最大值
    private int Max;
    // 数据的最小值
    private int Min;
    // 数据一秒钟采集频率，默认100个点一秒种
    private int hz;
    // 控件显示几秒钟的心跳,默认显示2秒钟的心跳
    private float showSeconds;
    // 要画的基准线
    private int baseLine;
    // 每个方格的行数
    private int grid_row;
    // 每个方格的高度
    private int grid_row_height;
    // 心率线条的颜色 默认红色
    private int heartColor;
    // 表格线条的颜色 默认灰色
    private int heart_grid_line_color;
    // 表格边框的颜色 默认灰色
    private in