Coordinate System in Toy Basic

Toy Basic uses a simple 2D coordinate system to draw graphics on the screen.

The top-left corner of the window is the origin: (0, 0).

  • The X coordinate increases as you move to the right.
  • The Y coordinate increases as you move down.

This means that if you move an object to the right, its X value becomes larger. If you move it down, its Y value becomes larger.

Window Size

You can determine the current size of the window using these functions:

  • GetWidth() returns the width of the window.
  • GetHeight() returns the height of the window.

This is very useful when you want to draw shapes relative to the current window size.

Rectangle Example

The function DrawRectangle(x1, y1, x2, y2) draws a rectangle using two corner points. Example:

DrawRectangle(0, 0, 200, 100)
This draws a rectangle whose top-left corner is at (0, 0) and whose opposite corner is at (200, 100).

Centered Rectangle Example

You can also calculate coordinates from the window size:

x1 = GetWidth() / 4
y1 = GetHeight() / 4
x2 = x1 + GetWidth() / 2
y2 = y1 + GetHeight() / 2
DrawRectangle(x1, y1, x2, y2)
This draws a rectangle in the middle of the window. It starts one quarter of the way from the left and top, and its size is half of the window width and height.

More Examples

DrawCircle(x, y, radius) draws a circle using its center point and radius. Example:

DrawCircle(GetWidth() / 2, GetHeight() / 2, 50)
This draws a circle in the center of the window.

DrawLine(x1, y1, x2, y2) draws a line between two points. Example:

DrawLine(0, 0, GetWidth(), GetHeight())
This draws a diagonal line from the top-left corner to the bottom-right corner.

Summary

  • The top-left corner is (0, 0).
  • X increases to the right.
  • Y increases downward.
  • Use GetWidth() and GetHeight() to work with the current window size.

Once you understand how coordinates work, it becomes easy to place lines, rectangles, circles, and other shapes exactly where you want them.

See also: