The PiicoDev Button is an intuitive user input. It's easy to get started with. Buttons are one of the most common user interfaces out there and for good reason; they're easy to understand and operate. I'm going to show you how to get started with your PiicoDev Button and a MicroBit V2, or connect these two together and run some examples. So, use the button as a control input for the Micro Bit.

Let's start with a closer look at the button. The PiicoDev Button features a clicky tactile button on the top and a bunch of electronics on the bottom. There are two PiicoDev connectors for daisy-chaining connections, four ID switches that allow multiple buttons to be connected together (leave all of these switches in the off position for now) and a small power LED. You may need to install the switch cap onto your button; simply hold it over the top and press until you feel it snap into place.

To follow along, you'll of course need a PiicoDev Button, a MicroBit V2, a PiicoDev Adapter for MicroBit and a PiicoDev Cable to connect everything together. Plug your MicroBit into the Adapter, making sure that the buttons are facing up. Connect your PiicoDev Cable to the Adapter and the other end to your Button, then connect to your computer with a USB cable.

In the article for this tutorial, download the driver files that we'll need. Find the download section and under the MicroBit tab, right click and download PiicoDev Unified. Save link as and I'll save this to a PiicoDev directory in my documents. And on Picadev's switch, right click save link as and save it to that directory too. We're going to use Money for this tutorial. If you need help getting started with MicroBit and Money, refer to the guide and there's also a link if you prefer to use a web programming interface too. Open Money, connect to your MicroBit and upload both.

I selected both files and uploaded them to my micro:bit. I edited them and here they are. I returned to the article and found the first example. I checked if the button was pressed or not and highlighted that code example. I copied it and pasted it into a new script. I clicked the Green Run button and when prompted to save, I saved it to my micro:bit as main.py.

The script was running and my shell was printing all zeros, which is the state of the PiicoDev button. When I clicked the button, we could see a spike in the graph. I stopped the script and scrolled back and there was a one. So, we were printing all zeros while the button wasn't pressed and then, for the moment the button was pressed, we got a one.

I ran the script again and clicked the button three times. We could see all three of those press events in the graph. On the first line, we imported the PiicoDev switch module. This is a generic class that may be used with other switch type picativ modules in the future. We had a function to create a delay and then we called the initialization function and assigned it to the variable button.

We had an infinite loop and if the button was pressed, we printed a one, else we printed a zero. This is what created the stream of numbers in the shell. The.was_pressed property returns true or false for whether the button was pressed or not. We printed one and zero so that we could see the data in the plotter, because the plotter won't show true or false.

So, a button can detect a click event and we saw that in the plotter as a spike. If I pressed and held the button, we just had that spike. The.was_pressed property rejects a hold event.

This is essentially saying was the button pressed down since the last time we checked and that can only be true once while we're holding it down. If we want to get the state of the button right now then we use the is pressed property. Now when we run the script, if I press the button we get that splack but if I press and hold you can see that value is being held constantly at one until I release it or it goes down to zero. Okay, so we can read the state of our button.

Cool, but let's actually do something useful with it. The MicroBit has this beautiful 5x5 display that can actually show images. Let's remix this program so that we can cycle through different images on the micro bits display. To drive the display we'll need to import some new functionality from microbit import display and we'll also need to import image so we can show some pre-baked images supplied by micro bit. And you'll notice that image has a capital I while display has a lowercase D. I'm not sure why.

Let's first prove that we can get the display working. I'll just make a call to display dot show and then we want to show image dot heart and that will show a nice love heart. I'll just comment out all this other code with Alt 3. Run the script. I have to block my really bright Studio light so you can see that, but there's a heart. Okay, so we have a heart showing on our micro bit. We know how to show an image.

If you're wondering how I know all this, the image class is really well documented in the MicroPython docs. I'll include a link to this document below. But if we scroll down a bit we can see that there are all these predefined images for a heart, a happy face, a sad face, etc. Okay, so we can show an image on the display. Now we want to cycle through a pool of a few images. I'll remove this line. We know how to run the display now. index is now two

We are going to create a pool of images. This will be a Python list and we can put in an image heart like before and we'll do image.happy and image.sad. I think that's enough so we have our Python list of three images. We're going to need some kind of index that steps through this list and I'll initialize that as zero.

Now we can uncomment our wild true lift with alt four and when the button is pressed we want to step to the next image. So we don't need this print statement but instead we will say index += 1. We actually don't need this else because else do nothing and now we can call display.show images. So when the button is pressed the index will increment by one which will move down this list.

Then every Loop we also want to update the display with the current image and that is pulled from the images list and pointed to by the index. There's one other thing that we have to do which is to make sure the index never goes out of bounds. If index is greater than or equal to the length of images (which is the list it has three elements in that list) then we set index equal to zero. Let's also print some helpful debugging information print index to the Shell.

Now when we run the script hopefully there are no errors. We have our heart and that makes sense we removed that first display for the heart and all we have is this images list so we're actually showing the heart by by calling display.show images[0] because index starts at zero and the heart is the zeroth element in that list. Now when I click the button that jumps to a happy face because index has been incremented to one. We can see that in the Shell with the debug information and image.happy is the next element in that list. And if I click the button again we have a sad face because index is now two.

We'll check that our wrapping code works if I click the button once again it goes back to a heart. Now I'm using the isPressed property here which means that if I press and hold it's going to constantly scroll through all of those images in sequence. Now it's possible to use more than one ticket have button at the same time and to do that we just need to make sure that it has a unique ID switch setting.

You might recall that the first button we set up we had all the ID switches off for the second device I will just set the first ID switch on using a pen or other instrument. I've daisy-chained my second button off the First with its unique ID switch setting and now we're ready to bring it into our coding project. I'm going to call this button B.

So now we have two instances of the PiicoDev switch class, the only difference is this one has a non-default ID switch setting so we can include the argument ID equals and now we include a list of all those switch settings. Remember the first switch is on so we have a one and then the remaining three switches are off so we have three zeros.

Our script is currently incrementing on the button press but my second button, button B, I want it to decrement the index so one will step up through the list and one will step down. I'll just copy all of this code and paste it again now we're working with button B and we want to subtract one from the index.

And now we just need to check if index is less than zero then index is equal to the length of images minus one. Our first if condition will increment the index and our second if condition will decrement the index. Now when I run this code we still have our heart and when I press the button to go up we get index equal to one in the Shell you can see that here that's as normal and we've.

Gone to a smiley face and when I press the next button, button B, that index should decrement back to zero and we're back to our heart. So, starting at index 0, we can count upwards: zero, one, two. And using button B, the second button, we can count down: two, one, zero. Nice!

We built this two button example with this display Code Remix, but if you'd like a much simpler multiple button example, you can find that in the other examples section under the multiple buttons tab. There, we just increment or decrement a counter and there's also a few other more advanced examples too.

So there you have it. We were able to connect a PiicoDev button and measure button presses in two different ways using is pressed and was pressed. We remixed that code to create a cool image selector project and then we even extended that project with a second button to introduce another type of control. In this case, scrolling forwards or backwards through this slideshow.

If you make something cool with this data project or you just have some questions, let us know on our forums. We're full-time makers and happy to help. Until next time, catch you later!