Bodmer / TFT_eFEX

A support library for TFT_eSPI that adds commonly used extra functions
Other
83 stars 27 forks source link

Render small area with an offset of a larger jpeg picture to a sprite #21

Closed Stke7 closed 4 years ago

Stke7 commented 4 years ago

Hi! i'm using an ESP32 with ILI9844 lcd screen and i'm trying to get small area with an offset of a larger jpeg picture to load onto a sprite. Please is it possible to add an overload to render to a sprite for the ESP32 function drawJpgFile(fs,path, x, y, maxWidth, maxHeight, offX, offY, scale); Thank you for making this awesome library!

Bodmer commented 4 years ago

You can already load a small area of a picture into a Sprite by setting the origin coordinate to a negative value, for example if the image is 100x100 and the Sprite is 50x50 then setting the x,y coordinate to -50, -50 will only render the bottom right 50x50 area to the Sprite.

Bear in mind that jpg files must be decompressed starting from the beginning so the decode time is not reduced by printing the smaller area in the above example.

Stke7 commented 4 years ago

Hmm I tried it but it only seems to render directly to the tft and the sprite remains black. I'll check again.

Stke7 commented 4 years ago

i'm actually using a huge picture of a map and just getting a small window. I'm not sure if i'm doing it right to render to a sprite but here's a test code using one of your sample pictures. it will render on the tft but not on the sprite. `

define FS_NO_GLOBALS

include

include "SPIFFS.h" // Needed for ESP32 only

include

include // Hardware-specific library

TFT_eSPI tft = TFT_eSPI(); // Invoke custom library TFT_eSprite spr = TFT_eSprite(&tft); // Declare Sprite object "spr" with pointer to "tft" object

include // Include the extension graphics functions library

TFT_eFEX fex = TFT_eFEX(&spr);

void setup() { tft.begin(); tft.setRotation(0); // 0 & 2 Portrait. 1 & 3 landscape tft.fillScreen(TFT_WHITE); if (!SPIFFS.begin()) { Serial.println("SPIFFS initialisation failed!"); while (1) yield(); // Stay here twiddling thumbs waiting } fex.listSPIFFS(); // Lists the files so you can see what is in the SPIFFS spr.createSprite(60, 60); } void loop() { uint8_t scale = (uint8_t)JPEG_DIV_2; fex.drawJpgFile(SPIFFS, "/BaboonL.jpg", 0, 0, 120, 120, 60, 60, (jpeg_div_t)scale); spr.pushSprite(100, 100); delay(5000); } `

Stke7 commented 4 years ago

You can already load a small area of a picture into a Sprite by setting the origin coordinate to a negative value, for example if the image is 100x100 and the Sprite is 50x50 then setting the x,y coordinate to -50, -50 will only render the bottom right 50x50 area to the Sprite.

Bear in mind that jpg files must be decompressed starting from the beginning so the decode time is not reduced by printing the smaller area in the above example.

Please could you give an example? I still can't get it to work.

Pconti31 commented 4 years ago

One problem is that you want to scale the image then take a piece and apply it to a sprite. You do need a new api to do that IMHO. Now ignoring that issue for the moment your code is in error as far as taken a piece of your image and giving it to the sprite. If you do this instead:

void loop()
{
  uint8_t scale = (uint8_t)JPEG_DIV_2;
  fex.drawJpgFile(SPIFFS, "/BaboonL.jpg", 0, 0, 120, 120, 60, 60, (jpeg_div_t)scale);
  fex.drawJpeg("/BaboonL.jpg", -60, -60, &spr);
  spr.pushSprite(100, 100);
  delay(5000);
}

I believe you will get the same segment but not scaled of course.

Stke7 commented 4 years ago

One problem is that you want to scale the image then take a piece and apply it to a sprite. You do need a new api to do that IMHO. Now ignoring that issue for the moment your code is in error as far as taken a piece of your image and giving it to the sprite. If you do this instead:

void loop()
{
  uint8_t scale = (uint8_t)JPEG_DIV_2;
  fex.drawJpgFile(SPIFFS, "/BaboonL.jpg", 0, 0, 120, 120, 60, 60, (jpeg_div_t)scale);
  fex.drawJpeg("/BaboonL.jpg", -60, -60, &spr);
  spr.pushSprite(100, 100);
  delay(5000);
}

I believe you will get the same segment but not scaled of course.

Thanks for the example! Now i understand how it works. The Sprite image actually slight brighter than the original for some reason. Thanks again!