Custom characters on LCD in Arduino - Step-by-Step Execution

Concept Flow - Custom characters on LCD

Define 8-byte pattern array

↓

Create custom char in LCD memory

↓

Set cursor position on LCD

↓

Write custom char to LCD

↓

Display

The program defines a pattern for a custom character, loads it into the LCD's memory, sets the cursor, and then displays the custom character on the screen.

Execution Sample

Arduino

byte smiley[8] = {
  0b00000,
  0b01010,
  0b00000,
  0b00000,
  0b10001,
  0b01110,
  0b00000,
  0b00000
};

lcd.createChar(0, smiley);
lcd.setCursor(0, 0);
lcd.write(byte(0));

This code defines a smiley face pattern, loads it as custom char 0, moves cursor to top-left, and displays the smiley.

Execution Table

Step	Action	Variable/Function	Value/Effect	LCD State
1	Define custom char pattern	smiley	[0,10,0,0,17,14,0,0]	No change
2	Load custom char into LCD	lcd.createChar(0, smiley)	Custom char 0 stored	Custom char 0 memory updated
3	Set cursor position	lcd.setCursor(0, 0)	Cursor at col 0, row 0	Cursor moved
4	Write custom char	lcd.write(byte(0))	Displays custom char 0	Smiley shown at (0,0)
5	End	-	-	Program waits for next commands

💡 All steps completed, custom character displayed on LCD at position (0,0).

Variable Tracker

Variable	Start	After Step 1	After Step 2	After Step 3	After Step 4	Final
smiley	undefined	[0,10,0,0,17,14,0,0]	[0,10,0,0,17,14,0,0]	[0,10,0,0,17,14,0,0]	[0,10,0,0,17,14,0,0]	[0,10,0,0,17,14,0,0]
lcd custom char 0	empty	empty	loaded with smiley pattern	loaded with smiley pattern	loaded with smiley pattern	loaded with smiley pattern
cursor position	undefined	undefined	undefined	(0,0)	(0,0)	(0,0)
LCD display	blank	blank	blank	blank	smiley at (0,0)	smiley at (0,0)

Key Moments - 3 Insights

Why do we use lcd.createChar before lcd.write?

lcd.createChar loads the pattern into LCD memory so lcd.write can display it; without loading, lcd.write won't show the custom shape (see steps 2 and 4 in execution_table).

What does the byte array represent?

Each byte in the array defines one row of the 5x8 pixel character; bits set to 1 light pixels, 0 leave them off (step 1 in execution_table).

Why do we use byte(0) in lcd.write?

byte(0) tells lcd.write to display the custom character stored at position 0 in LCD memory (step 4 in execution_table).

Visual Quiz - 3 Questions

Look at the execution_table, what is the cursor position after step 3?

A (0,0)

B (1,0)

C (0,1)

D undefined

💡 Hint

Check the 'cursor position' value in variable_tracker after step 3.

At which step is the custom character pattern loaded into LCD memory?

A Step 3

B Step 1

C Step 2

D Step 4

💡 Hint

Look at the 'Action' column in execution_table for loading custom char.

If we change lcd.write(byte(0)) to lcd.write(byte(1)), what happens?

A Displays the smiley again

B Displays a different custom char if defined at 1

C Displays nothing

D Causes an error

💡 Hint

Custom chars are stored at positions 0-7; writing byte(1) shows char at position 1 if created.

Concept Snapshot

Custom characters on LCD:
- Define 8-byte array for 5x8 pixel pattern
- Use lcd.createChar(index, pattern) to load
- Set cursor with lcd.setCursor(col, row)
- Display with lcd.write(byte(index))
- LCD supports up to 8 custom chars (0-7)

Full Transcript

This example shows how to create and display a custom character on an LCD using Arduino. First, we define a byte array representing the pixel pattern of the character. Then, we load this pattern into the LCD's memory at a specific index using lcd.createChar. Next, we set the cursor position where we want to display the character. Finally, we write the custom character to the LCD using lcd.write with the index. The execution table traces each step, showing variable states and LCD changes. Key moments clarify why loading the character before writing is necessary, what the byte array means, and why we use byte(0) in lcd.write. The visual quiz tests understanding of cursor position, loading step, and what happens if we write a different custom char index. The snapshot summarizes the process in a quick reference format.

Practice

1. What is the main purpose of using createChar() in Arduino LCD programming?

easy

A. To clear the LCD screen

B. To define a custom character pattern for the LCD

C. To set the cursor position on the LCD

D. To print a string on the LCD

Solution

1. Step 1: Understand the function of createChar()

   This function is used to define a new character pattern by specifying pixel rows for the LCD.

2. Step 2: Compare with other LCD functions

   Functions like clearing the screen, setting cursor, or printing strings are different and not related to defining custom characters.

3. Final Answer:

   To define a custom character pattern for the LCD -> Option B

4. Quick Check:

   createChar() defines custom characters [OK]

Hint: Remember: createChar defines, write displays [OK]

Common Mistakes:

• Confusing createChar with print or clear functions
• Thinking createChar moves the cursor
• Assuming createChar prints text directly

2. Which of the following is the correct way to declare a custom character array for createChar()?

easy

A. byte smiley[8] = {0, 10, 0, 0, 17, 14, 0, 0};

B. int smiley[8] = {0, 10, 0, 0, 17, 14, 0, 0};

C. char smiley[5] = {0, 10, 0, 0, 17};

D. byte smiley[7] = {0, 10, 0, 0, 17, 14, 0};

Solution

1. Step 1: Check data type and array size

   Custom characters require 8 bytes (one for each row) and use the byte type for pixel data.

2. Step 2: Validate array length and type

   byte smiley[8] = {0, 10, 0, 0, 17, 14, 0, 0}; uses byte type and 8 elements, matching the LCD custom character format.

3. Final Answer:

   byte smiley[8] = {0, 10, 0, 0, 17, 14, 0, 0}; -> Option A

4. Quick Check:

   8 bytes array with byte type = correct declaration [OK]

Hint: Custom chars need 8 bytes, not int or fewer elements [OK]

Common Mistakes:

• Using int instead of byte
• Using fewer than 8 elements
• Using char type which is signed and may cause issues

3. What will be the output on the LCD after running this code snippet?

byte heart[8] = {0,10,31,31,31,14,4,0};
lcd.createChar(0, heart);
lcd.setCursor(0,0);
lcd.write(byte(0));

medium

A. The LCD prints the number 0

B. The LCD shows a blank space

C. The code causes a compile error

D. A heart-shaped custom character appears at the top-left corner

Solution

1. Step 1: Understand createChar and write usage

   The code defines a heart pattern, stores it at position 0, then writes character 0 at cursor (0,0).

2. Step 2: Predict LCD output

   Writing byte(0) displays the custom character stored at position 0, which is the heart shape.

3. Final Answer:

   A heart-shaped custom character appears at the top-left corner -> Option D

4. Quick Check:

   createChar + write(byte(0)) = custom char display [OK]

Hint: write(byte(0)) prints custom char stored at 0 [OK]

Common Mistakes:

• Expecting numeric 0 to print
• Forgetting to use byte() cast in write()
• Assuming createChar prints automatically

4. Identify the error in this code snippet for displaying a custom character:

byte star[8] = {4,14,21,4,4,0,4,0};
lcd.createChar(1, star);
lcd.setCursor(0,0);
lcd.write(1);

medium

A. Missing byte cast in lcd.write(1)

B. Array size is incorrect

C. createChar index must be 0, not 1

D. setCursor parameters are invalid

Solution

1. Step 1: Check usage of lcd.write()

   When writing a custom character, the index must be cast to byte, so lcd.write(byte(1)) is correct.

2. Step 2: Verify other parts

   Array size is 8, createChar index 1 is valid (0-7), setCursor(0,0) is valid.

3. Final Answer:

   Missing byte cast in lcd.write(1) -> Option A

4. Quick Check:

   Use byte() cast in write() for custom chars [OK]

Hint: Always cast index with byte() in lcd.write() [OK]

Common Mistakes:

• Not casting index to byte in lcd.write()
• Thinking createChar index must be zero
• Assuming setCursor(0,0) is invalid

5. You want to display two different custom characters side by side on the LCD. Which sequence correctly creates and displays them?

hard

A. Define two byte arrays, use createChar(1, char1) and createChar(2, char2), then write(1) and write(2).

B. Define one byte array with 16 elements, use createChar(0, array), then write(0) twice.

C. Define two byte arrays, use createChar(0, char1) and createChar(1, char2), then write(byte(0)) and write(byte(1)) in order.

D. Use createChar(0, char1) twice, then write(0) and write(1).

Solution

1. Step 1: Understand createChar indexing

   Custom characters are stored in slots 0 to 7. To display two different chars, use two slots, e.g., 0 and 1.

2. Step 2: Display characters correctly

   Use write(byte(0)) and write(byte(1)) to print the two custom characters side by side.

3. Final Answer:

   Define two byte arrays, use createChar(0, char1) and createChar(1, char2), then write(byte(0)) and write(byte(1)) in order. -> Option C

4. Quick Check:

   Two createChar slots + write(byte(index)) = display two chars [OK]

Hint: Use slots 0 and 1, write with byte() cast [OK]

Common Mistakes:

• Trying to store both chars in one array
• Using invalid createChar indexes like 2 or higher without checking
• Not casting index to byte in write()