11. Networking and Communications

Overview of week 11 assignment

1. Group assignment
   1. send a message between two projects
2. Individual assignment
   1. design, build, and connect wired or wireless node(s) with network or bus addresses and local input &/or output device(s)

1. Group assignment

For more information, see the Week 11: Group assignment page.

2. Individual assignment

A. I2C vs. CAN

I am interested in CAN protocol (controller area network bus) since I work in the construction machinery industry. In the class, I learned the basics of I2C, so decided to compare the two communication standards.

• Both I²C and CAN both use two wires to communicate and can connect multiple devices on the same bus. Each device or message has an identifier to keep things organized. They send data one bit at a time (serial communication).
• I²C (or I2C, IIC) uses single-ended signaling (relative to ground), making it more vulnerable to noise — any voltage spike can be misinterpreted as data.
• CAN, on the other hand, uses differential signaling (CAN_H - CAN_L), which cancels out noise that affects both wires equally. This makes CAN highly reliable in electrically noisy environments like vehicles or industrial systems.

Feature	I²C	CAN
Shared Bus	Yes (SDA + SCL)	Yes (CAN_H + CAN_L)
Multi-Device Support	Yes (master-slave)	Yes (multi-master)
Message Identification	7/10-bit device address	11/29-bit message ID
Serial Communication	Yes	Yes
Low Power	Yes	Yes
Signal Type	Single-ended (vs. GND)	Differential (CAN_H - CAN_L)
Typical Speed	100 kbps – 3.4 Mbps	125 kbps – 1 Mbps (CAN FD: up to 8 Mbps)
Max Cable Length	~1–10 m depending on speed	~40–500 m depending on speed
Error Handling	Basic ACK/NACK	CRC, ACK, retransmit, error counters
Arbitration	Master-slave	Priority-based arbitration
Termination Required	No	Yes (120Ω at both ends)
Noise Immunity	Low	Very High
Typical Use Case	On-board sensors, EEPROMs, displays	Automotives, robotics, industrial systems

Ref.

• CAN Bus Explained - A Simple Intro (YouTube)
• What is CAN? | KEYENCE (Japanese)
• CAN bus (Wikipedia)

---

B. OLED display using I2C

I tried using Monochrome 1.3" 128x64 SH1106G SPI OLED Monochrome Display, which uses I2C communication.

a. Specification

Specification	1.3" 128x64 OLED
Display size	1.3" (34.5 x 35.0mm)
Communication protocol	I2C
Voltage	3.3V-5V
Driver	SH1106
Number of pixels	128 x 64
Pixel Pitch	0.23 × 0.23(mm)
Pixel Size	0.21 × 0.21(mm)

The I2C address can be determined by checking the notes on the back. The I2C address will be different depending on whether 0x7A or 0x78 is connected. In this case, it says 0x78 so I2C address is 0x3C.

Connection	0x7A	0x78
I2C adress	0x3A	0x3C

b. Wiring

OLED pins	RP2040
GND	GND
VCC	5V
SCL	SCL (GP7)
SDA	SDA (GP6)

c. Programing

I first used a sample program provided by Adafruit.
File > Examples > Adafruit SH110X > OLED_QTPY_SH1106 > SH1106_128x64_i2c_QTPY

I checked that the I2C address #define SCREEN_ADDRESS 0x3C

Arduino code

/**************************************************************************
 This is an example for our Monochrome OLEDs based on SSD1306 drivers

 Pick one up today in the adafruit shop!
 ------> http://www.adafruit.com/category/63_98

 This example is for a 128x64 pixel display using I2C to communicate
 3 pins are required to interface (two I2C and one reset).

 Adafruit invests time and resources providing this open
 source code, please support Adafruit and open-source
 hardware by purchasing products from Adafruit!

 Written by Limor Fried/Ladyada for Adafruit Industries,
 with contributions from the open source community.
 BSD license, check license.txt for more information
 All text above, and the splash screen below must be
 included in any redistribution.
 **************************************************************************/

#include <SPI.h>
#include <Wire.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>

#define SCREEN_WIDTH 128 // OLED display width, in pixels
#define SCREEN_HEIGHT 64 // OLED display height, in pixels

// Declaration for an SSD1306 display connected to I2C (SDA, SCL pins)
// The pins for I2C are defined by the Wire-library. 
// On an arduino UNO:       A4(SDA), A5(SCL)
// On an arduino MEGA 2560: 20(SDA), 21(SCL)
// On an arduino LEONARDO:   2(SDA),  3(SCL), ...
#define OLED_RESET     -1 // Reset pin # (or -1 if sharing Arduino reset pin)
#define SCREEN_ADDRESS 0x3C ///< See datasheet for Address; 0x3D for 128x64, 0x3C for 128x32
Adafruit_SSD1306 display(SCREEN_WIDTH, SCREEN_HEIGHT, &Wire, OLED_RESET);

#define NUMFLAKES     10 // Number of snowflakes in the animation example

#define LOGO_HEIGHT   16
#define LOGO_WIDTH    16
static const unsigned char PROGMEM logo_bmp[] =
{ 0b00000000, 0b11000000,
  0b00000001, 0b11000000,
  0b00000001, 0b11000000,
  0b00000011, 0b11100000,
  0b11110011, 0b11100000,
  0b11111110, 0b11111000,
  0b01111110, 0b11111111,
  0b00110011, 0b10011111,
  0b00011111, 0b11111100,
  0b00001101, 0b01110000,
  0b00011011, 0b10100000,
  0b00111111, 0b11100000,
  0b00111111, 0b11110000,
  0b01111100, 0b11110000,
  0b01110000, 0b01110000,
  0b00000000, 0b00110000 };

void setup() {
  Serial.begin(9600);

  // SSD1306_SWITCHCAPVCC = generate display voltage from 3.3V internally
  if(!display.begin(SSD1306_SWITCHCAPVCC, SCREEN_ADDRESS)) {
    Serial.println(F("SSD1306 allocation failed"));
    for(;;); // Don't proceed, loop forever
  }

  // Show initial display buffer contents on the screen --
  // the library initializes this with an Adafruit splash screen.
  display.display();
  delay(2000); // Pause for 2 seconds

  // Clear the buffer
  display.clearDisplay();

  // Draw a single pixel in white
  display.drawPixel(10, 10, SSD1306_WHITE);

  // Show the display buffer on the screen. You MUST call display() after
  // drawing commands to make them visible on screen!
  display.display();
  delay(2000);
  // display.display() is NOT necessary after every single drawing command,
  // unless that's what you want...rather, you can batch up a bunch of
  // drawing operations and then update the screen all at once by calling
  // display.display(). These examples demonstrate both approaches...

  testdrawline();      // Draw many lines

  testdrawrect();      // Draw rectangles (outlines)

  testfillrect();      // Draw rectangles (filled)

  testdrawcircle();    // Draw circles (outlines)

  testfillcircle();    // Draw circles (filled)

  testdrawroundrect(); // Draw rounded rectangles (outlines)

  testfillroundrect(); // Draw rounded rectangles (filled)

  testdrawtriangle();  // Draw triangles (outlines)

  testfilltriangle();  // Draw triangles (filled)

  testdrawchar();      // Draw characters of the default font

  testdrawstyles();    // Draw 'stylized' characters

  testscrolltext();    // Draw scrolling text

  testdrawbitmap();    // Draw a small bitmap image

  // Invert and restore display, pausing in-between
  display.invertDisplay(true);
  delay(1000);
  display.invertDisplay(false);
  delay(1000);

  testanimate(logo_bmp, LOGO_WIDTH, LOGO_HEIGHT); // Animate bitmaps
}

void loop() {
}

void testdrawline() {
  int16_t i;

  display.clearDisplay(); // Clear display buffer

  for(i=0; i<display.width(); i+=4) {
    display.drawLine(0, 0, i, display.height()-1, SSD1306_WHITE);
    display.display(); // Update screen with each newly-drawn line
    delay(1);
  }
  for(i=0; i<display.height(); i+=4) {
    display.drawLine(0, 0, display.width()-1, i, SSD1306_WHITE);
    display.display();
    delay(1);
  }
  delay(250);

  display.clearDisplay();

  for(i=0; i<display.width(); i+=4) {
    display.drawLine(0, display.height()-1, i, 0, SSD1306_WHITE);
    display.display();
    delay(1);
  }
  for(i=display.height()-1; i>=0; i-=4) {
    display.drawLine(0, display.height()-1, display.width()-1, i, SSD1306_WHITE);
    display.display();
    delay(1);
  }
  delay(250);

  display.clearDisplay();

  for(i=display.width()-1; i>=0; i-=4) {
    display.drawLine(display.width()-1, display.height()-1, i, 0, SSD1306_WHITE);
    display.display();
    delay(1);
  }
  for(i=display.height()-1; i>=0; i-=4) {
    display.drawLine(display.width()-1, display.height()-1, 0, i, SSD1306_WHITE);
    display.display();
    delay(1);
  }
  delay(250);

  display.clearDisplay();

  for(i=0; i<display.height(); i+=4) {
    display.drawLine(display.width()-1, 0, 0, i, SSD1306_WHITE);
    display.display();
    delay(1);
  }
  for(i=0; i<display.width(); i+=4) {
    display.drawLine(display.width()-1, 0, i, display.height()-1, SSD1306_WHITE);
    display.display();
    delay(1);
  }

  delay(2000); // Pause for 2 seconds
}

void testdrawrect(void) {
  display.clearDisplay();

  for(int16_t i=0; i<display.height()/2; i+=2) {
    display.drawRect(i, i, display.width()-2*i, display.height()-2*i, SSD1306_WHITE);
    display.display(); // Update screen with each newly-drawn rectangle
    delay(1);
  }

  delay(2000);
}

void testfillrect(void) {
  display.clearDisplay();

  for(int16_t i=0; i<display.height()/2; i+=3) {
    // The INVERSE color is used so rectangles alternate white/black
    display.fillRect(i, i, display.width()-i*2, display.height()-i*2, SSD1306_INVERSE);
    display.display(); // Update screen with each newly-drawn rectangle
    delay(1);
  }

  delay(2000);
}

void testdrawcircle(void) {
  display.clearDisplay();

  for(int16_t i=0; i<max(display.width(),display.height())/2; i+=2) {
    display.drawCircle(display.width()/2, display.height()/2, i, SSD1306_WHITE);
    display.display();
    delay(1);
  }

  delay(2000);
}

void testfillcircle(void) {
  display.clearDisplay();

  for(int16_t i=max(display.width(),display.height())/2; i>0; i-=3) {
    // The INVERSE color is used so circles alternate white/black
    display.fillCircle(display.width() / 2, display.height() / 2, i, SSD1306_INVERSE);
    display.display(); // Update screen with each newly-drawn circle
    delay(1);
  }

  delay(2000);
}

void testdrawroundrect(void) {
  display.clearDisplay();

  for(int16_t i=0; i<display.height()/2-2; i+=2) {
    display.drawRoundRect(i, i, display.width()-2*i, display.height()-2*i,
      display.height()/4, SSD1306_WHITE);
    display.display();
    delay(1);
  }

  delay(2000);
}

void testfillroundrect(void) {
  display.clearDisplay();

  for(int16_t i=0; i<display.height()/2-2; i+=2) {
    // The INVERSE color is used so round-rects alternate white/black
    display.fillRoundRect(i, i, display.width()-2*i, display.height()-2*i,
      display.height()/4, SSD1306_INVERSE);
    display.display();
    delay(1);
  }

  delay(2000);
}

void testdrawtriangle(void) {
  display.clearDisplay();

  for(int16_t i=0; i<max(display.width(),display.height())/2; i+=5) {
    display.drawTriangle(
      display.width()/2  , display.height()/2-i,
      display.width()/2-i, display.height()/2+i,
      display.width()/2+i, display.height()/2+i, SSD1306_WHITE);
    display.display();
    delay(1);
  }

  delay(2000);
}

void testfilltriangle(void) {
  display.clearDisplay();

  for(int16_t i=max(display.width(),display.height())/2; i>0; i-=5) {
    // The INVERSE color is used so triangles alternate white/black
    display.fillTriangle(
      display.width()/2  , display.height()/2-i,
      display.width()/2-i, display.height()/2+i,
      display.width()/2+i, display.height()/2+i, SSD1306_INVERSE);
    display.display();
    delay(1);
  }

  delay(2000);
}

void testdrawchar(void) {
  display.clearDisplay();

  display.setTextSize(1);      // Normal 1:1 pixel scale
  display.setTextColor(SSD1306_WHITE); // Draw white text
  display.setCursor(0, 0);     // Start at top-left corner
  display.cp437(true);         // Use full 256 char 'Code Page 437' font

  // Not all the characters will fit on the display. This is normal.
  // Library will draw what it can and the rest will be clipped.
  for(int16_t i=0; i<256; i++) {
    if(i == '\n') display.write(' ');
    else          display.write(i);
  }

  display.display();
  delay(2000);
}

void testdrawstyles(void) {
  display.clearDisplay();

  display.setTextSize(1);             // Normal 1:1 pixel scale
  display.setTextColor(SSD1306_WHITE);        // Draw white text
  display.setCursor(0,0);             // Start at top-left corner
  display.println(F("Hello, world!"));

  display.setTextColor(SSD1306_BLACK, SSD1306_WHITE); // Draw 'inverse' text
  display.println(3.141592);

  display.setTextSize(2);             // Draw 2X-scale text
  display.setTextColor(SSD1306_WHITE);
  display.print(F("0x")); display.println(0xDEADBEEF, HEX);

  display.display();
  delay(2000);
}

void testscrolltext(void) {
  display.clearDisplay();

  display.setTextSize(2); // Draw 2X-scale text
  display.setTextColor(SSD1306_WHITE);
  display.setCursor(10, 0);
  display.println(F("scroll"));
  display.display();      // Show initial text
  delay(100);

  // Scroll in various directions, pausing in-between:
  display.startscrollright(0x00, 0x0F);
  delay(2000);
  display.stopscroll();
  delay(1000);
  display.startscrollleft(0x00, 0x0F);
  delay(2000);
  display.stopscroll();
  delay(1000);
  display.startscrolldiagright(0x00, 0x07);
  delay(2000);
  display.startscrolldiagleft(0x00, 0x07);
  delay(2000);
  display.stopscroll();
  delay(1000);
}

void testdrawbitmap(void) {
  display.clearDisplay();

  display.drawBitmap(
    (display.width()  - LOGO_WIDTH ) / 2,
    (display.height() - LOGO_HEIGHT) / 2,
    logo_bmp, LOGO_WIDTH, LOGO_HEIGHT, 1);
  display.display();
  delay(1000);
}

#define XPOS   0 // Indexes into the 'icons' array in function below
#define YPOS   1
#define DELTAY 2

void testanimate(const uint8_t *bitmap, uint8_t w, uint8_t h) {
  int8_t f, icons[NUMFLAKES][3];

  // Initialize 'snowflake' positions
  for(f=0; f< NUMFLAKES; f++) {
    icons[f][XPOS]   = random(1 - LOGO_WIDTH, display.width());
    icons[f][YPOS]   = -LOGO_HEIGHT;
    icons[f][DELTAY] = random(1, 6);
    Serial.print(F("x: "));
    Serial.print(icons[f][XPOS], DEC);
    Serial.print(F(" y: "));
    Serial.print(icons[f][YPOS], DEC);
    Serial.print(F(" dy: "));
    Serial.println(icons[f][DELTAY], DEC);
  }

  for(;;) { // Loop forever...
    display.clearDisplay(); // Clear the display buffer

    // Draw each snowflake:
    for(f=0; f< NUMFLAKES; f++) {
      display.drawBitmap(icons[f][XPOS], icons[f][YPOS], bitmap, w, h, SSD1306_WHITE);
    }

    display.display(); // Show the display buffer on the screen
    delay(200);        // Pause for 1/10 second

    // Then update coordinates of each flake...
    for(f=0; f< NUMFLAKES; f++) {
      icons[f][YPOS] += icons[f][DELTAY];
      // If snowflake is off the bottom of the screen...
      if (icons[f][YPOS] >= display.height()) {
        // Reinitialize to a random position, just off the top
        icons[f][XPOS]   = random(1 - LOGO_WIDTH, display.width());
        icons[f][YPOS]   = -LOGO_HEIGHT;
        icons[f][DELTAY] = random(1, 6);
      }
    }
  }
}

d. Test

Check components carefully!

At first, I mistakenly thought this display was an SSD1306, not SH1106 and uploaded the code. As a result, only a few rows of pixels near the top of the screen worked properly. The other rows display noise.

Ref.: I tried using a small OLED display SH1106 (1.3 inch) with Raspberry Pi Pico (Japanese)

• Pixel number refers to how many pixels are actually shown on the screen, whereas Memory size refers to how much display RAM the controller has.
• SH1106 has 132×64 memory, but only 128×64 are visible.
• SSD1306 starts writing at column 0, but SH1106's visible area starts at column 2. This causes horizontal misalignment — text shifts or cuts off.
• The SSD1306 library doesn’t account for the extra 4 columns, so data may overflow into hidden or unused memory. As more lines are drawn, the mismatch causes incorrect page addressing, leading to garbled or noisy lower rows. As a result, top few lines may partially align, but the rest become distorted.

Worked!

---

e. Customization

I then implemented a custom UI on the OLED display with animation, to better understand the program.

1. Text Animation: The text moves from right to left across the screen.
2. Rectangle Animation: Two rectangles move from left to right at different speeds.

#include <Wire.h>  // Include the Wire library for I2C communication.
#include <U8g2lib.h>  // Include the U8g2 library for controlling graphical displays like SH1106.

int xPosText = 128;  // Initial horizontal position for the text
int xPosRect = 0;    // Initial horizontal position for the rectangles

// SH1106 128x64 I2C constructor
U8G2_SH1106_128X64_NONAME_F_HW_I2C u8g2(U8G2_R0, /* reset=*/ U8X8_PIN_NONE);

void setup() {
  u8g2.begin();  // Initialize the display
}

void loop() {
  u8g2.clearBuffer();  // Clear the display buffer for the new frame

  // Draw the moving text
  u8g2.setFont(u8g2_font_10x20_tr);  // Set the font for the text
  u8g2.drawStr(xPosText, 38, "Konnichiwa, SH1106!");  // Draw the text at the current x position
  int textWidth = u8g2.getStrWidth("Konnichiwa, SH1106!");  // Get the width of the text

  // Draw moving rectangles
  u8g2.drawBox(xPosRect, 20, 32, 2);  // Rectangle 1 at (xPosRect, 20)
  u8g2.drawBox(xPosRect, 40, 64, 2);  // Rectangle 2 at (128 - xPosRect, 40)

  u8g2.sendBuffer();  // Send the buffer to the display

  // Move the text to the left
  xPosText--;
  if (xPosText < -textWidth) {  // When the text moves past the left edge, reset its position
    xPosText = 128;
  }

  // Move the rectangles horizontally
  xPosRect += 10;
  if (xPosRect > 128) {  // Reset the rectangle position when it goes off the right edge
    xPosRect = -64;
  }

  delay(10);  // Control the animation speed
}

---

C. CAN

I wanted to try using the CAN standard for in-vehicle electronics components, and it seems like I can do it with a microcontroller such as the XIAO RP2040, using a CAN controller and receiver like the one below.

• In-vehicle electronic components (switches, levers etc.)
• MCP2515 CAN Controller + TJA1050 CAN Transceiver
• Termination resistors (120Ω)
• CAN wiring (twisted pair: CAN_H and CAN_L)
• Power supply (3.3V or 5V)

I ran out of time so far.

3. Files

No files this week, code in the text.

Afterthoughts

• CAN can communicate more reliably than I2C.
• Worth exploring effective UI for tiny displays (Rabbit hole alert!)