Perhaps this has been done in the past but I thought I would take the opportunity to post a fresh tutorial!
Remix Link
So to create a counter you need a few basic things. First, you need your design layout. This may look like many things but for our use case (purpose) we will be including only a label and a button.
Although you can’t see the label, it is there. The text was removed and will be replaced when the app loads.
Next I initialize and set a Stored variable. This is an important step. If you do not set the vairable to have some initial value at some point, the app doesn’t know if it should be a list, single word, number, etc. So we set the variable to = 0 for our purposes because most counters start at 0. I do this the first time the app loads. We check for the variable to = null (which it always will on the first load) and if it does = null we set it to 0. Why not just set it to 0 you ask? Because if you have already begun counting something, that value would be overwritten every time you open the app.
actions like this can often be carried out on a splash screen if your app uses one. Then you never have to worry about it again. I would recommend you do this for all of your stored/app variables whenever possible.
the last block here calls to have func.DisplayData run. This will be used at various times. Functions are a way to decrease the number o times you have to write the same code. This is a basic function that does not take any arguments (values to transfer). When you use the same function in several places, you may want to include arguments so perhaps instead of counting by 1 you can have it count by 10, for example .
This is a simple function that will be called a total of 3 times.
I recommend naming any component as i have done here. The name should provide an indication of what that component or set of blocks (in this case) are intended to do
so following the logic. after the app loads, the var will set to 0 (if needed) and the value of the variable {no matter what that value} shall be displayed on the screen.
Now the worker of the app comes into play. The reason we are here. how do you change the value to the stored variable? Now, I have seen the “change by” blocks used for this purpose but they aren’t reliable and therefore I do not use them regularly. Instead, I use the blue math block and add value to the variable itself. After adding the variable, I call (run) func.DisplayData to update the screen.
Now when you click the button, 1 is added to the base value and that value is displayed on the screen. This value won’t change until you delete/reinstall the app or click the button again.
Lastly, how can you reset the variable to 0 if you need to restart? Like this
