心电图在 Android 平台上的动态演绎：可视化健康波峰

在当今注重健康的时代，随时监测自身状态已成为人们的共同需求。心电图，作为诊断心脏健康的重要工具，可帮助我们及时发现异常情况。而如今，借助 Android 平台的强大功能，心电图的动态呈现也变得触手可及。

本教程将带您一步步构建一款动态滚动的心电图应用，让您能够轻松实现以下功能：

• 实时显示心脏电活动波形，犹如心率监测仪般贴心。
• 灵活调整波形图颜色，满足您的个性化需求。
• 随心所欲修改背景，让心电图在不同场景下都清晰可见。
• 自由设定横向坐标长度，让您专注于特定时间段的心脏活动。

为了让您更深入地理解心电图应用的实现过程，我们还将探讨以下知识点：

• Android 中自定义 View 的技巧，助您掌握界面元素的绘制。
• 线程管理的艺术，让波形图滚动更流畅，资源占用更合理。
• 数据可视化的魅力，让复杂的心脏电活动变得一目了然。

准备好了吗？让我们携手开启这趟心电图应用的开发之旅吧！

1. 搭建开发环境

首先，我们需要搭建好 Android 开发环境。如果您尚未安装 Android Studio，请前往官方网站下载并安装。安装完成后，您将拥有一个完整的 Android 开发工具链，其中包括用于编写、编译和调试 Android 应用的各种工具。

2. 创建新项目

打开 Android Studio，点击 "New Project"。在弹出的对话框中，选择 "Empty Activity" 模板，并为您的项目命名。然后，点击 "Next"。

3. 设计用户界面

在 "res/layout/activity_main.xml" 文件中，添加以下代码：

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

    <com.example.androiddynamicecg.EcgView
        android:id="@+id/ecg_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</RelativeLayout>

这段代码定义了一个 RelativeLayout 布局，其中包含了一个名为 "ecg_view" 的自定义视图。这个自定义视图将用于显示动态滚动的心电图波形。

4. 创建自定义视图

接下来，我们需要创建一个自定义视图来显示心电图波形。在 "app/src/main/java/com/example/androiddynamicecg/" 目录下，创建一个名为 "EcgView.java" 的文件，并添加以下代码：

package com.example.androiddynamicecg;

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

public class EcgView extends View {

    private Paint paint;
    private Path path;
    private float[] ecgData;
    private int ecgDataIndex;
    private float ecgDataMax;
    private float ecgDataMin;
    private int horizontalCoordinateLength;
    private boolean isScrolling;

    public EcgView(Context context) {
        super(context);
        init();
    }

    public EcgView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    public EcgView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init() {
        paint = new Paint();
        paint.setColor(Color.RED);
        paint.setStrokeWidth(2);
        paint.setStyle(Paint.Style.STROKE);
        path = new Path();
        ecgData = new float[1000];
        ecgDataIndex = 0;
        ecgDataMax = Float.MIN_VALUE;
        ecgDataMin = Float.MAX_VALUE;
        horizontalCoordinateLength = 100;
        isScrolling = true;
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        // 绘制横坐标
        paint.setColor(Color.GRAY);
        for (int i = 0; i <= horizontalCoordinateLength; i++) {
            canvas.drawLine(i * getWidth() / horizontalCoordinateLength, 0, i * getWidth() / horizontalCoordinateLength, getHeight(), paint);
        }

        // 绘制纵坐标
        paint.setColor(Color.GRAY);
        for (int i = 0; i <= 10; i++) {
            canvas.drawLine(0, i * getHeight() / 10, getWidth(), i * getHeight() / 10, paint);
        }

        // 绘制心电图波形
        paint.setColor(Color.RED);
        if (ecgDataIndex >= horizontalCoordinateLength) {
            path.reset();
            ecgDataIndex = 0;
        }
        path.moveTo(ecgDataIndex * getWidth() / horizontalCoordinateLength, getHeight() / 2 - (ecgData[ecgDataIndex] - ecgDataMin) / (ecgDataMax - ecgDataMin) * getHeight() / 2);
        for (int i = 1; i < ecgDataIndex; i++) {
            path.lineTo(i * getWidth() / horizontalCoordinateLength, getHeight() / 2 - (ecgData[i] - ecgDataMin) / (ecgDataMax - ecgDataMin) * getHeight() / 2);
        }
        canvas.drawPath(path, paint);

        // 滚动波形
        if (isScrolling) {
            ecgDataIndex++;
            postInvalidate();
        }
    }

    public void setEcgData(float[] ecgData) {
        this.ecgData = ecgData;
        ecgDataMax = Float.MIN_VALUE;
        ecgDataMin = Float.MAX_VALUE;
        for (float datum : ecgData) {
            if (datum > ecgDataMax) {
                ecgDataMax = datum;
            }
            if (datum < ecgDataMin) {
                ecgDataMin = datum;
            }
        }
        invalidate();
    }

    public void setHorizontalCoordinateLength(int horizontalCoordinateLength) {
        this.horizontalCoordinateLength = horizontalCoordinateLength;
        invalidate();
    }

    public void setIsScrolling(boolean isScrolling) {
        this.isScrolling = isScrolling;
        invalidate();
    }
}

这段代码定义了一个名为 "EcgView" 的自定义视图。这个视图继承自 View 类，并重写了 onDraw() 方法来绘制心电图波形。

5. 在活动中使用自定义视图

在 "MainActivity.java" 文件中，添加以下代码：

package com.example.androiddynamicecg;

import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.SeekBar;

import androidx.appcompat.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity {

    private EcgView ecgView;
    private Button startStopButton;
    private SeekBar horizontalCoordinateLengthSeekBar;

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

        ecgView = findViewById(R.id.ecg_view);
        startStopButton = findViewById(R.id.start_stop_button);
        horizontalCoordinateLengthSeekBar = findViewById(R.id.horizontal_coordinate_length_seek_bar);

        // 生成模拟心电图数据
        float[] ecgData = new float[1000];
        for (int i = 0; i < ecgData.length; i++) {
            ecgData[i] = (float) Math.sin(2 * Math.PI * i / 100);
        }

        // 设置心电图数据
        ecgView.setEcgData(ecgData);

        //