Inkplate 10 loading external webpages and displaying formatted text

TECHNICAL SUPPORT Inkplate
1

Customer:

Is it possible to load a simple webpage on the Inkplate 10? It would contain text only.

Originally submitted via email support on 24 July 2023. Migrated to the forum for community visibility.

2

Soldered Support:

There are two main approaches:

  1. The library includes an example under Advanced>Web_WiFi>HTTP Web Server which demonstrates hosting a web server on Inkplate itself, accessible via WiFi. Through this website you can send text which is then displayed on Inkplate.

  2. If you want to load an external web page on Inkplate 10, look at the HTTP Request example in the same folder. This demonstrates loading a simple website - you would filter the element containing the text of interest and display it on Inkplate.

3

Customer:

Your examples would probably come close to what I’m looking for. I want to display one random sentence from a database every day for learning a foreign language. I need to be flexible to add and remove sentences easily. I was thinking about pulling sentences from a Google Sheet document. Would this be possible with Inkplate?

I read that Inkplate does not parse HTML, just reads it. Do I have the possibility to style the text being displayed?

4

Soldered Support:

This is entirely possible with Inkplate. You can use the Google Sheets API (free for simple usage like this) with an HTTPS GET request - there’s an example for this in the library.

API details: Basic reading  |  Google Sheets  |  Google for Developers

You can generate a random number on Inkplate and inject it into the GET request’s URL using sprintf to fetch a random row. The GET response will be a JSON string which you can parse using the ArduinoJSON library (check network.cpp files in example projects for details).

Alternatively, you can store text on an SD card in a large text file and display a random row from it - check the SD card examples for reading text.

You can style the text using various fonts and by changing text size and position. This is demonstrated in the library examples/projects where you can also find different font files and how to include them.