Raise to version 2.0.0
The library has been cleaned up as it has got a bit untidy due to the large number of small incremental changes. 4bit Sprite examples renaed to be consistent with others. alphaBlend example moved to generic folder (alphaBlend fn was moved to TFT_eSPI class). Added sections + explanatory comments to functions prototypes. Temporary comments added for potential gotchas for noobs when using DMA. spi_begin/end functions renamed to reflect functionality. Old fns retained for backwards compatibility with user setup.h files.
This commit is contained in:
1 parent
b954372859
commit
0e0fd75277
29 files changed
+1267
-797
No files matched your search
File renamed without changes.
+59
-69
@@ -1,9 +1,16 @@
|
||||
/*
|
||||
|
||||
Sketch to show how a Sprite is created, how to draw pixels
|
||||
Sketch to show how a 4 bit Sprite is created, how to draw pixels
|
||||
and text within the Sprite and then push the Sprite onto
|
||||
the display screen.
|
||||
|
||||
The advantage of 4 bit sprites is:
|
||||
1. Small memory footprint
|
||||
2. Any set of 16 colours can be specified
|
||||
3. Colours can be changed without redrawing in Sprite
|
||||
4. Simple animations like flashing text can be achieved
|
||||
by colour palette cycling and pushing sprite to TFT:
|
||||
https://en.wikipedia.org/wiki/Color_cycling
|
||||
|
||||
Example for library:
|
||||
https://github.com/Bodmer/TFT_eSPI
|
||||
|
||||
@@ -14,14 +21,7 @@
|
||||
any position. If there is sufficient RAM then the Sprite can
|
||||
be the same size as the screen and used as a frame buffer.
|
||||
|
||||
A 16 bit Sprite occupies (2 * width * height) bytes in RAM.
|
||||
|
||||
On a ESP8266 Sprite sizes up to 126 x 160 can be accomodated,
|
||||
this size requires 40kBytes of RAM for a 16 bit color depth.
|
||||
|
||||
When 8 bit color depth sprites are created they occupy
|
||||
(width * height) bytes in RAM, so larger sprites can be
|
||||
created, or the RAM required is halved.
|
||||
A 4 bit Sprite occupies (width * height)/2 bytes in RAM.
|
||||
|
||||
*/
|
||||
|
||||
@@ -41,14 +41,15 @@ TFT_eSprite spr = TFT_eSprite(&tft); // Declare Sprite object "spr" with pointe
|
||||
|
||||
void setup()
|
||||
{
|
||||
Serial.begin(250000);
|
||||
Serial.begin(115200);
|
||||
Serial.println();
|
||||
|
||||
delay(500);
|
||||
|
||||
// Initialise the TFT registers
|
||||
tft.init();
|
||||
|
||||
|
||||
// Set the sprite colour depth to 4
|
||||
spr.setColorDepth(4);
|
||||
|
||||
// Create a sprite of defined size
|
||||
@@ -60,89 +61,72 @@ void setup()
|
||||
|
||||
void loop(void)
|
||||
{
|
||||
// Fill the whole sprite with color 5 (Sprite is in memory so not visible yet)
|
||||
spr.fillSprite(10);
|
||||
// Fill the whole sprite with color 0 (Sprite is in memory so not visible yet)
|
||||
spr.fillSprite(0);
|
||||
|
||||
// create a color map with known colors
|
||||
// create a color map with known colors (16 maximum for 4 bit Sprite
|
||||
uint16_t cmap[16];
|
||||
|
||||
|
||||
cmap[0] = TFT_BLACK;
|
||||
cmap[1] = TFT_NAVY;
|
||||
cmap[2] = TFT_DARKGREEN;
|
||||
cmap[3] = TFT_DARKCYAN;
|
||||
cmap[4] = TFT_MAROON;
|
||||
cmap[5] = TFT_PURPLE;
|
||||
cmap[6] = TFT_OLIVE;
|
||||
cmap[7] = TFT_LIGHTGREY;
|
||||
cmap[8] = TFT_DARKGREY;
|
||||
cmap[9] = TFT_BLUE;
|
||||
cmap[0] = TFT_BLACK; // We will keep this as black
|
||||
cmap[1] = TFT_NAVY;
|
||||
cmap[2] = TFT_DARKGREEN;
|
||||
cmap[3] = TFT_DARKCYAN;
|
||||
cmap[4] = TFT_MAROON;
|
||||
cmap[5] = TFT_PURPLE;
|
||||
cmap[6] = TFT_PINK;
|
||||
cmap[7] = TFT_LIGHTGREY;
|
||||
cmap[8] = TFT_YELLOW;
|
||||
cmap[9] = TFT_BLUE;
|
||||
cmap[10] = TFT_GREEN;
|
||||
cmap[11] = TFT_CYAN;
|
||||
cmap[12] = TFT_RED;
|
||||
cmap[13] = TFT_MAGENTA;
|
||||
cmap[14] = TFT_YELLOW;
|
||||
cmap[15] = TFT_WHITE;
|
||||
cmap[14] = TFT_WHITE; // Keep as white for text
|
||||
cmap[15] = TFT_BLUE; // Keep as blue for sprite border
|
||||
|
||||
spr.createPalette(cmap, 16);
|
||||
|
||||
// Pass the palette to the Sprite class
|
||||
spr.createPalette(cmap);
|
||||
|
||||
// Push Sprite parially off-screen to test cropping
|
||||
spr.pushSprite(-40, -40);
|
||||
spr.pushSprite(tft.width() / 2 - WIDTH / 2, tft.height() / 2 - HEIGHT / 2, 10);
|
||||
spr.pushSprite(tft.width() - WIDTH + 40, tft.height() - HEIGHT + 40);
|
||||
|
||||
// Number of pixels to draw
|
||||
uint16_t n = 100;
|
||||
|
||||
// Draw 100 random color pixels at random positions in sprite
|
||||
while (n--)
|
||||
{
|
||||
uint16_t color = random(0x10); // Returns color 0 - 0x0F
|
||||
int16_t x = random(WIDTH); // Random x coordinate
|
||||
int16_t y = random(HEIGHT); // Random y coordinate
|
||||
spr.drawPixel( x, y, color); // Draw pixel in sprite
|
||||
uint16_t color = random(0x10); // Returns color 0 - 0x0F (i.e. 0-15)
|
||||
int16_t x = random(WIDTH); // Random x coordinate
|
||||
int16_t y = random(HEIGHT); // Random y coordinate
|
||||
spr.drawPixel(x, y, color); // Draw pixel in sprite
|
||||
}
|
||||
|
||||
spr.pushSprite(-40, -40);
|
||||
spr.pushSprite(tft.width() / 2 - WIDTH / 2, tft.height() / 2 - HEIGHT / 2);
|
||||
spr.pushSprite(tft.width() - WIDTH + 40, tft.height() - HEIGHT + 40);
|
||||
|
||||
delay(DELAY);
|
||||
|
||||
// Draw some lines
|
||||
spr.drawLine(1, 0, WIDTH, HEIGHT-1, 6);
|
||||
spr.drawLine(0, 0, WIDTH, HEIGHT, 6);
|
||||
spr.drawLine(0, 1, WIDTH-1, HEIGHT, 2);
|
||||
spr.drawLine(0, HEIGHT-1, WIDTH-1, 0, 2);
|
||||
spr.drawLine(0, HEIGHT, WIDTH, 0, 3);
|
||||
spr.drawLine(1, HEIGHT, WIDTH, 1, 3);
|
||||
spr.drawLine(4, 0, 4, HEIGHT-1, 11);
|
||||
spr.drawLine(0, 16, WIDTH-1, 16, 13);
|
||||
|
||||
// draw some circles with random colors.
|
||||
spr.drawCircle(20, 60, 10, 6);
|
||||
spr.drawCircle(80, 60, 15, 7);
|
||||
spr.drawCircle(50, 108, 5, 9);
|
||||
spr.drawCircle(45, 86, 3, 8);
|
||||
spr.fillCircle(102, 56, 4, 11);
|
||||
|
||||
spr.fillRect(28, 32, 40, 4, 5);
|
||||
//spr.fillRect(27, 42, 40, 14, 6);
|
||||
//spr.fillRect(33, 55, 3, 4, 7);
|
||||
//spr.fillRect(34, 32, 7, 4, 8);
|
||||
spr.drawLine(1, 0, WIDTH, HEIGHT-1, 10);
|
||||
spr.drawLine(0, 0, WIDTH, HEIGHT, 10);
|
||||
spr.drawLine(0, 1, WIDTH-1, HEIGHT, 10);
|
||||
spr.drawLine(0, HEIGHT-1, WIDTH-1, 0, 12);
|
||||
spr.drawLine(0, HEIGHT, WIDTH, 0, 12);
|
||||
spr.drawLine(1, HEIGHT, WIDTH, 1, 12);
|
||||
|
||||
// Draw some text with Middle Centre datum
|
||||
spr.setTextDatum(MC_DATUM);
|
||||
spr.drawString("Sprite", WIDTH / 2, HEIGHT / 2, 1);
|
||||
spr.setTextColor(14); // White text
|
||||
spr.drawString("Sprite", WIDTH / 2, HEIGHT / 2, 4);
|
||||
|
||||
// Now push the sprite to the TFT at position 0,0 on screen
|
||||
// Now push the sprite to the TFT at 3 positions on screen
|
||||
spr.pushSprite(-40, -40);
|
||||
spr.pushSprite(tft.width() / 2 - WIDTH / 2, tft.height() / 2 - HEIGHT / 2);
|
||||
spr.pushSprite(tft.width() - WIDTH + 40, tft.height() - HEIGHT + 40);
|
||||
|
||||
delay(DELAY * 4);
|
||||
|
||||
// create a new color map and use it instead
|
||||
|
||||
for (auto i = 0; i < 16; i++)
|
||||
// create a new color map for colours 1-13 and use it instead
|
||||
for (auto i = 1; i <= 13; i++)
|
||||
{
|
||||
cmap[i] = random(0x10000);
|
||||
}
|
||||
@@ -161,10 +145,9 @@ void loop(void)
|
||||
|
||||
// Draw a blue rectangle in sprite so when we move it 1 pixel it does not leave a trail
|
||||
// on the blue screen background
|
||||
cmap[14] = TFT_BLUE;
|
||||
spr.createPalette(cmap, 16);
|
||||
spr.createPalette(cmap);
|
||||
|
||||
spr.drawRect(0, 0, WIDTH, HEIGHT, 14);
|
||||
spr.drawRect(0, 0, WIDTH, HEIGHT, 15); // Blue rectangle
|
||||
|
||||
int x = tft.width() / 2 - WIDTH / 2;
|
||||
int y = tft.height() / 2 - HEIGHT / 2;
|
||||
@@ -183,7 +166,15 @@ void loop(void)
|
||||
if (y < -HEIGHT/2) dy = 1;
|
||||
if (y >= tft.height()-HEIGHT/2) dy = -1;
|
||||
|
||||
// Draw it 50 time, moving in random direct or staying still
|
||||
// Randomise the palette to change colours without redrawing
|
||||
// the sprite
|
||||
for (auto i = 1; i <= 13; i++)
|
||||
{
|
||||
cmap[i] = random(0x10000);
|
||||
}
|
||||
spr.createPalette(cmap); // Update sprite class palette
|
||||
|
||||
// Draw it 50 times, moving in random direct or staying still
|
||||
n = 50;
|
||||
int wait = random (50);
|
||||
while (n)
|
||||
@@ -205,4 +196,3 @@ void loop(void)
|
||||
}
|
||||
} // Infinite while, will not exit!
|
||||
}
|
||||
|
||||
+32
-32
@@ -1,7 +1,7 @@
|
||||
/*
|
||||
Sketch to show scrolling of the graphics in sprites.
|
||||
Sketch to show scrolling of the graphics in 4 bit sprites.
|
||||
Scrolling in this way moves the pixels in a defined rectangle
|
||||
within the Sprite. By defalt the whole sprite is scrolled.
|
||||
within the Sprite. By default the whole sprite is scrolled.
|
||||
The gap left by scrolling is filled with a defined colour.
|
||||
|
||||
Example for library:
|
||||
@@ -14,10 +14,7 @@
|
||||
any position. If there is sufficient RAM then the Sprite can
|
||||
be the same size as the screen and used as a frame buffer.
|
||||
|
||||
A 16 bit Sprite occupies (2 * width * height) bytes in RAM.
|
||||
|
||||
An 8 bit Sprite occupies (width * height) bytes in RAM.
|
||||
|
||||
A 4 bit Sprite occupies (width * height)/2 bytes in RAM.
|
||||
*/
|
||||
|
||||
#include <TFT_eSPI.h>
|
||||
@@ -35,7 +32,8 @@ int delta = 1;
|
||||
int grid = 0;
|
||||
int tcount = 0;
|
||||
|
||||
uint16_t cmap[16];
|
||||
// Palette colour table
|
||||
uint16_t palette[16];
|
||||
|
||||
//==========================================================================================
|
||||
void setup() {
|
||||
@@ -43,47 +41,49 @@ void setup() {
|
||||
tft.init();
|
||||
tft.fillScreen(TFT_BLACK);
|
||||
|
||||
cmap[0] = TFT_BLACK;
|
||||
cmap[1] = TFT_ORANGE;
|
||||
cmap[2] = TFT_DARKGREEN;
|
||||
cmap[3] = TFT_DARKCYAN;
|
||||
cmap[4] = TFT_MAROON;
|
||||
cmap[5] = TFT_PURPLE;
|
||||
cmap[6] = TFT_OLIVE;
|
||||
cmap[7] = TFT_DARKGREY;
|
||||
cmap[8] = TFT_ORANGE;
|
||||
cmap[9] = TFT_BLUE;
|
||||
cmap[10] = TFT_GREEN;
|
||||
cmap[11] = TFT_CYAN;
|
||||
cmap[12] = TFT_RED;
|
||||
cmap[13] = TFT_NAVY;
|
||||
cmap[14] = TFT_YELLOW;
|
||||
cmap[15] = TFT_WHITE;
|
||||
// Populate the palette table, table must have 16 entires
|
||||
palette[0] = TFT_BLACK;
|
||||
palette[1] = TFT_ORANGE;
|
||||
palette[2] = TFT_DARKGREEN;
|
||||
palette[3] = TFT_DARKCYAN;
|
||||
palette[4] = TFT_MAROON;
|
||||
palette[5] = TFT_PURPLE;
|
||||
palette[6] = TFT_OLIVE;
|
||||
palette[7] = TFT_DARKGREY;
|
||||
palette[8] = TFT_ORANGE;
|
||||
palette[9] = TFT_BLUE;
|
||||
palette[10] = TFT_GREEN;
|
||||
palette[11] = TFT_CYAN;
|
||||
palette[12] = TFT_RED;
|
||||
palette[13] = TFT_NAVY;
|
||||
palette[14] = TFT_YELLOW;
|
||||
palette[15] = TFT_WHITE;
|
||||
|
||||
// Create a sprite for the graph
|
||||
graph1.setColorDepth(4);
|
||||
graph1.createSprite(128, 61);
|
||||
graph1.createPalette(cmap, 16);
|
||||
graph1.fillSprite(9); // Note: Sprite is filled with black when created
|
||||
graph1.createPalette(palette);
|
||||
graph1.fillSprite(9); // Note: Sprite is filled with palette[0] colour when created
|
||||
|
||||
// The scroll area is set to the full sprite size upon creation of the sprite
|
||||
// but we can change that by defining a smaller area using "setScrollRect()"if needed
|
||||
// parameters are x,y,w,h,color as in drawRect(), the color fills the gap left by scrolling
|
||||
|
||||
//graph1.setScrollRect(64, 0, 64, 61, TFT_DARKGREY); // Try this line to change the graph scroll area
|
||||
|
||||
// Create a sprite for the scrolling numbers
|
||||
stext1.setColorDepth(4);
|
||||
stext1.createSprite(32, 64);
|
||||
stext1.createPalette(cmap, 16);
|
||||
stext1.fillSprite(9); // Fill sprite with blue
|
||||
stext1.setScrollRect(0, 0, 32, 64, 9); // here we set scroll gap fill color to blue
|
||||
stext1.setTextColor(15); // White text, no background
|
||||
stext1.createPalette(palette);
|
||||
stext1.fillSprite(9); // Fill sprite with palette colour 9 (blue in this example)
|
||||
stext1.setScrollRect(0, 0, 32, 64, 9); // here we set scroll gap fill color to blue
|
||||
stext1.setTextColor(15); // Palette colour 15 (white) text, no background
|
||||
stext1.setTextDatum(BR_DATUM); // Bottom right coordinate datum
|
||||
|
||||
// Create a sprite for Hello World
|
||||
stext2.setColorDepth(4);
|
||||
stext2.createSprite(80, 16);
|
||||
stext2.createPalette(cmap, 16);
|
||||
stext2.createPalette(palette);
|
||||
stext2.fillSprite(7);
|
||||
stext2.setScrollRect(0, 0, 40, 16, 7); // Scroll the "Hello" in the first 40 pixels
|
||||
stext2.setTextColor(15); // White text, no background
|
||||
@@ -97,7 +97,7 @@ void loop() {
|
||||
// Draw number in stext1 sprite at 31,63 (bottom right datum set)
|
||||
stext1.drawNumber(graphVal, 31, 63, 2); // plot value in font 2
|
||||
|
||||
// Push the sprites onto the TFT at specied coordinates
|
||||
// Push the sprites onto the TFT at specified coordinates
|
||||
graph1.pushSprite(0, 0);
|
||||
stext1.pushSprite(0, 64);
|
||||
stext2.pushSprite(40, 70);
|
||||
@@ -132,7 +132,7 @@ void loop() {
|
||||
|
||||
tcount--;
|
||||
if (tcount <=0)
|
||||
{ // If we have scrolled 40 pixels the redraw text
|
||||
{ // If we have scrolled 40 pixels then redraw text
|
||||
tcount = 40;
|
||||
stext2.drawString("Hello World", 6, 0, 2); // draw at 6,0 in sprite, font 2
|
||||
}
|
||||
@@ -0,0 +1,146 @@
|
||||
/*
|
||||
Sketch to show creation of a 4 bit sprite with a transparent
|
||||
background, then plot it on the TFT. The palette setup and
|
||||
palette update functions are also shown in this example.
|
||||
|
||||
Example for library:
|
||||
https://github.com/Bodmer/TFT_eSPI
|
||||
|
||||
A Sprite is notionally an invisible graphics screen that is
|
||||
kept in the processors RAM. Graphics can be drawn into the
|
||||
Sprite just as it can be drawn directly to the screen. Once
|
||||
the Sprite is completed it can be plotted onto the screen in
|
||||
any position. If there is sufficient RAM then the Sprite can
|
||||
be the same size as the screen and used as a frame buffer.
|
||||
|
||||
A 4 bit Sprite occupies (width * height)/2 bytes in RAM.
|
||||
For example the "star" 70x80 Sprite uses 2800 bytes.
|
||||
*/
|
||||
|
||||
// This is the default palette for 4 bit colour sprites
|
||||
// which is built into the library. You can create your
|
||||
// own palette (use a different array name!). The palette
|
||||
// is captured and stored in RAM by the Sprite class so a
|
||||
// copy does not need to be kept in the sketch.
|
||||
|
||||
// The default library palette is stored in FLASH and is called:
|
||||
// default_4bit_palette
|
||||
// To edit colours change the default_4bit_palette array name
|
||||
// at line 32, then edit line 77 to match new name.
|
||||
// To setup you own palette edit the next line to //*
|
||||
/*
|
||||
static const uint16_t default_4bit_palette[] PROGMEM = {
|
||||
TFT_BLACK, // 0 ^
|
||||
TFT_BROWN, // 1 |
|
||||
TFT_RED, // 2 |
|
||||
TFT_ORANGE, // 3 |
|
||||
TFT_YELLOW, // 4 Colours 0-9 follow the resistor colour code!
|
||||
TFT_GREEN, // 5 |
|
||||
TFT_BLUE, // 6 |
|
||||
TFT_PURPLE, // 7 |
|
||||
TFT_DARKGREY, // 8 |
|
||||
TFT_WHITE, // 9 v
|
||||
TFT_CYAN, // 10 Blue+green mix
|
||||
TFT_MAGENTA, // 11 Blue+red mix
|
||||
TFT_MAROON, // 12 Darker red colour
|
||||
TFT_DARKGREEN,// 13 Darker green colour
|
||||
TFT_NAVY, // 14 Darker blue colour
|
||||
TFT_PINK // 15
|
||||
};
|
||||
//*/
|
||||
|
||||
#include <TFT_eSPI.h> // Include the graphics library (this includes the sprite functions)
|
||||
|
||||
TFT_eSPI tft = TFT_eSPI(); // Create object "tft"
|
||||
|
||||
TFT_eSprite spr = TFT_eSprite(&tft); // Create Sprite object "spr" with pointer to "tft" object
|
||||
// the pointer is used by pushSprite() to push it onto the TFT
|
||||
|
||||
void setup(void) {
|
||||
Serial.begin(115200);
|
||||
|
||||
tft.init();
|
||||
|
||||
tft.setRotation(0);
|
||||
}
|
||||
|
||||
void loop() {
|
||||
|
||||
tft.fillScreen(TFT_DARKGREY);
|
||||
|
||||
// Set color depth to 4 bits
|
||||
spr.setColorDepth(4);
|
||||
spr.createSprite(70, 80); // The Sprite MUST be created before setting the palette!
|
||||
|
||||
// Pass the default library palette to the Sprite class
|
||||
// Edit palette array name if you use your own palette
|
||||
spr.createPalette(default_4bit_palette); // <<<<<<<<<<<<<<<<<<<<<<<<< palette array name
|
||||
|
||||
// If <16 colours are defined then specify how many
|
||||
// spr.createPalette(default_4bit_palette, 12);
|
||||
|
||||
// After rendering a Sprite you can change the palette to increase the range of colours
|
||||
// plotted to the screen to the full 16 bit set.
|
||||
|
||||
// Change palette colour 11 to violet
|
||||
spr.setPaletteColor(11, TFT_VIOLET);
|
||||
|
||||
uint16_t color15 = spr.getPaletteColor(15); // The 16 bit colour in a palette can be read back
|
||||
|
||||
// Draw 50 sprites containing a "transparent" colour
|
||||
for (int i = 0; i < 50; i++)
|
||||
{
|
||||
int x = random(tft.width() - 70);
|
||||
int y = random(tft.height() - 80);
|
||||
int c = random(15); // Random colour 0-14 (4 bit index into color map). Leave 15 for transparent.
|
||||
drawStar(x, y, c);
|
||||
}
|
||||
|
||||
delay(2000);
|
||||
|
||||
// Change the palette to a 16 bit grey scale colour
|
||||
for (uint8_t i = 0; i < 16; i++) {
|
||||
// (i*16+i) produces a value in range 0-255 for the RGB colours
|
||||
// Red Green Blue
|
||||
spr.setPaletteColor(i, tft.color565(i*16+i, i*16+i, i*16+i));
|
||||
}
|
||||
|
||||
// Now go bananas and draw 500 more
|
||||
for (int i = 0; i < 500; i++)
|
||||
{
|
||||
int x = random(tft.width() - 70);
|
||||
int y = random(tft.height() - 80);
|
||||
int c = random(0x10); // Random colour
|
||||
drawStar(x, y, c);
|
||||
yield(); // Stop watchdog reset
|
||||
}
|
||||
|
||||
// Delete it to free memory, the Sprite copy of the palette is also deleted
|
||||
spr.deleteSprite();
|
||||
|
||||
delay(2000);
|
||||
}
|
||||
|
||||
// #########################################################################
|
||||
// Plot graphics to sprite using defined color and plot to screen
|
||||
// #########################################################################
|
||||
void drawStar(int x, int y, int star_color)
|
||||
{
|
||||
// star_color will be in the range 0-14 so that 15 is reserved for the
|
||||
// transparent colour
|
||||
|
||||
// Fill Sprite with the chosen "transparent" colour
|
||||
spr.fillSprite(15); // Fill with color 15
|
||||
|
||||
// Draw 2 triangles to create a filled in star
|
||||
spr.fillTriangle(35, 0, 0, 59, 69, 59, star_color);
|
||||
spr.fillTriangle(35, 79, 0, 20, 69, 20, star_color);
|
||||
|
||||
// Punch a star shaped hole in the middle with a smaller transparent star
|
||||
spr.fillTriangle(35, 7, 6, 56, 63, 56, 15);
|
||||
spr.fillTriangle(35, 73, 6, 24, 63, 24, 15);
|
||||
|
||||
// Push sprite to TFT screen at coordinate x,y (top left corner)
|
||||
// Specify what colour from the palette is treated as transparent.
|
||||
spr.pushSprite(x, y, 15);
|
||||
}
|
||||
-168
@@ -1,168 +0,0 @@
|
||||
/*
|
||||
Sketch to show creation of a sprite with a transparent
|
||||
background, then plot it on the TFT.
|
||||
|
||||
Example for library:
|
||||
https://github.com/Bodmer/TFT_eSPI
|
||||
|
||||
A Sprite is notionally an invisible graphics screen that is
|
||||
kept in the processors RAM. Graphics can be drawn into the
|
||||
Sprite just as it can be drawn directly to the screen. Once
|
||||
the Sprite is completed it can be plotted onto the screen in
|
||||
any position. If there is sufficient RAM then the Sprite can
|
||||
be the same size as the screen and used as a frame buffer.
|
||||
|
||||
A 16 bit Sprite occupies (2 * width * height) bytes in RAM.
|
||||
|
||||
On a ESP8266 Sprite sizes up to 126 x 160 can be accomodated,
|
||||
this size requires 40kBytes of RAM for a 16 bit colour depth.
|
||||
|
||||
When 8 bit colour depth sprites are created they occupy
|
||||
(width * height) bytes in RAM, so larger sprites can be
|
||||
created, or the RAM required is halved.
|
||||
*/
|
||||
|
||||
#include <TFT_eSPI.h> // Include the graphics library (this includes the sprite functions)
|
||||
|
||||
TFT_eSPI tft = TFT_eSPI(); // Create object "tft"
|
||||
|
||||
TFT_eSprite img = TFT_eSprite(&tft); // Create Sprite object "img" with pointer to "tft" object
|
||||
// the pointer is used by pushSprite() to push it onto the TFT
|
||||
|
||||
TFT_eSprite img2 = TFT_eSprite(&tft);
|
||||
|
||||
void setup(void) {
|
||||
Serial.begin(250000);
|
||||
|
||||
tft.init();
|
||||
|
||||
tft.setRotation(0);
|
||||
}
|
||||
|
||||
void loop() {
|
||||
|
||||
tft.fillScreen(TFT_NAVY);
|
||||
|
||||
img.setColorDepth(4);
|
||||
|
||||
// Draw 10 sprites containing a "transparent" colour
|
||||
for (int i = 0; i < 10; i++)
|
||||
{
|
||||
int x = random(240-70);
|
||||
int y = random(320-80);
|
||||
int c = random(0x0F); // Random colour (4 bit index into color map). Leave 15 for transparent.
|
||||
drawStar(x, y, c); // note: not random; should be c
|
||||
}
|
||||
|
||||
delay(2000);
|
||||
|
||||
uint32_t dt = millis();
|
||||
|
||||
// Now go bananas and draw 500 nore
|
||||
for (int i = 0; i < 500; i++)
|
||||
{
|
||||
int x = random(240-70);
|
||||
int y = random(320-80);
|
||||
int c = random(0x10); // Random colour
|
||||
drawStar(x, y, c);
|
||||
yield(); // Stop watchdog reset
|
||||
}
|
||||
|
||||
// Show time in milliseconds to draw and then push 1 sprite to TFT screen
|
||||
numberBox( 10, 10, (millis()-dt)/500.0 );
|
||||
delay(2000);
|
||||
|
||||
}
|
||||
|
||||
// #########################################################################
|
||||
// Create sprite, plot graphics in it, plot to screen, then delete sprite
|
||||
// #########################################################################
|
||||
void drawStar(int x, int y, int star_color)
|
||||
{
|
||||
// Create an 8 bit sprite 70x 80 pixels (uses 5600 bytes of RAM)
|
||||
img.setColorDepth(4);
|
||||
img.createSprite(70, 80);
|
||||
|
||||
uint16_t cmap[16];
|
||||
|
||||
cmap[0] = TFT_BLACK;
|
||||
cmap[1] = TFT_ORANGE;
|
||||
cmap[2] = TFT_DARKGREEN;
|
||||
cmap[3] = TFT_DARKCYAN;
|
||||
cmap[4] = TFT_MAROON;
|
||||
cmap[5] = TFT_PURPLE;
|
||||
cmap[6] = TFT_OLIVE;
|
||||
cmap[7] = TFT_LIGHTGREY;
|
||||
cmap[8] = TFT_DARKGREY;
|
||||
cmap[9] = TFT_BLUE;
|
||||
cmap[10] = TFT_GREEN;
|
||||
cmap[11] = TFT_CYAN;
|
||||
cmap[12] = TFT_RED;
|
||||
cmap[13] = TFT_MAGENTA;
|
||||
cmap[14] = TFT_YELLOW;
|
||||
cmap[15] = TFT_WHITE; // this one will be transparent.
|
||||
|
||||
img.createPalette(cmap, 16);
|
||||
|
||||
// Fill Sprite with a "transparent" colour
|
||||
// TFT_TRANSPARENT is already defined for convenience
|
||||
// We could also fill with any colour as "transparent" and later specify that
|
||||
// same colour when we push the Sprite onto the screen.
|
||||
img.fillSprite(15);
|
||||
|
||||
// Draw 2 triangles to create a filled in star
|
||||
img.fillTriangle(35, 0, 0,59, 69,59, star_color);
|
||||
img.fillTriangle(35,79, 0,20, 69,20, star_color);
|
||||
|
||||
// Punch a star shaped hole in the middle with a smaller transparent star
|
||||
// this one damages on pixel in the second triangle
|
||||
img.fillTriangle(35, 7, 6,56, 63,56, 15);
|
||||
img.fillTriangle(35,73, 6,24, 63,24, 15);
|
||||
|
||||
// Push sprite to TFT screen at coordinate x,y (top left corner)
|
||||
// Specify what colour from the map is to be treated as transparent.
|
||||
img.pushSprite(x, y, 15);
|
||||
|
||||
// Delete it to free memory
|
||||
img.deleteSprite();
|
||||
}
|
||||
|
||||
// #########################################################################
|
||||
// Draw a number in a rounded rectangle with some transparent pixels
|
||||
// #########################################################################
|
||||
void numberBox(int x, int y, float num )
|
||||
{
|
||||
|
||||
// Size of sprite
|
||||
#define IWIDTH 80
|
||||
#define IHEIGHT 35
|
||||
|
||||
// Create a 8 bit sprite 80 pixels wide, 35 high (2800 bytes of RAM needed)
|
||||
img.setColorDepth(8);
|
||||
img.createSprite(IWIDTH, IHEIGHT);
|
||||
|
||||
// Fill it with black (this will be the transparent colour this time)
|
||||
img.fillSprite(TFT_BLACK);
|
||||
|
||||
// Draw a background for the numbers
|
||||
img.fillRoundRect( 0, 0, 80, 35, 15, TFT_RED);
|
||||
img.drawRoundRect( 0, 0, 80, 35, 15, TFT_WHITE);
|
||||
|
||||
// Set the font parameters
|
||||
img.setTextSize(1); // Font size scaling is x1
|
||||
img.setTextColor(TFT_WHITE); // White text, no background colour
|
||||
|
||||
// Set text coordinate datum to middle right
|
||||
img.setTextDatum(MR_DATUM);
|
||||
|
||||
// Draw the number to 3 decimal places at 70,20 in font 4
|
||||
img.drawFloat(num, 3, 70, 20, 4);
|
||||
|
||||
// Push sprite to TFT screen CGRAM at coordinate x,y (top left corner)
|
||||
// All black pixels will not be drawn hence will show as "transparent"
|
||||
img.pushSprite(x, y, TFT_BLACK);
|
||||
|
||||
// Delete sprite to free up the RAM
|
||||
img.deleteSprite();
|
||||
}
|
||||
|
||||
Reference in new issue
Block a user