Tutorial: Real-time Android Heart Rate Monitor and Dashboard

3 min readSep 17, 2015

access to a patients vital parameters in real timeWhen it comes to patient healthcare monitoring, reliable and secure real-time data streaming is mission critical. With patient healthcare, having access to a patients vital parameters in real time makes a great deal of difference in providing timely and accurate services on-site or remotely.

In this tutorial, we’ll build a simple healthcare monitoring application for Android (on the patient side), and a monitoring real-time dashboard (on the caregiver’s side) for capturing health data and displaying it in real time. In this tutorial, our application will collect heart rate and stream the data from the Android phone in real time to our dashboard UI.

Android Healthcare Overview

In our Android application, the phone’s camera will be used to capture the heart rate. When the app user presses a finger against the camera, an image processing algorithm detects the red component on the finger image to sense the blood flow and then calculates a reading. The reading is averaged at the time span of one minute, and the heart rate is determined. Once we have the heart rate reading, the app streams the data in real time to a monitoring dashboard.

Note: this sample application is meant for educational and entertainment purposes, and should not be used for actual medical practice.

Resources

Note : The terms “pulse rate” and “heart rate” are used interchangeably across the tutorial and source code literature.

Here is the application in-action:

ezgif.com video

Android App Core Functionality

1. PubNub Initialization

At the start, the MainActivity on the Android app triggers PubNub initialization followed by doctor’s ID registration.

Users can key in a doctor’s ID to associate with a doctor’s profile for sending their healthcare data, in this case, the heart rate monitor.

The saveDoctorId( ) function takes the doctor id keyed in by the user and saves it in the application configuration.

A PubNub channel name is created based on this id by appending the string “heartbeat_alert” to this doctor id.

2. Monitoring

Once the doctor id is registered, the application switches to the HeartRateMonitor activity and initializes the callbacks for publishing the readings.

3. Heart Rate Sensing

The PreviewCallback( ) function does the background image processing on the camera image to sense the pulse rate.

The camera captures the frames for a duration of 10 seconds.  The algorithm within PreviewCallback( ) calculates the variation in the average RED color intensity in the frames captured, multiplies that value by six, to arrive at the approximate reading for beats per minute.

Once the reading is taken, it is published over PubNub using PubNub Data Streams to the real-time dashboard which live updates as new information comes through.

Building the Real-time Dashboard

Our real-time dashboard is subscribed to our Android application and receives the heart rate data in real time, then visualizes it.

Our’s looks like this:

healthcareportal

The UI for the real-time dashboard is built on top of Material Design and PubNub JavaScript SDK is used for subscribing and receiving the readings.

Initially, after launching the dashboard application, the user needs to key in the doctor id. The getDoctorId() function captures the id and initializes PubNub channel subscription for receiving published readings from the Android app.

Additionally , the dashboard user can retrieve the historical readings. This is done using the PubNub’s Storage & Playback (aka History API) feature.

Wrapping Up

That’s it! We’ve built a simple heart rate monitoring application for Android without using any external components. This app gives you a good idea of how to combine the functionality of an Android smartphone with real-time data streams for healthcare applications.

Because we show no bias when it comes to mobile operating systems, next week, we’ll release our tutorial building this application for iOS, so stay tuned!

More from PubNub

How to Create a Dating App: 7 Steps to Fit Any Design
Insights6 minMar 15, 2023

How to Create a Dating App: 7 Steps to Fit Any Design

There are common underlying technologies for a dating app, and in this post, we’ll talk about the major technologies and designs...

Michael Carroll

Michael Carroll

How to Create a Real-time Public Transportation Schedule App
Build6 minMar 14, 2023

How to Create a Real-time Public Transportation Schedule App

How to use geohashing, JavaScript, Google Maps API, and BART API to build a real-time public transit schedule app.

Michael Carroll

Michael Carroll

How to Create Real-Time Vehicle Location Tracking App
Build2 minMar 9, 2023

How to Create Real-Time Vehicle Location Tracking App

How to track and stream real-time vehicle location on a live-updating map using EON, JavaScript, and the Mapbox API.

Michael Carroll

Michael Carroll

Talk to an expert