For an index to all my stories click this text.
Due to the pandemic we are in, the
company where I work is only allowed 50 people at the same time in our shop.
Last time I showed you how to build a people counter using an ESP8266, some
buttons and a TM1637 display. You can find that story here :
http://lucstechblog.blogspot.com/2021/05/person-counter.html
That story I mentioned that I also build an Android App that did
the same thing. Several people mailed me asking if they could get a copy, or
where to download. Well the app is not in the play store. But at the end of
this story there is a link where you can download it.
But I'll do
better then that. I will show you ow it is build.
Mit's App Inventor
There are several ways to build an app for Android phones. One of
the easiest ways is by using Mit's App Inventor. I have used App inventor for
several projects on this weblog. Just look in the index page to find them :
http://lucstechblog.blogspot.com/p/index-of-my-stories.html
App Inventor works with programming blocks, a system that is also
used for (by example) programming BBC's Microbit and several other
microcontrollers. It is originally derived from the programming language
Scratch which you might know from the Raspberry Pi's.
App Inventor
uses two screens to build an app. The first screen is where you design the
app. Here you put buttons, text fields, picture fields etc etc on the screen.
The second screen is where you do the programming and that is called the
blocks screen.
Basically the first step is to put a button or text
field etc on your screen. Then you give it a color, put an initial text in,
decide upon text font, background color etc etc.
Next you move over to
the blocks section and there add the program blocks that decide which action
is performed when the button is clicked.
Sounds easy and it is.
App Inventor can be used to have your phone communicating with
ESP8266's, ESP32's, your home automation system like Domoticz, or even with a
Raspberry Pico using bluetooth. Give it a try. Look at my projects and use the
blocks for your own purposes.
The Peoplecounter's blocks
The Peoplecounter app has 9 labels, 2 textboxes, 3 buttons and a
picture on its screen.
When the app starts not all these fields are
visible. Some have their visibility set to "false". They are not needed at the
start of the app.
The picture field is called canvas and is on the top left side of
the screen. In my own version I have put the logo of our company in that
field. You can do that by clicking on the canvas field and choosing a
background image in the definition at the right side of the app designer. That
logo will be build in, in the app when you make an APK from the blocks.
The
first step is to fill in the number of customers that is maximally allowed in
your shop. Press Ok and the initial fields vanish from the screen and the main
fields appear.
Let's start with the complete blocks.
Let us examine the blocks in detail.
The app starts with initialising 3 variables. Teller (meaning
counter) is used for registrating the number of people present at any time.
Maxpersons is the maximum amount of persons allowed at the same time. totcust
is the total number of customers that has visited the shop during that day.
This part of the app is run when the app is started, that is when
the screen is initialised. The required fields are set visible. And the fields
that are not required at the start have the visible parameter set to false.
In the initial screen you have to fill in the maximum number of
people that is allowed at the same time in your shop. If you press the OK
button this block is activated. The OK button is button3 in the app.
The
initial fields will disappear and new fields and buttons will be shown.
Button1 is the button with 1+ as text. Pressing this button will
add 1 person to the Teller variable and also 1 person to the totcust variable.
So this adds 1 to the actual number of persons present and adds 1 to the total
number of customers that were in the shop that day.
If the number of persons present (Teller) is larger as the number
of persons that are allowed (maxpersons) then the text field is colored red as
a warning. If the number of persons is within the allowed amount then the text
fields background will be green.
The App
The app was tested on an old Alcatel C7 phone with (yes
unbelievable) Android 4.2, My new (well relatively) Nokia 5 with Andoid 9 and
on an Andoid emulator running Android 7. So you will not encounter problems
when running it on your phone.
For testing purposes I often test
apps first on the Android emulator before installing them on my phone. I use
the LDplayer emulator which works fine on my windows machine. You can find a
short revieuw on my weblog with this link:
http://lucstechblog.blogspot.com/2021/03/ldplayer-android-emulator.html
I realise that the app's screen is not very fancy. As the source code is
supplied at the end of this story you can alter it as much as you want and
make it more visually attractive.
The app starts with questioning how many people are allowed at the same time
in your shop. Fill the amount in, in the green field and then press ok. In
this example I set the amount to 5 for testing purposes.
After pressing ok the screen changes and different fields are on
display.
The +1 button adds 1 person. The -1 button subtracts one
person. The amount of people present are shown in the green square at the top
of the page.
Here the App has registrated that 4 people have entered the shop.
This is also the total amount of people that visisted today as you can see in
the blue line at the bottom of the screen.
The amount of people has increased to 6. As the maximum was set
at 5 the field with the amount of people has changed color to red (danger).
Three people have left the shop. So the amount present is 3 but
and the total amount that have visited today is still 6.
Another 2 people have entered the shop. So the total amount
present is 5 and the total amount that have visisted the shop is at 8.
Why
didn't my company choose for the App.
Well there is a small problem
with using this app on your own phone. Suppose you are sitting at the door of
the shop counting people. During lunch time it is someone else's turn to take
your place. You are likely not willing to leave your pesonal phone in someone
else's hands. He/she then has to use the same phone, or at least install the
app on his own phone and take over the settings by pressing + and - several
times.
Although my collegues have company phones they are reluctant
to leave those phones in the hands of someone else. So that is why my company
chose the ESP8266 peoplecounter version. Here is the link to that again:
http://lucstechblog.blogspot.com/2021/05/person-counter.html
Get the sourcecode.
If you want to look at the sourcecode you have to get an account
with MIT's App Inventor and then upload the AIA file to that account. You can
find the AIA file here:
https://www.mediafire.com/file/00b0dv46tgcemhu/Peoplecounter_copy.aia/file
Get the App.
If you just want to play with the App you can download the APK
file here:
https://www.mediafire.com/file/79mby3m72h68few/Peoplecounter_copy.apk/file
Download it and click on it and it will be installed on your
phone.
That's it for now.
Have fun
Luc Volders
