The calculator

Abstract

In this tutorial we shall construct a simple calculator. You will know how to write DM applications. You will know how to use the Display Machine and how to create user interface to your programs with it.

The code

The basic functionality of the calculator is described by the following class text:

class CALC

inherit
	DISPLAYABLE

creation
	make

feature

	indicator: INTEGER
	memory: INTEGER
	operation: CHARACTER

	make is
		do
			display (1)
		end

	digit (d: INTEGER) is
		do
			indicator := indicator * 10 + d
		end

	clear is
		do
			indicator := 0
		end

	operate (op: CHARACTER) is
		do
			operation := op
			memory := indicator
			indicator := 0
		end

	equals is
		do
			inspect
				operation
			when '+' then
				indicator := memory + indicator
			when '-' then
				indicator := memory - indicator
			when '*' then
				indicator := memory * indicator
			when '/' then
				indicator := memory // indicator
			else
			end -- when
		end

end -- class CALC

We have a display ('indicator'), a register ('memory'), and a facility to enter digits and perform basic operations. Now lets examine our "main program", the routine make. It contains the call of a routine display (1). This routine is inherited from DISPLAYABLE.

You can see the resulting calculator program below. There is again nothing special. It looks like any calculator under Windows, with some buttons and a display.

Before we explain the way this works internally we will show how the "Calculator widget" was constructed. We use the DM Interface Builder for this purpose.

Application window

Creating the project and building the application

Here we have to note that the Eiffel system we want to use in order to develop a DM application must be available compiled - as an .exe file. The DM application relies on this executable and Display Machine Interface Builder needs the databases generated by the compiler.

Loading project into the Display Machine

After startup it displays all current projects - including the Calculator program.

Then we must select our "base" project - in our case it is called CALC. There is one constraint: At least one class in the selected project must inherit from DISPLAYABLE (A class provided with DM). If this is not true, the interface builder will refuse to open the project.

Projects tree

Creating a new DM project

After opening CALC (by double-clicking on the folder) and entering the NEW command (the blank sheet on the toolbar) the New Form Wizard is activated. We decide to create a blank form.

New Form wizard

Now a blank form appears on the screen. In background we can see the project window showing all forms defined for this project. On the left we have a list of all features of the class CALC - and also the classes CALC inherits from. The features are sorted alphabetically - preceded by Current - which is displayed with the attributes.

A new blank form

We move the "Attributes" digit and indicator to the new form using drag-and-drop. They will automatically expand into an edit field (for indicator) and a button (for digit) and the corresponding labels will be attached to them. This screenshot was produced with two drag-and-drops.

Adding widgets

Double-clicking on one of the new widgets - in our example the button "Digit" - opens the property window of the widget. This window is explained in detail elsewhere. We will demonstrate here only two properties: the Title, which can be changed by typing over a new text, and the action.

Editing properties

Widget actions

The action describes the semantic action behind the button. In our case this is a call to the routine 'digit' (the routine we dragged-and-dropped as a starting point for our widget). We expand the symbol and see:

Defining actions

Now we replace the formal parameter d with the digit 2. It is also necessary to provide the proper label and to resize the button.

Changing the value

It is also possible to change the font and style of the label. The result can be seen on the right.

Setting a new font

Now it becomes clear how we provide functionality with interface widgets: starting from an attribute we "draw" the corresponding widget on the screen. This widget knows about the attribute - and we can enhance this knowledge. So the digit routine was just "digit" and a button - now its digit (2) and the "2". We did the same for all numbers between 0 and 9 (this can also be done by copying the 2 button and changing the properties).

Drag-and-drop from operate resulted in the 4 basic arithmetic buttons - and equals was "translated" into "=".

We can test the result immediately - just press the Run! button in the speed bar.

Application window

Later we will show you how to enhance the calculator significantly - without much effort.


Copyright © Object Tools -- info@object-tools.com
Last updated: 2005/02/02 11:51:11