How do I write Programs using Graphics?


1. How do I write graphics programs?

In a nutshell, create a blank dialog without any controls, and under the Load event use graphics methods such as Drawtext, Drawpicture etc to draw in the window. The Graphics methods are the same as the printer methods, making it possible to draw on both with minimum changes. The following graphics program shows how to draw lines, pictures, points, shapes and text using different fonts in a window:

  // graphics.rc
  MAIN DIALOG 1,1,160,150
  CAPTION "Graphics"

  // graphics.cls
  Ubercode 1 Class Graphics

  private const
    LINE_NONE:integer <- 0
    LINE_SOLID:integer <- 1
    LINE_DASHED:integer <- 2
    LINE_DOTTED:integer <- 3

  public callback function Main(in  EventId:integer
                                out Cancel:boolean)
    x : integer(0:MAXINT)
    select EventId
    case LOAD_EVENT =>
         // Draw some lines
         call SetForecolour(me, DARK_RED)
         call Drawline(me, LINE_SOLID, 10, 10, 200, 10)
         call SetForecolour(me, DARK_GREEN)
         call Drawline(me, LINE_DASHED, 10, 20, 200, 20)
         call SetForecolour(me, DARK_BLUE)
         call Drawline(me, LINE_DOTTED, 10, 30, 200, 30)

         // Draw some pictures
         call SetCurrentX(me, 10)
         call SetCurrentY(me, 40)
         call DrawPicture(me, "computer.bmp")
         call DrawPicture(me, "earth.bmp", 60, 40, 160, 140, DRAW_STRETCH, 0)

         // Draw some points
         for x from 1 to 40
           call Drawpoint(me, x*5, 150)
         end for

         // Draw some shapes
         call SetBackcolour(me, LIGHT_YELLOW)
         call Drawshape(me, 0, LINE_DASHED, 5, 160, 40, 180)
         call Drawshape(me, 2, LINE_DOTTED, 45, 160, 75, 180)
         call Drawshape(me, 4, LINE_SOLID, 80, 160, 120, 180)

         // Draw some text
         call SetForecolour(me, BLACK)
         call SetFontname(me, "Times New Roman")
         call SetFontsize(me, 10)
         call SetCurrentX(me, 10)
         call SetCurrentY(me, 190)
         call Drawtext(me, "This is a ")
         call SetFontitalic(me, true)
         call Drawtext(me, "graphics ")
         call SetFontitalic(me, false)
         call Drawtext(me, "window.")

         // Show the window
         call Show(me, 0)
    end select
  end function

  end class

2. How do I display a picture?

Create a new window (dialog) without any controls and give it the Alignment=1 (Center) property. Put code under the Load event to load a DIB (BMP file) into the window at run time. Also get the size of the DIB and set the window to this new size. This works with most BMP files (black and white, 16 colour, 256 colour, or 16.7 million colours). Note a DIB file is just another name for a BMP file. The test is if Paint can display it, then Drawpicture can.

3. How do I do graphics using Cartesian coordinates instead of Windows coordinates?

The Windows coordinate system has X increasing to the right and Y increasing downwards, whereas the Cartesian coordinate system has Y increasing upwards. The Windows 'upside-down' coordinate system (which is properly called MM_TEXT) makes sense for printing text, which always moves to the right and downwards.

To set up a Cartesian coordinate space (with X and Y increasing to the right and upwards) set the Cartesian flag = True when calling Startgraph to initialize the window. You can also specify the origin in the middle of the graphics page. When using Drawtext to display text in a window using Cartesian coordinates, it is best to specify the text coordinates to make sure the text goes in the right place.

4. How do I find the size of the desktop screen?

Call Pagewidth(SysScreen) to obtain the width of the screen in pixels, and Pageheight(SysScreen) to obtain the height of the screen in pixels. These functions also work with the printed page and with the graphics area in a window.

5. How do I draw into a window with OpenGL?

Ubercode allows you to obtain the handle (HWND) of a window using the GetHandle property, and using the Windows API GetDC function a device context (HDC) can then be obtained for the window. In principle, a blank Ubercode graphics window could be created, and could then be drawn into using the handle and the device context. If anyone is familiar with OpenGL and wants to try this, please contact Ubercode Software for more details.