Skip to main content

Pictures from the web

What this example shows​

Connect to Wi-Fi and draw pictures straight from a web address with one function, image.draw(). The sketch draws two bitmaps one after the other, waits three seconds, clears the frame buffer and then draws a JPG, switching Wi-Fi off at the end.

Before you upload, write your network name and password between the quotes of ssid and password. The sketch's comments say that bitmap files can have a color depth of 1, 4, 8 or 24 bits, must have no compression and must be smaller than 800x480 pixels to fit on the screen.

This example also uses WiFi (arduino-esp32), which is not part of the Inkplate library and comes with the ESP32 board package.

Example code​

Select Board
Inkplate7SPECTRA_Show_Pictures_From_Web.ino
#include "HTTPClient.h" //Include library for HTTPClient
#include "Inkplate.h" //Include Inkplate library to the sketch
#include "WiFi.h" //Include library for WiFi
Inkplate inkplate; // Create an object on Inkplate library and also set library into 1 Bit mode (BW)

const char ssid[] = ""; // Your WiFi SSID
const char *password = ""; // Your WiFi password

void setup()
{
inkplate.begin(); // Init Inkplate library (you should call this function ONLY ONCE)
inkplate.clearDisplay(); // Clear frame buffer of display
inkplate.display(); // Put clear image on display

Serial.print("Connecting to WiFi...");

// Connect to the WiFi network.
WiFi.mode(WIFI_MODE_STA);
WiFi.begin(ssid, password);
while (WiFi.status() != WL_CONNECTED)
{
delay(500);
Serial.print(".");
}
Serial.println("\nWiFi OK! Downloading...");

// Draw the first image from web.
// Monochromatic bitmap with 1 bit depth. Images like this load quickest.
// NOTE: Both drawImage methods allow for an optional fifth "invert" parameter. Setting this parameter to true
// will flip all colors on the image, making black white and white black. This may be necessary when exporting
// bitmaps from certain softwares. Forth parameter will dither the image. Photo taken by: Roberto Fernandez
if (!inkplate.image.draw("https://varipass.org/neowise_mono.bmp", 0, 0, true, false))
{
// If is something failed (wrong filename or wrong bitmap format), write error message on the screen.
// REMEMBER! You can only use Windows Bitmap file with color depth of 1, 4, 8 or 24 bits with no compression!
inkplate.println("Image open error");
inkplate.display();
}
inkplate.display();

if (!inkplate.image.draw("https://varipass.org/neowise.bmp", 0, 0, true, false))
{
// If is something failed (wrong filename or wrong bitmap format), write error message on the screen.
// REMEMBER! You can only use Windows Bitmap file with color depth of 1, 4, 8 or 24 bits with no compression!
inkplate.println("Image open error");
inkplate.display();
}
inkplate.display();

inkplate.clearDisplay();
delay(3000);

// Try to load image and display it on e-paper at position X=0, Y=100
// NOTE: Both drawJpegFromWeb methods allow for an optional fifth "invert" parameter. Setting this parameter to
// true will flip all colors on the image, making black white and white black. forth parameter will dither the
// image.
if (!inkplate.image.draw("https://varipass.org/destination.jpg", 0, 100, true, false))
{
// If is something failed (wrong filename or format), write error message on the screen.
inkplate.println("Image open error");
inkplate.display();
}
inkplate.display();

WiFi.mode(WIFI_OFF);
}

void loop()
{
// Nothing...
}

Functions used​

Inkplate()returns None

Creates the Inkplate object. Inkplate 7SPECTRA has a single six-color mode, so the constructor takes no mode argument (the comment about 1-bit mode comes from other Inkplates).

ReturnsConstructor; no return value.

inkplate.begin()returns void

Initializes the library, the peripherals and the frame buffer. Call it once in setup().

ReturnsNothing.

inkplate.clearDisplay()returns void

Fills the frame buffer with white. It does not change the panel.

ReturnsNothing.

inkplate.display(bool _leaveOn = 0)returns void

Sends the whole frame buffer to the panel and refreshes it.

ReturnsNothing.

inkplate.image.draw(const char *path, int x, int y, bool dither = 1, bool invert = 0)returns bool

Draws an image at x, y. When the address starts with http:// or https://, the library downloads the file and picks the decoder from the file extension (bmp, dib, jpg, jpeg or png); without that prefix it reads the file from the microSD card. The sketch draws two bitmaps at (0, 0) and a JPG at (0, 100), each with dithering on and invert off. With invert on, all colors of the image are flipped.

Returnstrue if the image was drawn, false if it could not be opened or decoded.

inkplate.println(text)returns size_t

Prints text into the frame buffer and moves to the next line. The sketch uses it for the error message `Image open error`.

ReturnsNumber of bytes printed.

WiFi.mode(wifi_mode_t mode)returns bool

ESP32 board package: sets the Wi-Fi mode. The sketch uses WIFI_MODE_STA to connect to a network and WIFI_OFF at the end to switch Wi-Fi off.

Returnstrue if the mode was set.

WiFi.begin(ssid, password)returns wl_status_t

ESP32 board package: starts connecting to the network.

ReturnsConnection status.

WiFi.status()returns wl_status_t

ESP32 board package: the connection status; WL_CONNECTED once connected.

ReturnsConnection status.

What to expect​

The screen refreshes three times with pictures: first the black-and-white bitmap neowise_mono.bmp at the top-left corner, then the color bitmap neowise.bmp over it, and, after the three-second wait, the JPG destination.jpg placed 100 pixels from the top. If a picture cannot be opened, the screen shows Image open error.

The sketch prints its progress with Serial.print() but never calls Serial.begin(), so it does not set a baud rate itself.

🔗Open the complete example

examples/Inkplate7SPECTRA/Advanced/WEB_WiFi/Inkplate7SPECTRA_Show_Pictures_From_Web

→