How to make a simple counter App

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.
Screen Shot 2020-03-17 at 2.01.33 PM

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
Screen Shot 2020-03-17 at 2.09.17 PM

2 Likes

Where can I find the func.DisplayData block?

Hey @ines.v.dias2nya, thanks for the questions. You can make it from here

pull the first purple block on to the editor screen and name it what you want
Screen Shot 2020-03-21 at 1.32.05 PM

2 Likes

How do i add reset button?

That is explained at the end of the first post.

2 Likes

Where can I find the from lable.displaycounterr set text to stored stored.counter block?

2 Likes

This is an old style. Now there if no From so you will find something like this’
image

1 Like

can you send the screen how it looks?

2 Likes

Can you add a button which allows users to make counters for themselves?

Sure. That’s way more work as you need to keep track of each timer discretely

Coudl u maybe explain how i would do it, or give like a general advice

how to do counter app not a simple counter app

pls tell me before 27feb 2024 pls

Hi and welcome to Thunkable!

A few things to consider since you’re new here:

  1. Please review How to ask Great Questions v2.0 so that you know what information to include in a post. What you wrote does not have enough details to be able to help you.

  2. This post is two years old. I don’t think @danielheijs2u1en is even still active on the forums. I recommend you create a new topic with as much detail as possible about what you’re trying to do. You can link to this topic so that people know you read it.

  3. Please don’t ask users to respond quickly or before a certain date. It’s not our responsibility to help you quickly. If you need help right away, consider paying someone or contacting Thunkable staff for assistance.