Zaluum

Hello world! Tutorial

Installation

This tutorial shows how to make the firsts steps with Zaluum.
  1. Follow the instructions in the downloads page to get a copy of Zaluum and learn how to install it.
  2. Start Zaluum. If you did download the full distribution, double click on zaluum.exe or similar executable in the uncompressed directory.
  3. Select the Workspace directory in the pop up. It's where your projects will be stored.
  4. You should have Zaluum started, possibly with a nice Welcome screen from Zaluum

First Zaluum file

We are going to create a fancy program to sum two numbers.
  1. Click go to the workbench if you are in the Welcome screen
  2. Go to File→New...→Zaluum Project and click Next...
  3. Enter a project name e.g. HelloWorld. The project defaults should be ok. Click Finish.
  4. The project folder with a "Z" indicates that it is a Zaluum project. Expand it. You should see the source folder: src, the JRE libraries and the Zaluum Library Container.
  5. Go to File→New→Zaluum Class. If it isn't in the list, go to Other... and select Zaluum Class from there.
  6. The source folder should read HelloWorld/src. Enter a package name for example your company name com.mycompany. It's not recommended to use the default package. Enter Hello as class name and click Finish.
  7. There you have your first Zaluum file, open in an editor. It's a bit empty, isn't it?
NOTE

The main layout of Eclipse is composed of Views and editors. Editors appear in the center space of the workbench and usually edit a single file. The views are usually around the edges, and are linked to the current editor or the current project.

Please see an Eclipse introduction like this if you are unfamiliar with Eclipse.

TIP
There are many paths to a single action in Eclipse. For example you can create a new Zaluum file from the toolbar, or right-clicking the src folder.

Adding boxes

We want to create a simple box that sums continously the value of the widgets, so we will need to put our boxes inside a loop.
  1. You should be seeing the empty editor at the center, the Palette view at the right side of the editor, and the Zaluum Properties at the bottom. Arrange the views as you see fit. It's useful to view both Properties and Problems at the same time.
  2. Expand org.zaluum.control in the Palette and drag and drop While into the empty file. Resize the while box to a comfortable size.
  3. In this example, we will make the box run forever. The cond port at the bottom-right of the While box is the condition to get out of the loop. If it's true, it loops, so we will feed a constant true.
  4. Expand org.zaluum.op and drag and drop Literal inside the While. With this box, what we write in it goes directly to the output port.
  5. Double click the Literal and type true. Notice how the border and output port turns red to indicate it's been parsed as a boolean
  6. Click on the output port of out "true" value to enter connect mode and draw wires. Click again in the cond port to finish the connection.
  7. Now for the real widgets: Drag and drop from the palette inside the While box:
    • 2 org.zaluum.widget.TextInput. Put them on the left side.
    • 1 org.zaluum.widget.TextWidget at the right side.
    • 1 org.zaluum.op.Add in the middle.
    Place it on the left. This will be out widget for the first number to sum.
  8. Wire up the model: Connect the outputs of the TextInputs to the inputs of Add, and the output of Add to TextWidget
TIP
You can also navigate the palette right-clicking anywhere empty in a Zaluum file.
NOTE
If the Palette or Zaluum Properties are not shown, you can restore them going to Window→Show View. Also make sure you are in the Java Perspective with Window→Open Perspective

GUI editing

  1. Open the GUI editor with F6 or the GUI button on the toolbar. You can see the preview of the widgets you just added
  2. Move and resize the widgets into a beatiful arrangement. Also resize the canvas to an appropiate size by dragging the edges of the white dotted background.
  3. Add some labels. Select the TextWidget in the GUI view. In the Properties view type in *Label GUI: "The result is:". A label with the text should appear next to the widget. Try to move it.
BETA The widgets may be out of view, use the scrollbars.
IMPORTANT
If you click a widget, the corresponding box flashes and vice-versa, so you can know which is which.
TIP
You can also drag and drop widgets to the GUI view directly. Sometimes it's better to start with the user interface.

Running the program

  1. Save the file and make sure that no problems appear in the Problems view.
  2. Right click the Hello.zaluum file and go to Run as...→Zaluum Application
  3. Congratulations! Your first Zaluum Application Play with your numbers! Press enter to confirm a number change.
TIP
After the program has been started once, the launch configuration is stored. You can relaunch clicking the Run button in the toolbar.

Download

Here are the complete sources of the HelloWorld project. Download sources