Cover image for Day 6: This multi-blog post, processing

Day 6: This multi-blog post, processing

whykay profile image whykay 👩đŸģ‍đŸ’ģ🐈đŸŗī¸â€đŸŒˆ (she/her) ãƒģ2 min read

Ok, before I dropped off to sleep, I found the following article which is pretty much what I need to connect arduino to processing and have them sending data between them.

ℹī¸ https://learn.sparkfun.com/tutorials/connecting-arduino-to-processing/all
  • board -> processing : data from accelerometer
  • processing -> board : bitmap image generated from accelerometer data

So that's today's goal, at least get processing picking up data from accelerator.

Before that happens, a little side-track

I wanted to see if I can get the accelerometer data in m/s instead of the raw data, and print it to the TFT.

Here's the bit of code that retrieves the data in m/s^2


I set the background of TFT to be black (ST77XX_BLACK).

Now when I write to the TFT, the text just writes on top of each other makine a mess after awhile. Did a little search on refreshing text on TFT, and all I needed to do was print the text with its text colour plus the background colour (in this case is black).

tft.setTextColor(color, ST77XX_BLACK);

Saved, compiled and uploaded the code and that did the trick.

Also played around setting the text size, if you are curious, this is what I used:


Now I have my data in m/s, let's get processing talking to it

I'm going to initially send over the X value.

Created my processing code and got this exception

RuntimeException: Error opening serial port /dev/cu.usbmodem14101: Port busy


Over lunch I asked Mick that I couldn't connect to the serial port via Processing. He mentioned if I closed my Arduino IDE. đŸ˜ŗ

Yep, very DOH! moment there.

So after lunch I closed Arduino IDE, modified the code on Processing a little and lo and behold... it worked!

Alt Text

Ok, I can read text, I want to read values now.

Before I do that, I'm ditching my PyProcessing code from before and changing to pure Processing now.

So do the same thing (easily replicated from the official tutorial docs drawing the grayscale image), and I wanted to save() the image as bitmap and exit() the programme, which was all fine.

Now I was looking at drawing simple shapes and lines, and have it randomised (colours between 0 and 255) and the X/Y co-ordinates in-between 240x240.

After a bit of reading through shapes and PShapes, I stuck with primative shapes, I wanted lines and various sized ellipses in various colours generated before the time lapses and gets saved to a bitmap file.

Here's a sample of the generated bitmap from Processing:

Alt Text

Posted on by:

whykay profile

whykay 👩đŸģ‍đŸ’ģ🐈đŸŗī¸â€đŸŒˆ (she/her)


Volunteer: Coder, tech event organiser, mentor, advocates diversity in tech | Working as Maker Advocate


markdown guide