Begin Programming Logo
Home | KPL | Object Pascal | General Programming | Code Database | About Us
   
Graphical User Interfacce
   
   

Graphical User Interface, or GUI (pronounced 'gooey'), is the graphical part of the program with which a user can interact. Look at the browser you are using to view this page. It has menus, buttons and scroll bars. These are all components of the GUI. When computers first developed programs they did not have fancy user interfaces. Nowadays most programs designed for wide spread use have a GUI. Below are two examples of GUIs; Firefox, a common web browser, and Windows Calculator.

GUI of Firefox and Calculator

The great advantage of using an IDE like Lazarus when programming is that it allows you to quickly and easily design a GUI with built in components. While it is not essential, it is a good idea to open Lazarus and to try the examples in this tutorial. So open Lazarus. You should see a screen that looks like this:

Lazarus GUI Interface

Hello GUI World

The Lazarus GUI may look quite daunting but fear not! It is very easy to use once you get familiar with it. The main window, Lazarus Source Editor, in the middle of your screen, is the place where you can write your code. If you move the source editor to the side you should see a window called Form1.

Lazarus Form1

Click on Form1. Above Form1 there is a set of tabs; standard, additional, common controls, etc. Click on the Standard tab. Next click on the little A icon on the tab and then click on Form1. You should now see a little piece of text that says Label1.

Form with label

Double click on Label1, you should now see this:

Begin end block of the label

Type in this code, exactly as it is, between the begin and the end.

Label1.Caption := 'Hello World';

This will tell the label to change its caption when it gets clicked. Test it out. Click on the green arrow in the top left hand corner of the screen. Then wait until the form comes up and click on the label. It should now say Hello World.

Congratulations, your very own GUI Hello World program.

   

Valid XHTML 1.0 Transitional Valid CSS!