Displaying Numbers

The Color OLED module is a great way to display the data received from a sensor, such as the PING))) Ultrasonic Distance Sensor, or sensor or the Memsic Dual-Axis Accelerometer. 

You can use the OLED print number block to send a number value to the Color OLED. This block can hold a number value, or a variable, or any expression that resolves as a number. It can display values as decimal, hexadecimal, or binary numbers.

 

Example Code - Counting Down

The example project uses a repeat item loop to display a value as it counts down from 100 to 1, updating the display once per second.

  • In BlocklykProp Solo, make a new project for your board.
  • Build the program shown below:

  • Save the program, and then click the Run once button.

Your display should behave like the animated .gif below, which shows the first few iterations of the repeat item loop.  You may notice that right away that something doesn’t look right!

 

How it Works - and Doesn't!

After initializing the display, the OLED font color block sets the font to white, and the font background to black. This will let each number overwrite the previous number instead of overlapping them.

Next, the loop repeat item from 100 to 0 by 1 sets up our countdown. It starts off by setting the cursor to position 0,0 each time through the loop so each number will display in the upper left corner. The OLED print number block  prints the current value of item each time through the loop. The pause 1000 block slows down the loop so it updates the display once per second.

So what is going wrong? The first time through the loop, item equals 100, and so the program prints “100” to the screen.  Then, on the next trip through the loop when item is reduced by one and it prints “99” to the screen, the last “0” in the original “100” doesn’t get written over. So instead of 99, we see 990, then 980, and so forth.  Eventually it counts down to display 100 again!

 

Did You Know?

Numbers are text too - From the program above, you can see that the OLED font color block works with the OLED print number block, just the same way it does with the OLED print text block. Likewise, the OLED text size block works with the OLED print number block.  So, as long the extra fonts are installed in uppper EEPROM, you can display your project's sensor values in large purple balloon numbers if that's what you want!

Try This

Now, let's fix the problem in the test code that seems to count down from 100 to 990 to 100 again!  How do you fix this?  Print a few spaces after the number each time you update it.  In fact, a good practice to follow is add enough spaces for your smallest possible number to cover up your largest possible number.

  • Add an OLED print text block containing two space characters, just below the OLED print number block:

  • Save the project and re-run it.
  • Watch it count down. The two extra space characters, printed with the black font background, should now overwrite the leftover numbers as the value printed reduces from 3 digits, to 2 digits, to 1 digit.

 

Your Turn

Here is a challenge that combines what you have learned so far.

  • Save a copy of your Try This project.
  • Add the label "Decimal" for the value displayed.
  • Expand the code to display the value in hexadecimal and binary, labeled.