Introduction: Raspberry Pi Touchscreen Display Tutorial

Picture of Raspberry Pi Touchscreen Display Tutorial

Ditch your HDMI cables cause now you can have a screen on your Pi! This Instructable will walk you through the process of getting your Pi setup with a touchscreen display and how you can use it to fit your needs. Any type of HAT-style display can be invaluable for any project as they allow you to debug your Pi without the need for an external monitor. You can deploy your project and monitor its progress all from the Pi itself.

Step 1: Parts Needed

Picture of Parts Needed

The display and Pi are the main components of this project. DFRobot sells an excellent display that I'll be talking about in this tutorial:

If you don't have a keyboard/mouse, micro SD card, and a power supply handy then you might want to pick those up as well:

This display also supports DFRobot's gravity interface. You can connect up to three sensing modules to the display:

Note: you will need an HDMI display to get the system up and running, but once the display is setup you will no longer need the HDMI display.

Step 2: Getting the Display Running

Picture of Getting the Display Running

The first thing you need to do is get your SD card configured correctly. Start by downloading a disk image of Raspbian to your computer from this website:

The latest version of Raspbian doesn't yet work with the display's drivers. I downloaded the raspbian-2017-01-10/ release and it worked great. I like to use the app Etcher to install the image files onto my SD cards: Etcher essentially does everything for you. Simply open the app, select your disk image and your SD card, and let it run.

After Etcher finishes you can insert the SD card into your Pi, connect the HDMI display, and power it up. Some text should flash across the screen and the Pi should boot to the Raspbian desktop. Connect your Pi to wifi or ethernet, then visit this page. It will go through the process of explaining how to install the display drivers. Before you run the scripts make sure you attach the touchscreen to the Pi.

Step 3: Display Characteristics

Picture of Display Characteristics

Provided everything ran correctly your display should now show the Raspbian desktop! You can now unplug your HDMI display. As you can see from the images above the viewing angles of the screen are only OK. While horizontal you can see the display's content up until about a 30° angle, but in portrait it's much less. The colors are pretty good but everything has a slight bluish tint. It's not nearly as pronounced as it looks in the photos.

The touchscreen is surprisingly responsive and is actually useful for navigating. This surprised me, because Raspbian doesn't initially strike me as very touch-friendly. The touchscreen isn't capacitive like the one on your phone or tablet; rather than sensing electrical current the display simply relies on pressure. You can use any object like a toothpick to activate resistive touchscreens such as this one.

The refresh rate is sufficient for general navigation, but I'll talk about video performance in the next step.

Step 4: Video and Web Performance

Picture of Video and Web Performance

A common use case for the Raspberry Pi is as a media-consumption device. Thus it's important to address video on this touchscreen.

I'd peg the screen refresh rate at around 20Hz. This means that it's just barely suitable for watching videos. It certainly works, but I wouldn't use this display for the sole purpose of media consumption. It's definitely doable to navigate around YouTube and other video streaming sites using the built-in Chromium, however. The Raspberry Pi 3 B is actually pretty snappy, especially when it only needs to drive a small number of pixels. There's no noticeable lag when browsing the internet. You're not afforded very much screen real-estate, though, so I wouldn't recommend reading a novel on this thing. Touch navigation does work, but I would recommend using a mouse for a better experience. All the onscreen keyboards I found were too cramped to be used properly with fingers so I would just go with a physical keyboard.

Step 5: Expansion and Making

Picture of Expansion and Making

As mentioned before, the DFRobot touchscreen has slots for three gravity modules. This allows you to easily add sensing or output capabilities to any project without any soldering. The gravity interface makes connecting things together very easy.

If you want to create a project using anything else most of the Raspberry Pi's pins are broken out on the side of the board. I can see this touchscreen as being an ideal solution for makers as it allows individuals to have completely self-contained projects without the need for an external monitor. It would be pretty simple to whip up some code in Python that takes inputs from the GPIO and displays them on a graph or gauge that's optimized for this screen.

In conclusion, this is a great display for a variety of purposes. Its video and gaming performance might be lacking but this touchscreen is an excellent solution for general interaction with your Pi.


About This Instructable




More by AlexFW:Raspberry Pi Touchscreen Display TutorialMixtile GENA: Getting Started With the Wearable Electronics PlatformNever Forget Your Keys: NFC Door Reminder
Add instructable to: