Turing/Basic Graphical User Interfaces

From Wikiversity
Jump to navigation Jump to search

Introduction[edit]

Graphic User Interface (GUI) in Turing is based on the Cartesian co-ordinate system. X is the horizontal axis and Y is the vertical one. A normal window is 639 (x) by 399 (y) pixels, but can be changed with the setscreen ("graphics:x;y") for example setscreen ("graphics:100;200") changes the window to 100 x 200 pixels. You can only use GUI in graphics mode.

Draw unit Commands[edit]

Since Turing is object oriented, all of the simple GUI commands are part of one unit. The commands are below. They must have draw in front of them e.g. drawarc, drawfillbox except for cls, which can be either Draw.Cls or cls. Instead, they can have 'Draw.' in fron of them, but they must be capitalized e.g. Draw.Arc or Draw.FillBox or Draw.MapleLeaf.

  • arc † (centre x,centre y,initial angle, final angle, colour)
  • box † (x1, y1, x2, y2, colour)

(x1,y1) is one corner (traditionally bottom left) and (x2,y2) is the opposite (top right)

  • cls
  • dot (x,y,colour)
  • line (x1, y1, x2, y2, colour)

(x1,y1) is one end and (x2,y2) is the other end

  • mapleleaf † (x1, y1, x2, y2, colour)

The maple leaf is drawn in an imaginary box, with the corners (x1,y1) and (x2,y2)

  • oval † (center x, center y, radius x, radius y, colour)
  • polygon † (x1, y1, x2, y2, x3, y3 ..., colour)

The parameters are the corners of the figure. It can have up to 255 points.

  • star † (x1, y1, x2, y2, colour)

Same as maple leaf

† These commands can have fill added before them, making a filled box, oval, polygon etc.

Animation[edit]

By using loops, you can animate these shapes. You will need a mathematical formula (or formulae) to calculate these.

1 Direction[edit]

The simplest way to move a shape is one way. For this program, we will move it right.

var shapeX : int := 0 %%Declares variable 'shapeX'
loop
cls %%Clears the screen
drawfilloval (shapeX, 100,10,10,1)
shapeX := shapeX + 10 % for less typing, I could also say shapeX += 10
delay (50) %makes the program wait 50/1000 seconds before continuing. This allows the user to see  the shape.
exit when shapeX = 600
end loop

Diagonally[edit]

Move 2 axis: replace drawfilloval (shapeX, 100,10,10,1) with

drawfilloval (shapeX, shapeX, 10,10,1)


A group[edit]

You have to move all the shapes. However, if the shapes are at different places, then you need to add a coefficient. To add another circle 20 pixels above and 10 left, add this line of code

drawfilloval (shapeX + 10, shapeX - 10, 10,10, 2)