Overview

Now you can beam images THROUGH THIN AIR from your mobile device to your Circuit Playground Bluefruit!

Use the TFT Gizmo's beautiful screen to display any image you like, and change your mind any time! Just whip out your phone or tablet running the Adafruit Bluefruit app (iOS or Android), and you can send a new image right to the Circuit Playground Bluefruit via Bluetooth LE. In mere seconds you'll have a brand spanking new image to admire!

You can use your new powers to make a handsome locket adorned with the face of a loved one, a HELLO my NAME IS badge, an interactive hat pin, and more!

Parts

Circuit Playground Bluefruit - ALPHA - Bluetooth Low Energy

PRODUCT ID: 4333
Circuit Playground Bluefruit is our third board in the Circuit Playground series, another step towards a perfect introduction to electronics and programming. We've...
OUT OF STOCK

Circuit Playground TFT Gizmo - Bolt-on Display + Audio Amplifier

PRODUCT ID: 4367
Extend and expand your Circuit Playground projects with a bolt on TFT Gizmo that lets you add a lovely color display in a sturdy and reliable fashion. This PCB looks just like a round...
$19.95
IN STOCK

Lithium Ion Polymer Battery with Short Cable - 3.7V 350mAh

PRODUCT ID: 4237
Lithium ion polymer (also known as 'lipo' or 'lipoly') batteries are thin, light and powerful. The output ranges from 4.2V when completely charged to 3.7V. This battery...
$5.95
IN STOCK

USB cable - USB A to Micro-B

PRODUCT ID: 592
This here is your standard A to micro-B USB cable, for USB 1.1 or 2.0. Perfect for connecting a PC to your Metro, Feather, Raspberry Pi or other dev-board or...
$2.95
IN STOCK

Fully Reversible Pink/Purple USB A to micro B Cable - 1m long

PRODUCT ID: 4111
This cable is not only super-fashionable, with a woven pink and purple Blinka-like pattern, it's also fully reversible! That's right, you will save seconds a day by...
$3.95
IN STOCK

You'll also need an iOS (11.3 or later) or Android device to install the Adafruit Bluefruit app.

Steps

First, we'll connect the TFT Gizmo to the Circuit Playground Bluefruit.

Then, we'll download the Adafruit Bluefruit app onto an iOS or Android device.

After uploading the quickstart .UF2 file to the CPB, we'll be ready to start beaming images to the device! Let's get started.

Assembly

Placing the Circuit Playground TFT Gizmo on the Circuit Playground Express or Circuit Playground Bluefruit is pretty straightforward. All you need is a #2 Phillips screwdriver.

There may be plastic covers over the screw holes on the TFT Gizmo, which you will need to remove before assembly.

The amber colored Kapton tape dots must be removed from each of the twelve standoffs before assembling the boards. These are electrically insulating and will prevent the TFT Gizmo from working properly if left in place.

You can use your fingernails or some tweezers or a pin to poke and lift each dot as shown here.

Start by aligning the two boards side by side like in the photo with the black plastic speaker connector and battery connectors pointing in the same direction.

Place the Circuit Playground board on top of the TFT Gizmo being sure that the connectors mentioned in the previous step are still aligned.

Install a few screws loosely, so that all of the holes are still aligned, before tightening them down.

Finish installing the remaining screws. After that, you're done!

Bluefruit LE Connect

The Bluefruit LE Connect app provides iOS devices with a variety of tools to communicate with Bluefruit LE devices, such as the Circuit Playground Bluefruit! These tools cover basic communication and info reporting as well as more project specific uses such as remote button control and a NeoPixel color picker.

The iOS app is a free download from Apple's App Store. As of this writing, it requires iOS 11.3 or later and works on the iPhone, iPad, and iPod Touch.

Install Bluefruit LE

The first step is to install the app on your device.

Enable Bluetooth

If Bluetooth is disabled on your device, enable it by going to Setting > Bluetooth on your iOS device and then turning it on.

Enable Location Services

If you plan to use the app to send location/GPS data to Bluefruit LE, enable Location Services. Enable it on iOS using Settings->Privacy->Location Services.

Scan for Devices

Launch the app now -- it will automatically begin to scan the airwaves for Bluetooth LE devices. These are presented in a list at the bottom of the page.

Notice, you can use the Must have UART Service filter to prevent BLE devices from showing up that can't work with the app.

  • To refresh the list and start a new scan, simply swipe down on the current list.
  • Each device's signal strength is displayed in the left side of its row.

If you tap on the device entry (not on Connect), you'll see more detail about a particular device:

Connect

Tap the Connect button on the UART capable device you wish to use. The app will connect to the Circuit Playground Bluefruit! Now, you'll be presented with the Device name and signal strength, and a number of different Modules you can use.

 

Controller Module

Click on the Controller module. You'll see a number of different sensor data streaming options. Enabling these will allow you to send data from your phone, such as the Accelerometer data or Location data, directly to your Circuit Playground Bluefruit!

The two modules on this page that can send data to the Circuit Playground Bluefruit are the Control Pad and Color Picker.

Color Picker

Click on the Color Picker. Now, you can dial in the hue, saturation, and value of a color using the color wheel and value slider.

Follow this page for setting up the CPB with the color picker code.

Press the Send selected color button and your color values will be sent to the Circuit Playground Bluefruit to adjust its NeoPixels!

The app provides many other features with the additional modules. Have a look at the Bluefruit LE Connect for iOS and Android standalone guide for an explanation of each feature.

Image Transfer Quickstart

Next, we'll prepare the Circuit Playground Bluefruit for use. We've written some code and prepackaged it as a .UF2 file, so it'll be really simple to get it going!

First, download that CPB_Image_Transfer.UF2 file onto your computer.

Then, plug your Circuit Playground Bluetooth (CPB) into your computer via a known good USB data cable. (Not a "charge-only" cable!)

Double-click the reset button on the CPB and it will show up on your computer as drive called CPLAYBTBOOT.

Now, drag the CPB_Image_Transfer.UF2 file onto the CPLAYBTBOOT drive.

The TFT Gizmo screen will give you a status update as the Bluefruit device starts advertising.

Connect to App

Launch the Bluefruit Connect app on your mobile device.

You'll see the Bluefruit device listed as a choice, click Connect.

The TFT Gizmo display will indicate the connection has been made.

In the app, pick the Image Transfer module.

Image Module

In the image module there will be a default Adafruit flower logo image file pre-loaded. Let's send it!

If necessary, change the image resolution to 240x240 pixels, the native resolution of the TFT Gizmo screen.

Now, try uploading your own images. You can do so by clicking the Choose Image button and then either Take Photo, Camera roll, or Photo library to select an image.

Here's a video of the process in action:

Extra Credit

What if you transfer a picture of a Gizmo with a picture of a Gizmo with a picture of a Gizmo... ?

Extra Details

We've got lots more details on the Image Transfer module available here in the Bluefruit LE guide!

This guide was first published on Oct 24, 2019. It was last updated on Oct 24, 2019.