If you have ever done any programming this tutorial is not meant for you. It is prepared for complete beginners who have never seen and try any coding.
In part 4, we will continue with our project from part 3 and implement some logic and basic loops in it. All the previous parts are still accessible here:
Let's open our imported project UI_elements from part 3. In previous part we implemented text changing by pressing the button and checking the checkbox. It was a simple operation, that changed the text for the first interaction. Today we will upgrade it with counters and if statement.
If statement
If statement is conditional construct, which performs different action based on predefined criteria.
We will modify our code for checkbox, to detect the state of it and display corresponding text in label. First open blocks editor and find checkbox part of code.
Until now, label displayed text "checked" which stayed on screen even if we unchecked it. To start listening for state change event, we need to implement if statement.
Open group "Control" under Blocks section and drag block if to the screen.
Remove the part of blocks that change the text from checkbox state listener and replace it with "if" block.
For every change of state, we will check if checkbox is checked or no. If it is, we want to display text "Checkbox is active" otherwise we will display "Click on the checkbox." Open blocks under our element chkTop and select "chkTop.Checked". Connect it to "If" block.
Click on the blue gear icon on "If" block and add "Else" option to the block.
Join removed block "setlblChkTop.text" together with string block under "then" part of "If" block and change its text to Checkbox is active. Do the same for "else" part of the block and apply text Click on the checkbox to string. We should have something like this:
If we translate these blocks it would mean: When chkTop state is changed, check if state is checked and apply "Checkbox is active". If it is not apply text "Click on the checkbox"
Counter
We will modify our last project with the counter, that will keep track of how many times the button was pressed. Find this part of blocks:
Last time we got familiar with variables. To implement our counter, we will have to create new variable "counter" and assign it a numerical value. Start with dragging "Initialize global" on the screen and name it counter. Under the group "Math" you can find block with number 0. Connect it to variable counter. Now we assigned numerical value 0 to our counter.
For every click on our button, we want to increase our counter by 1. To achieve this, we need to assign new value to our variable for every click. Open group "Variable" and drag block "set global" onto the screen. Assign it to variable counter. Open group "Math" and select block with sign + between two empty spaces.
For every click we will collect old counter vale, add 1 and store it back to our counter. In the first empty space of + block insert "Get global" block, which can be found in "Variables" group. Fill second gap of + block with number 1 from group "Math".
We should have something like this:
To display number of times pressed, we will join our existing text with variable counter. We will use block "Join" under "Text" group.
At the end it should like like that:
Blocks translated to text would mean: When btnTop is clicked, set counter to existing counter and add 1, then change the text of lblBtnTop to "Pressed: " + value from counter.
That is all for today, test it out in AI companion on your phone. In next part we will discover loops and logical operators. Any questions and comments are most welcome.
That's an awesome code environment! I saw one a few years back that used "puzzle pieces" like that, though it may have been App Inventor... My first son just turned 4, and in a couple more years, I plan to start his programming education with something just like this!
Fantastic tutorial series! Brings back fond memories of learning to code. I used BYOND to teach myself a version of C++ when I was 12, and have been building indie online rpgs for close to 20 years now 😉
Awesome, i am glad that you like it. I started with logo 18 years ago with my first pc :). The only "game" i was allowed to have
I was simply too poor to buy games 😃 I built my first computer from spare parts my friend had in his basement, and began writing the sort of games I wanted to play. I've always been a game designer though, even before I had a computer, as early as 6 years old, I used to make board games, trading card games, and even homebrew rulesets for games like Dungeons and Dragons for my brothers and I to play.
I've used a similar application with my daughter called Scratch (https://scratch.mit.edu/) you should check it out. I came across it while helping out at a Coder Dojo event in Ireland. Very intuitive and fun.
Oh, man! That looks perfect!
I m codeing android apps with cordova at the moment. this looks awesome !
If you are using cordova, stick with it :) This is purely for beginners.
yeah I know , but I never saw that before
yes i have used this and it is very easy to do. thank you for the info.
have a nice day
Which is the tool you are using? It's very similar to some codeless game engines, but I didn't know there is something for android.
This is App Inventor, online project started by Google to learn programming basics.
I used to work with Appinventor many years ago, what i can say that is quite limited, you can't add admob monetization for exemple but its still good thing to learn when it's comes to android developements, i'm looking forward to see more posts from you and good luck with your learning
its really informative
join my group on facebook
my group is --"STEEMIT" join and make your DREAM come true
and follow and upvote me on steemit and i will follow you 100%.
beacause a huge group can make a huge amount of money
my link is -- https://steemit.com/@avinashjadon