Xelfi Calculator Tutorial

Description
Design
Functionality
Appendix A: list of the program

This file contains description of simple example Calculator. The finish version which you can develop in one hour is shown on the picture below. This tutorial consist of 3 directories: calc1, calc2, calc3. In each directory you can find java source code (calcul.java), form source file (calcul.form) and compiled class file (calcul.class)

Design

Here are the steps which you should do:

Create new class (system menu -> new class)
Choose Application and type the name (e.g. Calcul)
You will see the new form and source text.
Change properties:

background -> lightGray
title-> calculator

Add two Panel3D:displayPanel and controlPanel.
In form choose borderlayout in the main form.
In component inspector choose Layout for displayPanel North and for controlPanel center.
Into displayPanel insert label and call it display. Change font. Layout of displayPanel should be border too and display should be in the center.
Into controlPanel insert all buttons. Better is divided them into several Panels3D like in example:

mainPanel(north)
numPanel(east)
operPanel(north)

For controlPanel is possible to use gridLayout. Then select any button and in Comp. insp. choose Layout tab (at the bottom). Then choose parameters of grid (rows and columns)

This phase of calculator development is in the first directory: calc1.

Functionality

In component inspector choose tab Events.
Select any button and double click into left column at the label "Click". In the right column you will see the default name of method for this event (on_????Click, where ???? is name of each button). Then press enter.
Last step repeat for all buttons.
This version you can find in calc2 directory.
Then you must write all methods. You can inspire with the finish version of calculator located in the last directory (calc3).

Appendix A: list of the program

Complete listing of the program you can find here.