HTE - Anode & Cathode RGB LED

Overview

For Fullscreen: https://www.youtube.com/watch?v=r9NgBZ3vFnQ

This tutorial will show you how to connect and use Anode and Cathode RGB LEDs with the Quantum system and create a demo using it.


Different types of RGB LEDs

There are two different types of RGB LEDs there are Anodes and Cathodes.

Both have 4 pins. The red pin is the lowest pin on the right side. Then the cathode pin comes which is basically the same as a ground pin. Then you have a green and finally a blue pin. For the anode the only difference is the longest pin which is in this case the power pin for 3.3 V.


Assemble the Circuit

Picture

Name

Quantity

Link

Picture

Name

Quantity

Link

 

RGB LED

2

You can purchase them here

Male to Male and Male to Female jumper wires

8

Included in Component Kit

Or you can purchase it here

 

100 Ω Resistor

6

Can be purchased here

Q-Client Builder Base

2

Q-Client

If you have all the parts listed above, we can go ahead and build the circuits:

As you can see for the anode the wire is connected to the 3 V of the Builder Base and for the cathode the wire is connected to the GND of the Builder Base.


Pair the Builder Base

Now we want to pair the Builder Base with our Q-Server. In order to do so, go to the Homescreen of your Q-Server.

Next click on the lift side symbol labeled “Clients”. Switch to the “Unpaired” tab at the top middle of the screen.

You should see your unpaired Builder Base. If not, check if you have plugged in the power supply for the Builder Base. Now move to the three dots below “Actions” and click “Pair”.

Once your Client is paired, click the “Setup” button.

Now you can edit your Client. Give him a Name you want and also a location where you are going to use it. Hit “Save” when you finished.


Build the Firmware

So once the Builder Bases are paired and set up, we can start building our firmware. Move to the “Firmware” tab on the left side of your Q-Server interface. Hit “+ Create New”.

You will be prompted to give your new firmware a name. We named ours “RGB Anode” and “RGB Cathode“ because we need two.

Once you created the new firmware, hit the “+ Add Hardware” button on the top, next to the “Actions” button.

We are going to search for a “LED RGB”. You can use the search bar or scroll down till you find it. After this, you can give it a name and then click on “Add Hardware”. We named ours “RGB Anode” and “RGB Cathode”. Next we need to configure the firmware.

 

 

Select the right pins you connected the red blue and green pin of the RGB Led to the Builder Base to. Also make sure to have the right layout for the anode and cathode RGB Led.

Next we have to upload the firmware file to our Builder Base. Click on the three dots below “Actions” and click on “Upload”:

Choose the correct Builder Base and hit “Upload”. You should see a progress bar pop up at the right side of your screen. Make sure to upload the RGB Cathode firmware to the Builder Base which is connected to the cathode and upload the RGB Anode firmware to the Builder Base with the anode.


Build the App

While the firmware is uploading, we can build the application for our Button. Move to the “Apps” tab on the left side. Click on “Create New” and give it a name you want. We named ours again “RGB LEDs”. Hit “Create”.

You will find yourself on the Canvas.

For this tutorial we will need two “Color Picker” interface objects and two “LED RGB” hardware objects. Make sure to name each object and also label it so you can see later on which RGB is which.

Just connect the “Color Picker” with the port of the “LED RGB”. We need two of these because we have a RGB Cathode and RGB Anode.

Click “Save App” on the top right. You will return to the first screen of the “Apps” tab. Now click the play button on the bar located at the right side.

Now we have to map the hardware and interface objects to the actual hardware of the circuit we have put together before. Be sure to connect the right RGB Cathode with the Builder Base which is connected to the RGB LED Cathode and vice versa.

Once you done click “Save + Run”.


Run the App!

Click on the “Dashboard” icon in the top right corner.

Click on the icon to open it. It should look like this.

If you now change the color of the LEDs in the dashboard app the color should be shown by the LEDs.


Trigger a LED

For the second demo we are going to take it one step further. We will connect an ultrasonic sensor which will trigger the led depending on the distance to an object to display red, yellow and green. You can use either the anode or cathode LED. We are going to use the anode one.

We are not going into detail about the ultrasonic sensor but if you want more information have a look at .

First we are going to build the circuit for the sensor. We will need an additional Builder Base for the sensor.

Make sure to build the firmware for the new Builder Base which ist connected to the sensor.

We now need to change the app we build before.

As you can see the distance sensor will give its data to a number comparison. The signal will then be split depending on the compared numbers and each result like equal or less will trigger a static string which stands for one color. For the comparing number we set it to 5 inches. Then the color will be send to the LED. To give a color to the static strings we need to configure them. Click on one of the static strings and then on the string. You can now type in something. For red color we use “#ff0000“, for green “1dff00“ and for the yellow one we use “ffea00“.

The completed app should look like this.

When you are done hit “Save App” and start the app again. We then need to map the sensor.

Make sure to choose the right Builder Base. Now go back to the dashboard and start the app.

As you can see when we are over the 5 inches the LED will turn red. Now if we go under 5 inches it will turn green.

This is how you connect and use a RGB LED with the Quantum System. We also learned what the difference between an anode and a cathode LED is and how to use it with an ultrasonic sensor.

Happy Making!