Each UI component has a set of blocks associated with it that roughly speaking correspond to the sorts of things it can do.

If you select Button1 then you will see a  selection of blocks that correspond to things that can happen to the button - colored green - and lots of blocks identifying actions that can be performed on properties of the Button - colored blue and blocks corresponding to settings of these properties - color purple.

In general you will always find that a UI component has:

• a set of green event blocks
• a set of blue action  blocks
• a set of purple value blocks.

Now let's see how these fit together - literally fit together!

If you select the Button1.Click block it will appear on the design surface and you can move it around. It doesn't matter where it sits in this instance.

If you look at it carefully you will see that it says

when Button1.Click do

and this is indeed what it is all about.

The block is activated when the button is clicked and what happens all depends on what other block you place within the shaped open area below the caption.

The block that you place inside the Click block has to fit so you can't put blocks together in a way that doesn't make sense - but if you are following how things work there is little chance you will even try.

What we would like to do is to set the TextBox's content to say "Hello World" when the button is clicked.

If you think about it for a moment this suggests that we need a block that involves an action on the TextBox. If you click on TextBox1 in the My Blocks tab list you will see that there is a blue property block that says:

set TextBox.Text to

This is the property action we are looking for - the Text property being what the TextBox displays.

Clicking on the block places it on the design surface and you can now drag-and-drop it into the space in the Button1.Click box. When you do this you will hear a satisfying click - this development environment knows how to keep you happy.

This looks good but notice that you have an empty socket and this  won't actually be used if you try and run the program.

This is quite reasonable as the clump is incomplete. Currently it says

When Button1.Click do

 Set TextBox1.Text To

but To what?

Built-in blocks

We need a value block and in this case we need a simple text value from the Built-In blocks. These are used so often that a mini-menu appears when you click on the design surface. Select Text and drag the block that appears to the clump and connect it with the To socket.

Now we have a complete clump of blocks but the text value is set to its default "text" .

If you click on it you will discover that a text entry box opens and you can type in your message Hello World.

Now we have a complete program ready to run.

But how?

We have two choices you can run the program on a real Android device connected to the machine you are working on via a USB cable or you can use the emulator.

In most cases it is easier to use the emulator. This does take time to load and it is slower to use than a real phone but it does take time to download to a real phone and initially at least the emulator has the edge.

To run your program on the emulator simply click the "New emulator" button:

The emulator does take time to open but once it is loaded you can keep it open and the Blocks Editor will detect that it is running and reuse it for future testing sessions.  In other words you only have to wait once for the emulator to load.

It is important that you wait until the emulator is showing the usual welcome screen before you try to use it.

The emulator is very accurate and you even have to unlock the the phone in the usual way before you can use it.  (If you have never used an Android before you start it off by dragging the green padlock symbol to the right of the screen.)

All you have to do to see your application in action is to click the Connect to  Device button. When you do this you will see a list of devices that you can select to install your program on. If you have any real Android devices connected these will be in the list as well as the emulator.

If you now select the emulator your app will be downloaded to the emulator and all you have to do is run it as you would any app installed on an Android device. 

Notice that it takes time to download even a program this simple - be patient.

The device icon at the top of the screen shows yellow and an arrow while the app is downloading

and a steady green when the download has completed:

Once the download is complete you can move to the emulator and unlock it as if it was a real phone and you should see your app ready to use

. In this case it isn't very exciting but it is the start of something very exciting. Click the button and see the message appear.

It really is this easy and simple.

If you don't want to modify the UI you can simply return to the Blocks Editor, make the changes and connect to the device again selecting Restart app to see the changes in action. If you need to change the UI go back to the Designer and start the Blocks Editor when you are ready.

 <ASIN:1118017110>

<ASIN:1119991331>

<ASIN:1118026438>