Arduino Nano 33 IoT - TM1637 4-Digit 7-Segment Display

This guide shows you how to use the Arduino Nano 33 IoT with the TM1637 4-digit 7-segment display module. It explains these topics:

In this guide, we will use a 4-digit 7-segment display module with a colon in the middle. If you want to show numbers with decimals, please check the 74HC595 4-digit 7-segment Display Module tutorial.

Arduino Nano 33 IoT TM1637 4-Digit 7-Segment Display

Hardware Preparation

1×Arduino Nano 33 IoT
1×Micro USB Cable
1×TM1637 4-digit 7-segment Display
1×Breadboard
1×Jumper Wires
1×Optionally, 5V Power Adapter for Arduino Nano 33 IoT
1×Recommended: Screw Terminal Expansion Board for Arduino Nano
1×Recommended: Breakout Expansion Board for Arduino Nano
1×Recommended: Power Splitter for Arduino Nano

Or you can buy the following sensor kits:

1×DIYables Sensor Kit (30 sensors/displays)
1×DIYables Sensor Kit (18 sensors/displays)
Disclosure: Some of the links provided in this section are Amazon affiliate links. We may receive a commission for any purchases made through these links at no additional cost to you.
Additionally, some of these links are for products from our own brand, DIYables .

Overview of TM1637 4-digit 7-segment Display

A 4-digit 7-segment display is often used in clocks, timers, counters, and even to show temperature. Normally, you need 12 wires to connect it. The TM1637 module makes things simpler by only requiring 4 wires: 2 for power and 2 for controlling the display.

A TM1637 module usually has four seven-segment LED displays and one of these options:

  • A colon-shaped LED in the center: This is great for showing time in hours and minutes, minutes and seconds, or the scores of two teams.
  • Four dot-shaped LEDs for each number: These work well for showing temperatures or any number with decimal points.

The TM1637 4-Digit 7-Segment Display Pinout

The TM1637 module with a display that shows four digits has four pins:

  • CLK pin: This is a clock input pin. Connect it to any digital pin on the Arduino Nano 33 IoT.
  • DIO pin: This is a data input/output pin. Connect it to any digital pin on the Arduino Nano 33 IoT.
  • VCC pin: This pin supplies power to the module. Connect it to a 3.3V to 5V power source.
  • GND pin: This is a ground pin. Connect it to the ground on the Arduino Nano 33 IoT.
TM1637 module pinout

Wiring Diagram

To connect a TM1637 to an Arduino Nano 33 IoT, you need four wires—two for power and two to control the display. You can power the module using the Arduino's 5V output. Connect the CLK and DIO pins to any digital pins on the Arduino, for example, pins 2 and 3. If you use different pins, change the pin numbers in your code.

The wiring diagram between Arduino Nano and 33 IoT TM1637 Module

This image is created using Fritzing. Click to enlarge image

Library Installation

To easily program a TM1637 4-digit 7-segment Display, you need to install the TM1637 Display library by Avishay Orpaz. Follow the steps below to install the library.

  • Open the Library Manager by clicking the Library Manager icon on the left side of the Arduino IDE.
  • Type TM1637 in the search box, then select the TM1637Display library by Avishay Orpaz.
  • Click the Install button.
Arduino TM1637 4-digit 7-segment display library

How To Program For TM1637 4-digit 7-segment using Arduino Nano 33 IoT

  • Add the library
#include <TM1637Display.h>
  • Choose the Arduino Nano 33 IoT pins that connect to the display module’s CLK and DIO. For example, you might use pins D9 and D10.
#define CLK D9 // Arduino Nano 33 IoT pin D9 assigned to the clock line of the 7-segment display module #define DIO D10 // Arduino Nano 33 IoT pin D10 assigned to the data I/O line of the 7-segment display module
  • Make a new TM1637Display device.
TM1637Display display = TM1637Display(CLK, DIO);
  • Then you can show numbers, numbers with decimals, numbers with minus signs, or letters. For letters, you must say which style of letters to use. Let's look at each type one by one.
  • Showing numbers: look at the examples below. In the description, "_" represents a digit that is not actually shown.
display.showNumberDec(-12); // Output shows a blank digit then -12 display.showNumberDec(-999); // Output shows -999 exactly as provided display.showNumberDec(42); // Output shows two blanks followed by 42 display.showNumberDec(42, false); // Output shows two blanks followed by 42 (no zero-padding) display.showNumberDec(42, false, 2, 0); // Output shows 42 followed by two blanks (displaying 2 digits starting at position 0) display.showNumberDec(42, true); // Output shows 0042 with zero padding display.showNumberDec(14, false, 2, 1); // Output shows a blank, 14, then a blank (number displayed offset at position 1) display.showNumberDec(-5, false, 3, 0); // Output shows a blank, -5, then a blank (number centered in a 3-digit field starting at position 0) display.showNumberDec(1234); // Output shows 1234 exactly as provided
  • Display the number using a colon or a dot:
// Displays "15:30" on a module with colon separators, or "15.30" on one with dot separators display.showNumberDecEx(1530, 0b11100000, false, 4, 0);

At the end of this guide, you'll find more details about the functions.

Arduino Nano 33 IoT Code

/* * This Arduino Nano 33 IoT code was developed by newbiely.com * * This Arduino Nano 33 IoT code is made available for public use without any restriction * * For comprehensive instructions and wiring diagrams, please visit: * https://newbiely.com/tutorials/arduino-nano-iot/arduino-nano-33-iot-tm1637-4-digit-7-segment-display */ #include <TM1637Display.h> // define the connections pins #define CLK 9 // The Arduino Nano 33 IoT pin connected to the CLK pin of 7-segment module #define DIO 10 // The Arduino Nano 33 IoT pin connected to the DIO pin of 7-segment module // create a display object of type TM1637Display TM1637Display display = TM1637Display(CLK, DIO); // an array that sets individual segments per digit to display the word "dOnE" const uint8_t done[] = { SEG_B | SEG_C | SEG_D | SEG_E | SEG_G, // d SEG_A | SEG_B | SEG_C | SEG_D | SEG_E | SEG_F, // O SEG_C | SEG_E | SEG_G, // n SEG_A | SEG_D | SEG_E | SEG_F | SEG_G // E }; // degree celsius symbol const uint8_t celsius[] = { SEG_A | SEG_B | SEG_F | SEG_G, // Degree symbol SEG_A | SEG_D | SEG_E | SEG_F // C }; void setup() { display.clear(); display.setBrightness(7); // set the brightness to 7 (0:dimmest, 7:brightest) } void loop() { // show counter 0-9 int i; for (i = 0; i < 10; i++) { display.showNumberDec(i); delay(500); display.clear(); } display.showNumberDec(-91); // displayed _-91 delay(2000); display.clear(); display.showNumberDec(-109); // displayed -109 delay(2000); display.clear(); display.showNumberDec(21, false); // displayed __21 delay(2000); display.clear(); display.showNumberDec(21, true); // displayed 0021 delay(2000); display.clear(); display.showNumberDec(28, false, 2, 1); // displayed _28_ delay(2000); display.clear(); display.showNumberDec(-9, false, 3, 0); // displayed _-9_ delay(2000); display.clear(); // displayed 15:30 display.showNumberDecEx(1530, 0b11100000, false, 4, 0); delay(2000); display.clear(); // displayed 23°C int temperature = 23; // or read from temperature sensor display.showNumberDec(temperature, false, 2, 0); display.setSegments(celsius, 2, 2); delay(2000); display.clear(); // displayed letters: dOnE display.setSegments(done); delay(2000); display.clear(); }

Detailed Instructions

If you are new to the Arduino Nano 33 IoT, be sure to check out our Getting Started with Arduino Nano 33 IoT tutorial. Then, follow these steps:

  • Connect the components to the Arduino Nano 33 IoT board as depicted in the diagram.
  • Use a USB cable to connect the Arduino Nano 33 IoT board to your computer.
  • Launch the Arduino IDE on your computer.
  • Select the Arduino Nano 33 IoT board and choose its corresponding COM port.
  • Copy the code above and paste it into the Arduino IDE.
  • Compile and send the code to your Arduino Nano 33 IoT board by clicking the Upload button in the Arduino IDE.
Arduino IDE Upload Code
  • Take a look at the different ways the 7-segment display lights up.

Video Tutorial

Function References

Here are the sources for:

  • Display.clear(): Clear the display.
  • Display.showNumberDec(): Show a decimal number on the display.
  • Display.showNumberDecEx(): Show a decimal number on the display with extra options.
  • Display.setSegments(): Change the segments on the display.
  • Display.setBrightness(): Adjust the brightness of the display.

display.clear()

Description

This function clears the screen. It turns off all the LED lights.

display.showNumberDec()

Description

The 7-segment display shows a number in base ten. This function does that job.

Syntax

void showNumberDec(int num, bool leading_zero = false, uint8_t length = 4, uint8_t pos = 0);

Parameter

  • Num is the number that appears on the 7-segment display, and it can be any value between -9999 and 9999.
  • Leading_zero is an optional setting (it is false by default) that decides whether extra zeros are shown at the beginning of the number.
  • Length is another optional setting with a default of 4, which decides how many digits are displayed.
  • Pos is also an optional setting (default is 0) that determines where the most important digit (the leftmost digit) is placed.

Please note that the function won't show anything if the number is not in the allowed range or if the length is more than 4.

showNumberDecEx()

Description

This function is a more advanced version of showNumberDec() that gives you extra control when showing a decimal number on a 7-segment display. It lets you manage the dot or colon parts of each digit separately.

Syntax

void showNumberDecEx(int num, uint8_t dots, bool leading_zero = false, uint8_t length = 4, uint8_t pos = 0);

Parameter

  • Num1: This is the number that will show on the 7-segment display. It must be a value between -9999 and 9999.
  • Dots: This setting tells which dot parts of the display should light up. Each bit in the value represents one digit on the display. Possible values are:
  • 0b10000000 for the first dot (0.000)
  • 0b01000000 for the second dot (00.00) or the colon (00:00), based on the display type.
  • 0b00100000 for the third dot (000.0)
  • Leading_zero: This is an extra setting that is false by default. If you set it to true, zeros at the beginning will be shown.
  • Length: This is an extra setting that is 4 by default. It tells how many digits are shown on the 7-segment display.
  • Pos: This is an extra setting which is 0 by default. It sets the position of the most important digit in the number.

For instance, if you call display.showNumberDecEx(1530, 0b01000000), it will display:

  • If the module has a colon LED, the 7-segment display shows 15:30.
  • If the module has dot LEDs, the 7-segment display shows 15.30.

Please note that the function will not show anything if the number is not within the allowed range or if the length is more than 4.

setSegments()

Description

This function lets you choose directly which parts of a 7-segment display light up. You can use it to show letters, symbols, or turn off all the LED segments.

Syntax

void setSegments(const uint8_t segments[], uint8_t length = 4, uint8_t pos = 0);

Parameter

  • Segments: This parameter sets the parts of the 7-segment display. It is an array of bytes, where each byte represents one digit and each bit in that byte shows a specific segment.
  • Length: This optional parameter has a default value of 4. It tells how many digits to show on the 7-segment display.
  • Pos: This optional parameter has a default value of 0. It tells where the most important digit (the one on the left) is located.

This function is useful when you want to display letters or symbols that are not shown on a regular 7-segment display. You can create any design you want by controlling the segments directly.

Please note that the function won’t show anything if the number is not in the allowed range or if the length is more than 4.

setBrightness()

Description

You can change how bright the seven-segment display is using this function.

Syntax

void setBrightness(uint8_t brightness, bool on = true);

Parameter

  • Brightness: This setting changes how bright the 7-segment display is. The number must be between 0 and 7, and a larger number makes the display brighter.
  • On: This option, which is true by default, turns the display on or off. If it is set to false, the display will be turned off.

※ OUR MESSAGES

  • As freelancers, We are AVAILABLE for HIRE. See how to outsource your project to us
  • Please feel free to share the link of this tutorial. However, Please do not use our content on any other websites. We invested a lot of effort and time to create the content, please respect our work!