Skip to content

UserGuide MultiLayer

Jump to bottom
Bill Li edited this page Sep 6, 2024 · 13 revisions

Microchip Technology Multi-Layer User Guide

What is the Multi-layering in graphics?

Multi-layering Composition

Click here to expand details

  • A layer is a virtual construct that can hold graphical elements.
  • Multi-layering is the combining of layers into a single images.
  • It creates the illusion that all those elements are parts of the same scene.

Multi-Layer Compositing

Software-based Compositing

Click here to expand details

  • In this scheme, the graphics library combines the elements from multiple source layers into a single frame.
  • This requires CPU processing power and bus bandwidth, which can become significant for large resolution layers.

Software-based Multi-layer Compositing

Hardware Compositing

Click here to expand details

  • Integrated display controllers such as the GLCD and the LCDC supports multiple hardware overlays.
  • Each overlay has its own frame buffer.
  • The graphics library renders to each overlay frame buffer depending on the draw requirement.
  • The display controller composites the overlays into a single frame.
  • It becomes a form of hardware graphics acceleration.
  • Dynamic content with minimal load on the CPU, and no GPU needed.

Hardware Accelerated Multi-Layer Compositing

How to setup multiple layers in MPLAB® Harmony Graphics?

From MPLAB® Harmony Graphics Composer

Click here to expand details

IMPORTANT NOTE: Multi-layering in MPLAB® Harmony Graphics relies on display controllers with hardware overlay support. For software-based multi-layering, the recommendation is to use a single layer in the Screen Designer window. The panel widget can be used as the virtual layer construct.

  • Hardware Overlays are supported in Legato and Composer using Layers.

Multi-Layer in Composer

NOTE: If you have a hard time viewing this image, right-click and open the image in a new tab to enlarge it.

  • Here is a visualization of what goes on behind the scenes.

Multi-Layer Behind the Scenes

What are some Multi-layering best practices?

Pro Tip #1: Use Multi-layers to overlay dynamic content

Click here to expand details

IMPORTANT NOTE: Multi-layering in MPLAB® Harmony Graphics relies on display controllers with hardware overlay support. For software-based multi-layering, the recommendation is to use a single layer in the Screen Designer window. The panel widget can be used as the virtual layer construct.

(This is an example from Legato Dashboard)

Multi-Layer for Dynamic Content

Pro Tip #2: Layers are often ideal for UI Controls

Click here to expand details

IMPORTANT NOTE: Multi-layering in MPLAB® Harmony Graphics relies on display controllers with hardware overlay support. For software-based multi-layering, the recommendation is to use a single layer in the Screen Designer window. The panel widget can be used as the virtual layer construct.

(This is an example from Legato Video Player)

Multi-Layer Overlay UI Control

Pro Tip #3: Use layers for semi-transparent effects

Click here to expand details

IMPORTANT NOTE: Multi-layering in MPLAB® Harmony Graphics relies on display controllers with hardware overlay support. For software-based multi-layering, the recommendation is to use a single layer in the Screen Designer window. The panel widget can be used as the virtual layer construct.

Multi-Layer for transparency

Pro Tip #4: Layers can be used as sprite animators

Click here to expand details

IMPORTANT NOTE: Multi-layering in MPLAB® Harmony Graphics relies on display controllers with hardware overlay support. For software-based multi-layering, the recommendation is to use a single layer in the Screen Designer window. The panel widget can be used as the virtual layer construct.

Use the GLCD or the LCDC for needle sprite animation

  • Pre-rotated needle images are stored in DDR/SDRAM
  • Upper layers are used to display the needles
  • To start the animation, the layer start address is set to the location of the images in DDR/SDRAM
  • The GLCD/LCDC layer position is also adjusted to show the needles at the correct location on the screen

(This is an example from Legato Dashboard)

Multi-Layer for sprite animation

Pro Tip #5: Use layers for sliding menus or panels

Click here to expand details

IMPORTANT NOTE: Multi-layering in MPLAB® Harmony Graphics relies on display controllers with hardware overlay support. For software-based multi-layering, the recommendation is to use a single layer in the Screen Designer window. The panel widget can be used as the virtual layer construct.

  • Create an oversized Layer in MPLAB® Harmony Graphics Composer
    • Add all the menu widgets to the layer
    • Only widgets that will slide should be in this layer
  • Set the display controller x-stride using the display controller PLIB
  • To move the layer to the left, add the x-offset position (in bytes) of the menu to the start address of the frame buffer in the display controller
  • Fast and smooth motion can be achieved with very little CPU usage and without a GPU

Pro Tip #6: If you are using multiple screens in your design, ensure all the screens have the same number of layers

Click here to expand details

It is best practice to set all the screens in your design with the maximum number of layers needed for any one screen. For example, if you need three layers in screen 1 and only one layer in screen 2, please enable all three layers in screen 2 as well. You can add a clear panel widget to the layers that are unused.

If you are new to MPLAB® Harmony, you should probably start with these tutorials:

Is this page helpful? Send feedback.

Microchip Technology

Clone this wiki locally