HTE - Joystick

Overview

For Fullscreen: https://www.youtube.com/watch?v=UwUF_x-2Zz8

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


What is a joystick?

A joystick is an input device consisting of a stick that communicates in 2D. This is achieved by using two 10k potentiometers, one for the x-axis and one for the y-axis.

These potentiometers are used a dual adjustable voltage dividers providing two axis analog inputs. The joystick also contains a switch which activates when you push down on the cap. Since there are many different gpio joysticks, we are using the joystick which is provided by the Component Kit as a reference for the layout and the connection to the Builder Base.

Let’s take a look at the pins of the joystick. First pin is the “GND” pin which will go to a ground terminal on your Builder Base. The next pin say’s “+5V” on your joystick however this is going to be different on where we wire it to on the Builder Base. We will actually be wiring the power to 3.3 V on the Builder Base. The reason it say’s “+5V” on the joystick is because it’s common for other platforms to use 5 V however they’re also making the transition to 3.3 V. Make sure to wire it to the 3.3 V of the Builder Base otherwise your analog inputs are going to be skewed and it won’t work. Next pin is the “vRx” which controls the x-axis potentiometer and then gives you the analog inputs for that. This will be plugging into a gp terminal on the Builder Base. Same for the “vRy” pin which controls the y-axis potentiometer. Last pin is the “SW“ pin which gives you the digital data received by the push button on your joystick and this will also be connected to a gp terminal on your Builder Base.


Assemble the Circuit

Picture

Name

Quantity

Link

Picture

Name

Quantity

Link

 

Joystick

1

Included in the Component Kit

Or, they can be purchased here

Jumper wires (male to female)

5

Included in Component Kit

Or you can purchase it here

Q-Client Builder Base

1

Q-Client

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

Connect the “GND” pin of the joystick with the “GND” pin of the Builder Base. Also connect the 3.3V terminal of the Builder Base with the “VCC” pin of the joystick. For the rest three pins you can use GP0 to GP6 terminals. Connect each to a different terminal.


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 “Joystick”.

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 “Joystick” hardware. 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 “Joystick” as well. Next we need to configure the firmware.

 

 

 

As you can see the joystick consists of three adjustable services we all need to configure. For the “Driver” all use “GPIO” and for the pins simply select the ones you connected to the terminal of the Builder Base.

Choose the correct Builder Base and hit “Upload”. You should see a progress bar pop up at the right side of your screen.


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 “Joystick Demo”. Hit “Create”.

You will find yourself on the Canvas.

For this tutorial we will need one “Joystick” hardware object, two “Text” interface objects and one “Switch” interface object. Make sure to name each object and also label it.

The “Joystick” object will be connected with each interface object so we can get an output when we use the joystick. Make sure to name them so you can differentiate them. The two “Text” objects will send out either “X-Axis” or “Y-Axis” depending on the joystick movement.

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 joystick app with the Builder Base which is connected to the joystick.

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 direction of the joystick in one direction it should change the displayed value.

As you can see we are getting 0 for the x-axis and when we move the joystick to the right it should change to 4095.

Now to the switch. The slider should look activated when you are not pushing the button of the joystick.

If you push the button now the slider should turn to off.


RC car

In the next demonstration we will use the joystick for a more practical purpose to stear a rc car.

As you can see we will use another Builder Base to control a motor servo driver board which is connected to two dc motors and one servo in the front. In this demo we use our Four Motor Kit. For more information visit: https://quantumintegrate.com/products/four-motor-kit. You can also use a h-bridge to control the steering car. If you want to know how to connect two dc motors and a servo with a driver board and control it via the Builder Base check out for a detailed instruction.


Build the Rc car App

To control the car with the joystick we need to adjust and edit our app. So click on the play button again to stop the app.

To edit the app click on the three dots and hit “Edit”.

For the new app you will need a “Manual Ranging” code object, two “Motor” hardware objects and one “Servo” hardware object.

The “Manual Ranging” code object ranges the x-axis values from 0 to 4095 to 0 to 180 degree for the servo. Make sure to set a “In Min” and a “In Max” and a “Out Min” and “Out Max” value. So for “In Min” we are going with 0 and for “In Max” we use 4096. For “Out Min” we use 180 and for “Out Max” 0 because the servo is upside down so the values are basically inverted. The value then will be send to the servo motor which only operates in degrees. The y-axis of the joystick will be used to control both motors for forward and backward driving. Keep in mind that this values and adjustments can different with other joystick or motor drivers.

After setting the values and connecting everything make sure to name the motors. Once you are done hit “Save App”. Click on the play button to start the mapping process.

The firmware is already uploaded to the Builder Base and set up. If you want the firmware files or an instruction go to . Make sure to map the “Servo” and the “Right/Left Motor” with the right Builder Base that is mounted on the car.

Once you are done hit “Save + Run” and go back to the dashboard.

Now let’s see if everything works.

If you go left on the joystick the car steers also in the same direction.

Also when you push forward the car will go forward.

You can also see the values change every time you move the joystick.

This is how you connect and use a joystick with the Quantum System. We also showed you how to control the speed and the steering of a rc car with two dc motors and a servo via the joystick.

Happy Making!