Basic/Fire/Gray/M5GO LCD Display

The M5Core screen is 320x240 pixels, with the upper left corner of the screen as the origin (0,0).

• M5Stack Library Appendix

begin

Syntax:

void begin();

Description:

• Initialize the LCD screen. Using M5.begin() will automatically call Lcd.begin() internally to initialize.

Parameters:

• null

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.Lcd.begin();
}
 
void loop() {
}

sleep

Syntax:

void sleep();

Description:

• LCD switches to sleep mode

Parameters:

• null

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.Lcd.begin();
  M5.Lcd.sleep();
}
 
void loop() {
}

clear

Syntax:

void clear()

Description:

• Clear the display.

Parameters:

• null

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.Lcd.begin();
  M5.Power.begin();
  M5.Lcd.fillScreen(RED);
  delay(1000);
  M5.Lcd.clear();
}
 
void loop() {
}

wakeup

Syntax:

void wakeup();

Description:

• Wake up from sleep mode to restore the display.

Parameters:

• null

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
    M5.Lcd.begin();
    M5.Power.begin();
    M5.Lcd.fillScreen(RED);
    delay(1000);
    M5.Lcd.sleep();
    delay(6000);
    M5.Lcd.wakeup();
}
 
void loop() {
}

hight

Syntax:

int16_t height(void);

Description:

• Return to Screen Height

Parameters:

• null

Return:

• int16_t:
  • Screen height px

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin(); 
  M5.Power.begin();
  M5.Lcd.print(M5.Lcd.height());
}
 
void loop() {
}

width

Syntax:

int16_t width(void);

Description:

• Returns the width of the screen

Parameters:

• null

Return:

• int16_t:
  • Screen width px

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin(); 
  M5.Power.begin();
  M5.Lcd.print(M5.Lcd.width());
}
 
void loop() {
}

getCursorX

Syntax:

int16_t getCursorX(void);

Description:

• Get the x coordinate of the current cursor. Note: Not applicable to drawNumber().

Parameters:

• null

Return:

• int16_t:
  • Current cursor x-coordinate

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.print("Hello");
  int X = M5.Lcd.getCursorX();
  M5.Lcd.print(X);
}
 
void loop(){
}

getCursorY

Syntax:

int16_t getCursorY(void);

Description:

• Get the y coordinate of the current cursor. Note: Not applicable to drawNumber().

Parameters:

• null

Return:

• int16_t:
  • Current y-coordinate of the cursor

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.print("Hello");
  int X = M5.Lcd.getCursorY();
  M5.Lcd.print(Y);
}
 
void loop(){
}

getRotation

Syntax:

uint8_t getRotation()

Description:

• Returns the direction of screen rotation

Parameters:

• null

Return:

• uint8_t:
  • screen rotation:
    • 0-3

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.print(M5.Lcd.getRotation());
}
 
void loop(){
}

getTextDatum

Syntax:

uint8_t getTextDatum(void);

Description:

• Get the current text alignment

Parameters:

• null

Return:

• uint8_t: Text Alignment

// These enumerate the text plotting alignment (reference datum point)
#define TL_DATUM 0  // Top left (default)
#define TC_DATUM 1  // Top centre
#define TR_DATUM 2  // Top right
#define ML_DATUM 3  // Middle left
#define CL_DATUM 3  // Centre left, same as above
#define MC_DATUM 4  // Middle centre
#define CC_DATUM 4  // Centre centre, same as above
#define MR_DATUM 5  // Middle right
#define CR_DATUM 5  // Centre right, same as above
#define BL_DATUM 6  // Bottom left
#define BC_DATUM 7  // Bottom centre
#define BR_DATUM 8  // Bottom right
#define L_BASELINE 9  // Left character baseline (Line the 'A' character would sit on)
#define C_BASELINE 10  // Centre character baseline
#define R_BASELINE 11  // Right character baseline

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.setTextDatum(MC_DATUM);
  M5.Lcd.drawString("hello", 160, 120, 2);
  M5.Lcd.print(M5.Lcd.getTextDatum());
}
 
void loop(){
}

setCursor

Syntax:

void setCursor(int16_t x, int16_t y);

Description:

• Set text cursor to (x,y) position

Parameters:

• int16_t x:
  • x-coordinate (px)
• int16_t y
  • y-coordinate (px)

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();           
  M5.Power.begin();
  M5.Lcd.setCursor(0, 30);
  M5.Lcd.printf("Hello M5");
}
 
void loop() {}

setRotation

Syntax:

void setRotation(uint8_t m);

Description:

• Setting the screen rotation direction

Parameters:

• uint8_t m:
  • 0-3

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();           
  M5.Power.begin();
  M5.Lcd.setRotation(2);
  M5.Lcd.fillEllipse(160, 100, 60, 100, YELLOW);
  delay(1000);
  M5.Lcd.setRotation(1);
  M5.Lcd.fillEllipse(160, 100, 60, 100, GREEN);
}
 
void loop() {}

setBrightness

Syntax:

void setBrightness(uint8_t brightness);

Description:

• Setting the screen brightness

Parameters:

• uint8_t brightness:
  • 0-255

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.fillScreen(RED);
}
void loop() {
  M5.update();
  for(int i=0; i<255;i++){
    M5.Lcd.setBrightness(i);
    delay(10);
  }
  for(int i=255; i>0;i--){
    M5.Lcd.setBrightness(i);
    delay(10);
  }
}

alphaBlend

Syntax:

uint16_t alphaBlend(uint8_t alpha, uint16_t fgc, uint16_t bgc);

Description:

• Blend foreground and background colors, set transparency. Returns the new color value.

Parameters:

• uint8_t alpha:
  • transparency
• uint16_t fgc:
  • foreground color
• uint16_t bgc:
  • background color

Return:

• uint16_t:
  • Color values after blending

Example:

#include <M5Stack.h>
 
void setup() {
  M5.Lcd.begin();
  M5.Power.begin();
  M5.Lcd.fillScreen(M5.Lcd.alphaBlend(128, 0X00FF00, 0XFF0000));
}
 
void loop() {
}

loadFont

Syntax:

void loadFont(String fontName, fs::FS &ffs);

void loadFont(String fontName, bool flash);

Description:

• Loading VLW Font Files

Parameters:

• String fontName:
  • Font File Name
• bool flash / fs::FS &ffs:
  • File source

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.loadFont("filename", SD);
}
 
void loop() {
}

unloadFont

Syntax:

void unloadFont(void);

Description:

• Unmount the current font mount

Parameters:

• null

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.unloadFont();
}
 
void loop() {
}

fontsLoaded

Syntax:

uint16_t fontsLoaded();

Description:

• Returns the currently loaded font mask

Parameters:

• null

Return:

• null

Return:

• uint16_t:
  • Returns the hexadecimal value of the encoding of the display font

#ifdef LOAD_GLCD
    fontsloaded = 0x0002;  // Bit 1 set
#endif
 
#ifdef LOAD_FONT2
    fontsloaded |= 0x0004;  // Bit 2 set
#endif
 
#ifdef LOAD_FONT4
    fontsloaded |= 0x0010;  // Bit 4 set
#endif
 
#ifdef LOAD_FONT6
    fontsloaded |= 0x0040;  // Bit 6 set
#endif
 
#ifdef LOAD_FONT7
    fontsloaded |= 0x0080;  // Bit 7 set
#endif
 
#ifdef LOAD_FONT8
    fontsloaded |= 0x0100;  // Bit 8 set
#endif
 
#ifdef LOAD_FONT8N
    fontsloaded |= 0x0200;  // Bit 9 set
#endif
 
#ifdef SMOOTH_FONT
    fontsloaded |= 0x8000;  // Bit 15 set
#endif

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.print(M5.Lcd.fontsLoaded());
}
 
void loop() {
}

fillScreen

Syntax:

void fillScreen(uint32_t color);

Description:

• Fill the entire screen with the specified color

Parameters:

• uint32_t color:
  • color value

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.fillScreen(RED);
}
 
void loop(){
}

invertDisplay

Syntax:

void invertDisplay(boolean i);

Description:

• invert the colors of the screen

Parameters:

• boolean i:
  • true:Turn on color inversion
  • false:Turn off color inversion

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.fillScreen(RED);
}
 
void loop() {
  M5.Lcd.invertDisplay(1);
  delay(1000);
  M5.Lcd.invertDisplay(0);
}

color565

Syntax:

uint16_t color565(uint8_t r, uint8_t g, uint8_t b);

Description:

• RGB888->RGB565 conversion function.

Parameters:

• uint8_t r:

  • red

• uint8_t g:

  • green

• uint8_t b:

  • blue

• uint32_t color:

  • color value

Return:

• uint16_t:
  • RGB565 color

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  uint16_t colorvalue = 0;
  colorvalue = color565(255, 255, 255);
  M5.Lcd.fillEllipse(160, 100, 60, 100, colorvalue);
}
 
void loop() {}

Text

print

Syntax:

size_t print(const char str[]);

Description:

• Prints a string at the current position on the screen. (This API inherits from Print Class, and supports overloading functions with other parameter types)

Parameters:

• const char str[]:
  • string

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.print("this is a print text function");
}
 
void loop() {
}

textWidth

Syntax:

int16_t textWidth(const String& string);

Description:

• Returns the width in pixels of the text

Parameters:

• const String& string:
  • string

Return:

• int16_t:
  • Text pixel width

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin(); 
  M5.Power.begin();
  String text = "hello  ";
  M5.Lcd.print(text);
  M5.Lcd.print(M5.Lcd.textWidth(text));
}
 
void loop() {}

setTextSize

Syntax:

void setTextSize(uint8_t s);

Description:

• Setting the size of the displayed text

Parameters:

• uint8_t s:
  • 1-7

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.setTextSize(4);
  M5.Lcd.print("Hello M5Stack");
}
 
void loop() {
}

setTextColor

Syntax:

void setTextColor(uint16_t color);

void setTextColor(uint16_t color, uint16_t backgroundcolor);

Description:

• Sets the foreground color and background color of the displayed text. The default color for text is white. The default color of backgroundcolor is black.

Parameters:

• uint16_t color:
  • Text Color Value
• uint16_t backgroundcolor
  • Text background color value

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.setTextColor(RED,BLACK);
}
 
void loop(){
}

setTextWrap

Syntax:

void setTextWrap(boolean wrapX, boolean wrapY);

Description:

• Setting up automatic line feed

Parameters:

• boolean wrapX:
  • Enable wrap in the x direction (default)
• boolean wrapY
  • Enable wrao in the y-direction

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin(); 
  M5.Power.begin();
  M5.Lcd.setTextWrap(true, true);
    M5.Lcd.print("hello M5Stack hello M5Stack hello M5Stack hello M5Stack hello M5Stack hello M5Stack hello M5Stack hello M5Stack");
}
 
void loop() {}

setTextPadding

Syntax:

void setTextPadding(uint16_t x_width);

Description:

• Fill specified blank width (can help erase old text and numbers)

Parameters:

• uint16_t x_width:
  • Text fill width (px)

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
}
 
void loop() {
  M5.Lcd.drawString("Orbitron 32", 160, 60, 2);
  delay(2000);
  M5.Lcd.setTextPadding(M5.Lcd.width() - 20);
  M5.Lcd.drawString("Orbitron 32 with padding", 160, 60, 2);
  delay(2000);
}

setTextDatum

Syntax:

void setTextDatum(uint8_t datum);

Description:

• Sets the text alignment. Note: Not applicable to print().

Parameters:

• uint8_t datum:
  • Text Alignment (see definition below)

Return:

• null

// These enumerate the text plotting alignment (reference datum point)
#define TL_DATUM 0  // Top left (default)
#define TC_DATUM 1  // Top centre
#define TR_DATUM 2  // Top right
#define ML_DATUM 3  // Middle left
#define CL_DATUM 3  // Centre left, same as above
#define MC_DATUM 4  // Middle centre
#define CC_DATUM 4  // Centre centre, same as above
#define MR_DATUM 5  // Middle right
#define CR_DATUM 5  // Centre right, same as above
#define BL_DATUM 6  // Bottom left
#define BC_DATUM 7  // Bottom centre
#define BR_DATUM 8  // Bottom right
#define L_BASELINE 9  // Left character baseline (Line the 'A' character would sit on)
#define C_BASELINE 10  // Centre character baseline
#define R_BASELINE 11  // Right character baseline

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.setTextDatum(MC_DATUM);
  M5.Lcd.drawString("hello", 160, 120, 2);
}
 
void loop(){
}

Draw

drawFastHLine

Syntax:

void drawFastHLine(int32_t x, int32_t y, int32_t w, uint32_t color);

Description:

• Draw a horizontal line of length w at (X,Y).

Parameters:

• int32_t x:
  • y-coordinate
• int32_t y:
  • x-coordinate
• int32_t w:
  • Length of horizontal line segment
• uint32_t color:
  • color value

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.drawFastHLine(3, 100, 255, GREEN);
}
 
void loop() {
}

drawFastVLine

Syntax:

void drawFastVLine(int32_t x, int32_t y, int32_t w, uint32_t color);

Description:

• Draw a vertical line of length w at (X,Y).

Parameters:

• int32_t x:
  • y-coordinate
• int32_t y:
  • x-coordinate
• int32_t w:
  • Length of vertical line segment
• uint32_t color:
  • color value

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.drawFastVLine(100, 0, 255, TFT_GREEN);
}
 
void loop(){
}

drawString()

Syntax:

int16_t drawString(const char *string, int32_t poX, int32_t poY, uint8_t font);

Description:

• Show string at (x,y)

Parameters:

• const char *string:
  • 字符串
• int32_t poX:
  • x-coordinate
• int32_t poY:
  • y-coordinate
• uint8_t font:
  • Font Index

Return:

• int16_t:
  • Pixel width occupied by the string

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.drawString("Hello M5", 160, 100, 2);
}
 
void loop(){
}

drawNumber

Syntax:

void drawNumber(long long_num, int32_t poX, int32_t poY);

Description:

• Print the integer at (x,y).

Parameters:

• long long_num:
  • Number
• int32_t poX:
  • x-coordinate
• int32_t poY:
  • y-coordinate

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.drawNumber(99, 55, 100);
}
 
void loop(){
}

drawChar

Description:

• Display characters at (X,Y) in font font

Syntax:

int16_t drawChar(int16_t uniCode, int32_t x, uint16_t y, uint8_t font);

Parameters:

• int16_t uniCode:
  • character
• int32_t x:
  • x-coordinate
• uint16_t y:
  • y-coordinate
• uint8_t font:
  • Font Index

Return:

• int16_t:
  • Pixel width occupied by the character

Example:

#include <M5Stack.h>
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.drawChar('A', 160, 120, 2);
}
void loop(){
}

drawFloat

Syntax:

int16_t drawFloat(float floatNumber, uint8_t dp, int32_t poX, int32_t poY);

Description:

• Float number with dp decimal places at (X,Y) floatNumber

Parameters:

• float floatNumber:
  • float Number
• uint8_t dp:
  • Number of decimal places to be retained
• int32_t poX:
  • x-coordinate
• int32_t poY:
  • y-coordinate

Return:

• int16_t:
  • Pixel width of the displayed character

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin(); 
  M5.Power.begin();
  M5.Lcd.drawFloat(3.1415928,7,100,100);
}
 
void loop() {}

drawPixel

Syntax:

void drawPixel(int32_t x, int32_t y, uint32_t color);

Description:

• Draw the point at (x,y)

Parameters:

• int32_t x:
  • x-coordinate
• int32_t y:
  • y-coordinate
• uint32_t color:
  • color value

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.drawPixel(22,22,RED);
}
 
void loop() {}

drawLine

Syntax:

void drawLine(int32_t x0, int32_t y0, int32_t x1, int32_t y1, uint32_t color);

Description:

• Draws a line from point (x0,y0) to point (x1,y1) in the specified color.

Parameters:

• int32_t x0:
  • x0-coordinate
• int32_t y0:
  • y0-coordinate
• int32_t x1:
  • x1-coordinate
• int32_t y1:
  • y1-coordinate
• uint32_t color:
  • color value

Return:

• null

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.drawLine(200, 0, 200,2000,GREEN);
}
 
void loop(){
}

drawRect

Syntax:

void drawRect(int32_t x, int32_t y, int32_t w, int32_t h, uint32_t color);

Description:

• Draw a rectangular wireframe with width and height at (x,y) in the specified color.

Parameters:

• int32_t x:
  • x-coordinate
• int32_t y:
  • y-coordinate
• int32_t w:
  • Rectangular width(px)
• int32_t h:
  • Rectangular height(px)
• uint32_t color:
  • color value

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.drawRect(180, 12, 122, 10, BLUE);
}
 
void loop(){
}

fillRect

Syntax:

void fillRect(int32_t x, int32_t y, int32_t w, int32_t h, uint32_t color);

Description:

• Draw a filled rectangle with width and height at (x,y) in the specified color.

Parameters:

• int32_t x:
  • x-coordinate
• int32_t y:
  • y-coordinate
• int32_t w:
  • Rectangular width(px)
• int32_t h:
  • Rectangle height(px)
• uint32_t color:
  • color value

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.fillRect(150, 120, 122, 10, BLUE);
}
 
void loop(){
}

drawRoundRect

Syntax:

void drawRoundRect(int32_t x, int32_t y, int32_t w, int32_t h, int32_t r, uint32_t color);

Description:

• in (x,y) at the drawing width and height were width, height of the rounded rectangular wireframe, rounded radius for radius, color for color

Parameters:

• int32_t x:
  • x-coordinate
• int32_t y:
  • y-coordinate
• int32_t w:
  • Rectangular width(px)
• int32_t h:
  • Rectangular height(px)
• int32_t r:
  • radius of a rounded corner
• uint32_t color:
  • color value

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin(); 
  M5.Power.begin();
  M5.Lcd.drawRoundRect(55,55,30,50,10,GREEN);
 
void loop() {}

fillRoundRect

Syntax:

void fillRoundRect(int32_t x, int32_t y, int32_t w, int32_t h, int32_t r, uint32_t color);

Description:

• in (x,y) at the drawing width and height were width, height of the rounded rectangular wireframe, rounded radius for radius, color for color

Parameters:

• int32_t x:
  • x-coordinate
• int32_t y:
  • y-coordinate
• int32_t w:
  • Rectangular width(px)
• int32_t h:
  • Rectangular height(px)
• int32_t r:
  • radius of a rounded corner
• uint32_t color:
  • color value

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin(); 
  M5.Power.begin();
  M5.Lcd.fillRoundRect(55, 55, 30, 50, 10, GREEN);
}
 
void loop() {}

drawCircle

Syntax:

void drawCircle(int32_t x0, int32_t y0, int32_t r, uint32_t color);

Description:

• Draw a color-coded circular wireframe at (x,y) with radius r

Parameters:

• uint32_t x0:
  • Center of circle x0
• int32_t y0:
  • Center of circle y0
• int32_t r:
  • radius
• uint32_t color:
  • color value

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin(); 
  M5.Power.begin();
  M5.Lcd.drawCircle(100, 100, 50, RED);
}
 
void loop() {}

fillCircle

Syntax:

void drawCircle(int32_t x0, int32_t y0, int32_t r, uint32_t color);

Description:

• Draw a color-filled circle with radius r at (x,y).

Parameters:

• uint32_t x0:
  • Center of circle x0
• int32_t y0:
  • Center of circle y0
• int32_t r:
  • radius
• uint32_t color:
  • color value

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin(); 
  M5.Power.begin();
  M5.Lcd.fillCircle(100, 100, 50, RED);
}
 
void loop() {}

drawEllipse

Syntax:

void drawEllipse(int16_t x0, int16_t y0, int32_t rx, int32_t ry, uint16_t color);

Description:

• Draw an elliptical wireframe with width and height rx,ry at (x,y).

Parameters:

• uint32_t x0:
  • Center of circle x0
• int32_t y0:
  • Center of circle y0
• int32_t rx:
  • width(px)
• int32_t ry:
  • hight(px)
• uint16_t color:
  • color value

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin(); 
  M5.Power.begin();
  M5.Lcd.drawEllipse(160, 100, 60, 100, YELLOW);
}
 
void loop() {}

fillEllipse

Syntax:

void fillEllipse(int16_t x0, int16_t y0, int32_t rx, int32_t ry, uint16_t color);

Description:

• Draw a filled ellipse at (x,y) with width and height rx,ry respectively.

Parameters:

• uint32_t x0:
  • Center of circle x0
• int32_t y0:
  • Center of circle y0
• int32_t rx:
  • width(px)
• int32_t ry:
  • hight(px)
• uint16_t color:
  • color value

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.fillEllipse(160, 100, 60, 100, YELLOW);
}
 
void loop() {}

drawTriangle

Syntax:

void drawTriangle(int32_t x0, int32_t y0, int32_t x1, int32_t y1, int32_t x2, int32_t y2, uint32_t color);

Description:

• Draw the triangle wireframe with (x1, y1) (x2, y2) (x3, y3) as the vertices

Parameters:

• int16_t x0:
  • x0-coordinate
• int16_t y0:
  • y0-coordinate
• int16_t x1:
  • x1-coordinate
• int16_t y1:
  • y1-coordinate
• int16_t x2:
  • x2-coordinate
• int16_t y2:
  • y2-coordinate
• uint16_t color
  • color value

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin(); 
  M5.Power.begin();
  M5.Lcd.drawTriangle(30, 30, 180, 100, 80, 150, YELLOW);
}
 
void loop() {}

fillTriangle

Syntax:

void fillTriangle(int32_t x0, int32_t y0, int32_t x1, int32_t y1, int32_t x2, int32_t y2, uint32_t color);

Description:

• Drawing filled triangles with (x1, y1) (x2, y2) (x3, y3) as vertices

Parameters:

• int16_t x0:
  • x0-coordinate
• int16_t y0:
  • y0-coordinate
• int16_t x1:
  • x1-coordinate
• int16_t y1:
  • y1-coordinate
• int16_t x2:
  • x2-coordinate
• int16_t y2:
  • y2-coordinate
• uint16_t color
  • color value

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin(); 
  M5.Power.begin();
  M5.Lcd.fillTriangle(30, 30, 180, 100, 80, 150, YELLOW);
}
 
void loop() {}

drawXBitmap

Syntax:

void drawXBitmap(int16_t x, int16_t y, const uint8_t *bitmap, int16_t w, int16_t h, uint16_t color);

Description:

• Drawing bitmap

Parameters:

• int16_t x:
  • x-coordinate
• int16_t y:
  • y-coordinate
• const uint8_t *bitmap:
  • image data
• int16_t w:
  • image width(px)
• int16_t h:
  • Image height(px)
• uint16_t color:
  • color value

Example:

• Github:M5Stack->Advanced->Display->drawXBitmap

drawBitmap

Syntax:

void drawBitmap(int16_t x0, int16_t y0, int16_t w, int16_t h, const uint16_t *data);

void drawBitmap(int16_t x0, int16_t y0, int16_t w, int16_t h, uint16_t *data);

void drawBitmap(int16_t x0, int16_t y0, int16_t w, int16_t h, const uint16_t *data, uint16_t transparent);

void drawBitmap(int16_t x0, int16_t y0, int16_t w, int16_t h, const uint8_t *data);

void drawBitmap(int16_t x0, int16_t y0, int16_t w, int16_t h, uint8_t *data);

Description:

• Drawing bmp image data

Parameters:

• int16_t x0:
  • x-coordinate
• int16_t y0:
  • y-coordinate
• int16_t w:
  • Image width(px)
• int16_t h:
  • Image height(px)
• const uint16_t *data:
  • bmp data
• transparent:
  • Transparent color

Return:

• null

drawBmpFile

Syntax:

void drawBmpFile(fs::FS &fs, const char *path, uint16_t x, uint16_t y);

Description:

• Reads a bmp image from a file and draws it

Parameters:

• fs::FS &fs:
  • file stream handle
• const char *path:
  • file path(SD 、SPIFFS)
• uint16_t x:
  • x-coordinate
• uint16_t y:
  • y-coordinate

Return:

• null

Example:

#include "FS.h"
//#include "SPIFFS.h"
#include <M5Stack.h>
void setup(){
    M5.begin(true, false, false, false);
  M5.Power.begin();
  M5.Lcd.drawBmpFile(SD, "/p2.bmp",0,0);
  //M5.Lcd.drawBmpFile(SPIFFS, "/p2.bmp", 0, 0);
}

We provide a script that can be used to convert jpg images -> .c files, which can be used to convert a number of images and draw them to the screen using the API above:.

• bin2code.py

drawJpg

Syntax:

void drawJpg(const uint8_t *jpg_data, size_t jpg_len, uint16_t x,uint16_t y, uint16_t maxWidth, uint16_t maxHeight,uint16_t offX, uint16_t offY, jpeg_div_t scale);

Description:

• Reads the JPEG image data from memory and draws it.

Parameters:

• const uint8_t *jpg_data:
  • jpg data pointer
• size_t jpg_len:
  • jpg data length
• uint16_t x:
  • x-coordinate
• uint16_t y:
  • y-coordinate
• uint16_t maxWidth:
  • Maximum display width
• uint16_t maxHeight:
  • Maximum display height
• uint16_t offX:
  • image x offset
• uint16_t offY:
  • image y offset
• jpeg_div_t scale:
  • JPEG_DIV_NONE: no care
  • JPEG_DIV_2: 1/2
  • JPEG_DIV_4: 1/4
  • JPEG_DIV_8: 1/8
  • JPEG_DIV_MAX: MAX

Return:

• null

Note:|1. Depending on the size and number of bits may not be able to expand
2. Need to pre-install Arduino ESP32 filesystem uploader in advance.

Example:

#include <M5Stack.h>
extern uint8_t tetris_img[];
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.drawJpg(tetris_img, 34215);
}
void loop(){
}

drawJpgFile

Syntax:

void drawJpgFiledrawJpgFile(fs::FS &fs, const char *path, uint16_t x,uint16_t y,uint16_t maxWidth, uint16_t maxHeight, uint16_t offX,uint16_t offY, jpeg_div_t scale);

Description:

• Reads JPEG data from a file stream and draws it

Parameters:

• fs::FS &fs:
  • file stream handle
• const char *path:
  • file path
• uint16_t x:
  • x-coordinate
• uint16_t y:
  • y-coordinate
• uint16_t maxWidth:
  • Maximum display width
• uint16_t maxHeight:
  • Maximum display height
• uint16_t offX:
  • image x offset
• uint16_t offY:
  • image y offset
• jpeg_div_t scale:
  • JPEG_DIV_NONE: no care
  • JPEG_DIV_2: 1/2
  • JPEG_DIV_4: 1/4
  • JPEG_DIV_8: 1/8
  • JPEG_DIV_MAX: MAX

Return:

• null

progressBar

Syntax:

void progressBar(int x, int y, int w, int h, uint8_t val);

Description:

• Column showing the progress of the display

Parameters:

• int x:
  • x-coordinate
• int y:
  • y-coordinate
• int w:
  • width(px)
• int h:
  • hight(px)
• uint8_t val:
  • progress(0-100)

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.begin();
  M5.Power.begin();
  M5.Lcd.progressBar(0, 0, 240, 20, 20);
}
 
void loop() {
}

qrcode

Syntax:

void qrcode(const char *string, uint16_t x, uint16_t y, uint8_t width, uint8_t version);

void qrcode(const String &string, uint16_t x, uint16_t y, uint8_t width, uint8_t version);

Description:

• Draws a QR code. When using it, please choose the appropriate version of QR code according to the number of input characters.

Parameters:

• const String &string:
  • coded string
• uint16_t x:
  • x-coordinate
• uint16_t y:
  • y-coordinate
• uint8_t width:
  • QR code width(px)
• uint8_t version:
  • QR code version:1-40

Return:

• null

Example:

#include <M5Stack.h>
 
void setup() {
  M5.Lcd.begin(); 
  M5.Power.begin();
  M5.Lcd.qrcode("http://www.m5stack.com", 50, 10, 220, 6);
}
 
void loop() {
}

Sprite

setColorDepth

Syntax:

void* TFT_eSprite::setColorDepth(int8_t b);

Description:

• Setting the canvas color depth, the color depth bit affects the amount of memory used to create the canvas.

Parameters:

• int8_t b:color depth(bit)
  • 1, 8, 16

Return:

• null

Example:

#include <M5Stack.h>
TFT_eSprite img = TFT_eSprite(&M5.Lcd);
 
void setup() {
    M5.begin();
    M5.Power.begin();
    img.setColorDepth(8);
    img.setTextSize(2);
    img.createSprite(320, 240);
}
 
void loop() {}

createSprite

Syntax:

void *createSprite(int16_t w, int16_t h, uint8_t frames);

Description:

• Creates a canvas of a specified width and height

Parameters:

• int16_t w:
  • Canvas width(px)
• int16_t h:
  • Canvas Height(px)
• uint8_t frames:
  • bytes occupied by bit depth:1/2

Return:

• void *:
  • Pointer to the canvas being created, if NULL then it was not created successfully.

Example:

#include <M5Stack.h>
 
TFT_eSprite img = TFT_eSprite(&M5.Lcd);
 
void setup() {
    M5.begin();
    M5.Power.begin();
    img.setColorDepth(8);  // Set the color depth to 8 bits.
    img.createSprite(320, 240);  //Create a 320x240 canvas.
    img.fillSprite(RED);         //Fill the canvas with red.
    img.pushSprite(0,0);  // Push the canvas to the screen at (0,0).
}
 
void loop() {}

fillSprite

Syntax:

void fillSprite(uint32_t color);

Description:

• Fill Sprite with the specified color

Parameters:

• uint32_t color:
  • color value

Return:

• null

Example:

#include <M5Stack.h>
 
TFT_eSprite img = TFT_eSprite(&M5.Lcd);
 
void setup() {
    M5.begin();
    M5.Power.begin();
    img.setColorDepth(8);  // Set the color depth to 8 bits. 
    img.createSprite(320, 240);  //Create a 320x240 canvas. 
    img.fillSprite(RED);         //Fill the canvas with red. 
    img.pushSprite(0,0);  // Push the canvas to the screen at (0,0). 
}
 
void loop() {}
}
 
void loop() {}

pushSprite

Syntax:

void pushSprite(int32_t x, int32_t y, uint16_t transparent);

Description:

• Push the canvas to the specified coordinates and set the pass-through color.

Parameters:

• int32_t x:
  • x-coordinate
• int32_t y:
  • y-coordinate
• uint16_t transparent:
  • penetrating color(option)

Return:

• null

Example:

#include <M5Stack.h>
TFT_eSprite img = TFT_eSprite(&M5.Lcd);
 
void setup() {
  M5.begin();
  M5.Power.begin();
  img.createSprite(320, 240);    
  img.fillSprite(RED);
  img.fillCircle(100,100,20,GREEN);
  img.pushSprite(0, 0, GREEN);
}
 
void loop() {}

width

Syntax:

int16_t width(void);

Description:

• Returns the width of the Sprite

Parameters:

• null

Return:

• int16_t:
  • Canvas width

Example:

#include <M5Stack.h>
TFT_eSprite img = TFT_eSprite(&M5.Lcd);
 
void setup() {
  M5.begin();
  M5.Power.begin();
  img.createSprite(320, 240);    
  img.fillSprite(RED);
  img.pushSprite(0, 0, WHITE);
  M5.Lcd.print(img.width());
}
 
void loop() {}

height

Syntax:

int16_t height(void);

Description:

• Returns the height of the Sprite

Parameters:

• null

Return:

• int16_t:
  • Canvas Height

Example:

#include <M5Stack.h>
TFT_eSprite img = TFT_eSprite(&M5.Lcd);
 
void setup() {
  M5.begin();
  M5.Power.begin();
  img.createSprite(320, 240);
  img.fillSprite(RED);
  img.pushSprite(0, 0, WHITE);
  M5.Lcd.print(img.height());
}
 
void loop() {}

deleteSprite

Syntax:

void deleteSprite(void);

Description:

• Delete canvas from memory

Parameters:

• null

Return:

• null

Example:

#include <M5Stack.h>
TFT_eSprite img = TFT_eSprite(&M5.Lcd);
 
void setup() {
  M5.begin();
  M5.Power.begin();
  img.deleteSprite();
}
 
void loop() {}