Custom Display Clear

MicroPython has a simple built-in command to clear the display: display.clear(). The results are equally simple - it instantly turns off every LED on the display. We don't need to be limited to such a simplistic way of clearing the screen though, we can write our own exciting fades, wipes and dissolves.

The program code below demonstrates a few different ways of clearing the screen. Press A to try each one in turn. Pressing B will cycle through a few different images so you can see how the clear looks with different source images. Each clear is written in it's own function, so hopefully you should be able to understand them without too much trouble. Try to use these as a basis for your own custom clear functions.

"""
 Custom Display Clear

 Demonstrate some different ways of clearing the micro:bit display. Pressing A will cycle through 
 the different methods. Pressing B will change the image to be cleared.

 This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 
 International License. https://creativecommons.org/licenses/by-nc-sa/4.0/
"""


from microbit import *
import random


def clear_fade():
    """
    Fade the display out
    """
    # We need to do nine complete passes to ensure that everything is faded to 0
    for i in range(9):
        # Go through all pixels on the display
        for x in range(5):
            for y in range(5):
                # Get current pixel value
                value = display.get_pixel(x, y)
                # Fade it if it's not already 0
                display.set_pixel(x, y, max(value - 1, 0))
        # Slow down the fade
        sleep(100)


def clear_wipe_down():
    """
    Wipe the image clear from top to bottom
    """
    # Go through each line
    for y in range(5):
        # Set the entire line to 0
        for x in range(5):
            display.set_pixel(x, y, 0)
        # Slow down the wipe
        sleep(250)


def clear_slide_down():
    """
    Slide the image off the bottom of the display
    """
    # We need to do five complete passes to slide the whole image off the bottom 
    for i in range(5):
        # Process all rows
        for x in range(5):
            # Process the bottom four pixels of each column
            for y in range(4, 0, -1):
                # Copy the pixel above into this pixel
                value = display.get_pixel(x, y - 1)
                display.set_pixel(x, y, value)
            # Set the top pixel to 0
            display.set_pixel(x, 0, 0)
        # Slow down the wipe
        sleep(250)


def clear_dissolve():
    """
    Dissolve the display
    """
    # Make a list of all pixels
    pixels = list(range(25))
    
    # Randomise the order by swapping random pairs of items lots of time
    for i in range(50):
        a = random.randint(0, len(pixels) - 1)
        b = random.randint(0, len(pixels) - 1)
        swap = pixels[a]
        pixels[a] = pixels[b]
        pixels[b] = swap

    # Go through all of the pixels, one at a time, and turn them off
    for pixel in pixels:
        # Turn pixel off
        display.set_pixel(int(pixel / 5), int(pixel % 5), 0)
        # Slow down the dissolve
        sleep(50)


# All of the clear functions
clear_functions = [
    clear_fade,
    clear_wipe_down,
    clear_slide_down,
    clear_dissolve,
]
clear_function_index = 0


# The test images
test_images = [
    Image.HEART,
    Image.HAPPY,
    Image("99999:99999:99999:99999:99999"),
    Image("99999:95559:95559:95559:99999"),
    Image("13531:35753:57975:35753:13531"),
]
test_image_index = 0


# Main loop
while True:
    display.show(test_images[test_image_index])
    if  button_a.was_pressed():
        clear_functions[clear_function_index]()
        sleep(1000)
        clear_function_index = (clear_function_index + 1) % len(clear_functions)
        button_a.was_pressed()
    elif button_b.was_pressed():
        test_image_index = (test_image_index + 1) % len(test_images)
    

custom_display_clear.py
custom_display_clear.hex