Here we will show you how to create a simple Android app with HAC in just a few steps.
If you are new to programming then the thought of creating your own software might be confusing but there are really just two main aspects to consider:
The user interface.
The program code.
Most software has an interface that users can interact with, so allowing them to control and receive information from the program behind it. As a well designed interface can make software both easy to use and easy to program, many programmers therefore develop the interface first and later fill in the program code. This is the approach we suggest for beginners to HAC.
Some programming tutorials suggest designing a user interface on paper but with HAC it is often easier to place your controls such as buttons on the design window and simply play around with them until their placement looks about right.
Filling in the program code is more critical because whereas a badly placed control will not crash a program, a programming error can. For both beginners and experts it is often better to write down the main functions of the program on paper before typing them in. However, for small programs it is possible to type them straight in and then run them to see if they work.
Creating your own software therefore involves following these steps:
Create your software's interface.
Fill in some program code.
Run and test the software.
Repeat the above steps.
The next section will briefly cover the HAC design interface.
HAC Interface
The HAC user interface has been kept very simple with just a main design window, one toolbar and a mode switcher:
Main design window.
Toolbar.
Mode switcher.
The main design window is called a card in HAC and when the program is running it is the window a user sees and interacts with. A HAC Android app can have many cards, thousands in fact, and in HAC Design mode they are accessed via the Toolbar.
The HAC toolbar is very simple, having areas for Properties, Control selection and the Card List. In Design mode HAC also has a control mode specific to the control type being edited, for instance: button, field, canvas etc.
The Mode Switcher allows rapid switching between HAC's three modes of Design, Preview and Run.
HAC Interface
"Hello World" Program Video
This short tutorial shows how to create an Hello World program using HAC and how to load and run it on an Android Emulator. It assumes that you have already installed the prerequisite helper programs to run HAC such as the Android SDK and Java.
"Hello World" Program
A "Hello World" program is often the first program novices try to implement and it simply instructs the computer to display a "Hello World" message. Although this might now seem easy, it wasn't always so because some languages, including the Android SDK have complex frameworks to master before even a simple message could be displayed. However, in HAC it is very easy as you will soon see.
Your first program will display a window containing a single button, which when pressed will display a "Hello World" dialogue box. This program can be implemented by first creating the interface and then adding the program code.
User Interface
Our aim is to create a window(card) containing just one button and your task is made easier because when HAC starts a new project its design window is blank so requiring you to just add one button. Even better, HAC starts up in button mode and is ready to work with buttons. Note, the default screen size is set to 320x455 pixels just right for a typical Android smart phone.
(1) To create your interface:
Create a New project via the File menubar.
Name the project "Hello".
On the Toolbar click the button "New Button".
Click on the card to place the button.
It doesn't really matter much where the button was placed but you can experiment by dragging it around.
(2) To see the interface as a user would you can use HAC's Preview mode:
Press the "Preview" button on the Mode Switcher.
The card will appear as it would at runtime.
(3) To return to "Design" mode:
Press the "Design" button on the Mode Switcher.
Now that the interface is ready you can add some program code to it.
Program Code
To add some code to your button:
Select the button on the card.
On the Toolbar Properties click the "Script" button.
... the Script Editor will open.
Place the cursor on an empty line.
Type in: Message 'Hello World'.
Close the Editor using the "Close" button.
Now that the program code has been entered it can be run and tested.
Running the Program within HAC
To run your program:
Click the "Run" button on the Mode Switcher.
The program should now compile and run.
If you made a mistake typing in the "Message" command then the compiler will automatically open the Editor at the right place so enabling you to correct the mistake.
Once running, your program will display a Splash screen that can be quickly dismissed by simply clicking into it after which the card window will appear.
Now you can press the single button and "Hello World" should appear.
Congratulations - you created a HyperNext program!
Running the Program within an Emulator
This assumes that you have already setup HAC and created an Emulator Virtual Device.
To run your program:
On the "Go" menu select "Launch Emulator" and wait until it launches.
On the "Go" menu select "Run Android".
The program should now compile and run on the Emulator.
Now you can press the single button and "Hello World" should appear.
Congratulations - you created an Android program!
Running the Program on an Android Device
This assumes that you have already setup HAC and connected your Android Device.
To run your program:
On the "Android" menu select "Manage Devices" and select your device.
On the "Go" menu select "Run Android".
The program should now compile and run on your Android Device.
Now you can press the single button and "Hello World" should appear.
Congratulations - you ran your program on an Android device!
