Ok, so we got a CuPID built and a touchscreen installed in Part I. The next step is installing the software to run it, and making some adjustments to make the small screen size usable for human fingers and eyes.
Adafruit’s tutorial is a good place to start. Let’s go to there. We download the five files as instructed, and follow the directions (we do that sometimes, honestly). When we’re done, including adding
export FRAMEBUFFER=/dev/fb1 to our
~/.profile configuration file, we can run startx to get our desktop on the touchscreen.
What this gives us is a desktop that, well, works, but isn’t optimized for this tiny little display. Take a look: the background doesn’t fit, the text isn’t suitably sized, and the icons are pretty much a mess.
So we start futzing with the lxde environment. On the Pi, pcmanfm is used to control the desktop, and the configuration for this can be found at
~ here means your home directory, which by default (and here) is
/home/pi. Taking a look at the file, we can see all sorts of options, at least a couple of which we want to change. First, we change the desktop image to one that’s the correct size, and also within our git repo at
/var/www so we can update it when we like, with, say, version information. This is the wallpaper parameter, and we simply set the path:
We’ve got an image there that’s 320×240, but we can set copy any image we want to the path (say, by a shell or python script) if we change resolution.
We go ahead and scale down the font a bit as well:
This helps a lot:
The icons are still everywhere (and huge). Let’s reorganize them. We’ll do it manually here, but there are other ways. This method also allows us to do it programmatically if we wish. Now, if we poke around in
.config/pcmanfm/LXDE/ , we find a file that defines our desktop icons’ positions. We can see the icons present in
~/Desktop (which is how we created our desktop icons. more on that later). So looking at the file, we see a list of icons, a few of which look like this:
[updatecupidweblibs.desktop] x=20 y=10 [updateiicontrollibs.desktop] x=20 y=60 [lxterminal.desktop] x=20 y=110 [wpa_gui.desktop] x=20 y=160
We can change their coordinates, and move them around as we see fit. With a little tweaking, we get this:
Not too bad. We could probably just do without the icon text. So we set the icon text size to 0. And, realistically, we probably won’t be using the terminal from the touchscreen, and if we decide we need it we’ll have a mouse and keyboard plugged in, so let’s just move it off the window. We can do that by moving the icons we don’t want out of the range of the visible window. This is nice, too, as we can make the icons visible on a larger screen (when we have a keyboard and mouse present). Or we can copy a particular screen configuration file into place. Here are the final icon settings:
[updatecupidweblibs.desktop] x=-20 y=0[updateiicontrollibs.desktop] x=-20 y=70 [lxterminal.desktop] x=-200 y=140 [wpa_gui.desktop] x=-20 y=140
And the result:
Now we’ve got a nice, clear screen with clickable update icons. Next, we want to design an interface for what we’re controlling. We’ll drop that down here in juuuust a minute. It will look a little bit like this.