Let's draw!

Welcome to the explanation of the final sketch we have prepared for you.

Once again, click on the new sketch and choose Synthia.

Firstly, we'll make three variables and call them "x", "y", and "lifted".

random image

As you already know, "x" and "y" variables determine the current position of the LED in the matrix.

The "lifted" variable is a new one; with it, you determine if the pen is not lifted and ready to draw. This is the boolean variable, meaning it can be true or false.

Let's set the values for these variables.

For that, we'll use the "set to" block from the Variables block section.

random image

"X" variable will be set on 2, just like the "y" one, and the "lifted" variable will be set to false.

If the "lifted" variable is set on false, that means the pen was not lifted (ready to draw), and if it's set on true, the pen is lifted and it is not ready to draw.

Another important thing is to clear the matrix every time while turning on the device so you can draw on it.

We need the "clear the track monochrome matrix" to clear the matrix.

random image

Now that we set the main variables let's create a new function and call it "drawDot".

This function draws the current position of the dot on the matrix.

random image

Take the "if-not" block from the Logic section of the blocks, and drop it in the "drawDot" function.

random image

Another thing to do is to set matrix pixel brightness to the maximum - 255!

random image

In the end,  drag, and drop the "push changes to matrix" block to ensure your changes will be saved.

random image

You'll use encoders for drawing on the matrix. Because of that, now is the time to use those purple blocks from the I/O block section.

With the left encoder (x variable), we'll change the horizontal position of the dot on the matrix. With the right encoder (y variable), we'll change the vertical position of the dot.

random image

Remember the previous sketch? 

We'll do the same steps here.

random image

So, we'll make sure to add the amount variable (-1 if we rotate the encoder to the left, or 1 if we rotate the encoder to the right) to "x" or "y", and to limit this from 0 to 15.

Let's duplicate this block for the right encoder!

Don't forget to put the "x" variable on the left encoder but the "y" variable on the right encoder. 

Also, keep in mind that you're changing the matrix's width with the left encoder, so the limit is from 0 to 15. On the other hand, you're changing the height of the matrix with the right encoder, so the limit is set from 0 to 4.

random image

Once again, we are repeating the same values and limits from the previous sketch. 

Now, we'll have to "call drawDot" variable under all blocks to make sure the dot will move in the matrix. 

Your sketch should look like this by now:

random image

The last thing we will do is set what will happen if one of the encoders gets pressed

E1 symbolizes the left encoder, and E2 symbolizes the right one.

For that, you'll need this block from the I/O block section

random image

While pressing the encoders, we want to change the "lifted" variable.

random image

So, as the blocks say - if you press the left encoder, the variable will go from lifted to not lifted. 

Let's duplicate the blocks for the right encoder.

random image

As you can see, pressing the right encoder will do the same. 

So, if the variable was lifted, it will change to not lifted. Of course, this goes both ways, so if the variable is not lifted, pressing on the encoders will change it into lifted.


You successfully finished all the sketches and are on the way to becoming a real programmer!

We are almost done with this guide, but make sure to check the next chapter because we'll show you how to delete all the changes you have made and how to restart your device.

Here are a few photos showing what it should look like once you compile the code.

Once you run the code and the device turns on, you'll see this on Synthia. 

So, a little dot (LED on the LED matrix) that is lightning up is the one we set at the beginning of the sketch. That is your starting point while drawing on the matrix.

random image
If you rotate the left encoder, you'll be able to draw horizontally, and if you rotate the right one, you'll be able to draw vertically.

random image

random image

However, if you click on any encoder, the pen will stop working, and if you click on it once again, it will start working.