Bitmap from esp32 SPIFFS?
zenmanenergy opened this issue · comments
This is more of a question than an issue. I'm just not sure where else to ask a question.
Is there a way to store a png image in the ESP32 SPIFFS filesystem then read the file and somehow pass the contents to the ssd1306_drawBitmap8() or ssd1306_drawMonoBitmap8() functions?
I started by copying the code in the sova.cpp and pasting it into this site: http://javl.github.io/image2cpp/
That site converted it to a png file which I saved and uploaded into my esp32's SPIFF filesystem. The name of the file is: "/birds.png" Then I tried this and some variations. It almost works, I'm getting static on the screen, but I don't see the birds.
`const char * filename="/birds.png";
fs::File imgFile = SPIFFS.open( filename, "r");
uint8_t buf[1534];
int siz = imgFile.size();
while(siz > 0) {
size_t len = min((int)(sizeof(buf) - 1), siz);
imgFile.read((uint8_t *)buf, len);
siz -= len;
imgFile.close();
}
ssd1306_drawMonoBitmap8(0, 0, 128, 64, buf);`
Anyone have any ideas on what is wrong?
Hi,
What exact options did you use on that site? I believe it should be Code Output format "Arduino code", Draw mode "vertical".
And could you please paste here your full sketch example. For color displays don't forget to call ssd1306_setMode( LCD_MODE_NORMAL ); before using 8-bit functions.
Yeah I did draw mode vertical and it displayed the image. Then I right clicked on the image and did 'save image as' (it was a .png file) storing it locally on my laptop storing it in a web accessible folder. Then I used an http GET function on the esp32 to download the .png file from my laptop (it was on a local network) to store it in SPIFFS. Then I tried to read the file from SPIFFS putting it into a uint8_t array and tried calling the ssd1306_drawMonoBitmap8() and ssd1306_drawBitmap8()
It seems like it almost works, but I'm not getting the right image. Just garbled pixels on the screen.
Oh, I'm using an st7735_128x160 screen.
This was based on the st7735 demo code. I added a few things in. I've zipped it up and attached the files.
That happens, because you read PNG-data to buffer, and those PNG-file contains not only pixels data, but also PNG-header. Maybe, PNG uses also some sort of compression after PNG-header, but ssd1306 library requires raw monochrome bitmap.
In you sketch, birds.png files takes 1534 bytes, but monochrome image needs only 128x64/8 = 1024 bytes. That means, that file contains no raw image data, suitable for the display. You need to use some PNG reader (you can search examples over Internet), or copy array data from http://javl.github.io/image2cpp/ to your sketch.
const char * filename="/birds.png";
fs::File imgFile = SPIFFS.open( filename, "r");
uint8_t buf[1534];
int siz = imgFile.size();
while(siz > 0) {
size_t len = min((int)(sizeof(buf) - 1), siz);
imgFile.read((uint8_t *)buf, len);
siz -= len;
imgFile.close();
}
Serial.println(sizeof(buf));
ssd1306_drawMonoBitmap8(0, 0, 128, 64, buf);By the way, be careful with a passwords. I hope, you've replaced Wi-Fi password in your sketch prior to loading to github ;)
Aha! That's starting to make sense!
If I convert the png to a bmp with photoshop would this code likely work? So is ssd1306_drawBitmap8() for full color whereas ssd1306_drawMonoBitmap8() is just black/white?
Sigh... that was dumb of me with my password. I just edited those other ones, here is the same code w/o passwords. Don't come to my house and hack my wifi! If you want access, just knock on the door and I'll give you the new password. :-)
Btw, the reason I don't want to use http://javl.github.io/image2cpp/ and copy the array into the sketch is it means I have to hardcode the images and recompile every time I want to change an image. Using this SPIFFS method means it can download the image from a server and update the image content on the device.
Darn. I just converted it to bmp but it is now 1154 bytes. I haven't tried uploading it to the device since I have to run to work. But it seems like there is still something extra in there.
Does bmp have a header? Is there a way to skip the header and get to the raw data content? Images and binary have always confused the hell out of me!
You can try to use some hex editor (https://www.hhdsoftware.com/free-hex-editor), and convert generated array to binary file for SPIFFS file system.
Did you solve the problem?
I hope that you found the way to put bitmap data to the SPIFFS file
No, I did not find a solution to it.