Image data like our thermometer usually doesn t change, so you should always
store it in flash RAM using the
in raw format. The first two bytes contain the width and height of an image.
The data that follows contains the image data line by line. In
each line of image data contains three bytes, because the image is 20 pixels
wide, and 20 pixels occupy three bytes. Consequently, the file contains 94
lines each representing a single line of the thermometer image. Because we ve
used binary literals to encode the image data, you can actually see how the
image looks when reading the source code. A
a
0
represents a black pixel.
Drawing Images for Your Arduino Programs
You can draw simple images directly in the source code by editing binary
numbers. As soon as your images get more complex, you need some tool
support. For graphics that are still fairly simple but that are too complex to
edit the binary numbers in the source code, you can use any drawing program,
of course, but most modern tools are way too complicated for this job.
I ve created the thermometer image with a fairly simple online tool named
6
Piskel
.
It s open source, it s easy to use, and it feels just right for creating
Arduino graphics. You can see it in action in
online editors for pixel graphics, on page
Applications like
Piskel
but they usually store these images in
you ll learn how to convert these files into source code.
Turning Pixels into C++ Code
After you ve finished your pixel art, you still have to convert it into a C/C++
file. You could do it manually, but that wouldn t be very pragmatic, would it?
It d be much better to write a small program that does the conversion auto-
matically.
You could write such a program in any modern programming language; we ll
use Ruby here. Processing graphics in Ruby is easy thanks to the rmagick
library. This library is a binding to ImageMagick,
forming images. Before you can install rmagick, you have to install
ImageMagick.
6.
http://www.piskelapp.com/
7.
http://www.imagemagick.org/
PROGMEM
directive. TVout expects image data
142.
really help to create images for your Arduino programs,
.gif
www.it-ebooks.info
Working with Graphics in TVout
thermometer.cpp
1
represents a white pixel, and
Figure 25, You can find good
or
.png
files. In the next section,
7
a powerful tool for trans-
141
,
report erratum
discuss
Need help?
Do you have a question about the Arduino Uno and is the answer not in the manual?