CS349 - Implementing User Interfaces - Spring 2010

Public Service Annoucements

1. Course notes
2. Assignments

Lecture 3 - Xlib Graphics

Basic Abstraction

Surface to draw on

• called a canvas in this course, drawable, grafport, view, GDI (graphics device interface), CDC (common device context), etc.
• pixel array
• colour model subsumed in a graphics model

Pointing device

• that indicates locations on the canvas

Sharing the Hardware

Multiple applications using one resource need synchronization. Notice that the display is extended in both space and time.

• job control (&) is an early example: different applications use the device at different times
  • Effectively, the device is made into a collection of devices that exist in the same space at different times.
• tiling windows is a more recent example
  • Effectively, the area provided by the display is divided into several areas, each of which is owned by a different application.
• overlapping windows is the example you probably know best
  • The device is shared over both space and time, but there is more:
  • Continuity over time is enhanced by implied co-existence in the same space of more than one application, spread out along a third dimension
  • Not really spread out fully, so we call it 2 1/2 D.
  • Both job control and tiling windows are special cases of overlapping windows.

BWS supplies overlapping windows

• each window belongs to an application
• When an application draws only pixels allocated to it are drawn
• When input occurs it is routed to the application that owns the pixel on which the pointer is located
  • This is called focus.

How should windows be controlled? By the user, of course.

• The mechanism is an application called the window manager, which is owned by the BWS.
• Each window is actually split into two parts
  • its frame, which is owned by the window manager
  • its content pane, which is owned by the application that created it.
• Each window has its own coordinate frame
  • with coordinate transformations handled by the BWS,
  • application draws a pixel at (x,y)
    • BWS adds the window origin (x + Ox, y + Oy)
    • BWS clips of the part of the window that is currently visible.
  • Note, user changes the window configuration
    • window manager catches input
    • window manager sends input to its application, the BWS
    • BWS recalculates window visibility for all windows
    • If a window's visibility changes
      • BWS sends a damage event (X calls it an expose event)to the application that owns it
      • the application responds to the damage event by redrawing the window contents
      • BWS catches the drawing commands and draws through the new window configuration

Providing Windows in X

1. Open the display
   • connects to the BWS
   • authentication needed. Why?
2. Create a window
   • Usually, BWS asks the window manager to manage it
   • Things like initial position, size, depth ordering, etc. are provided
3. Provide the window with a graphics context
   • See below
4. Select the input to be provided
   • set of event types to be put in to the application's event queue
5. Map the window to the screen
   • Events now start to flow in.
   • Why are creating a window and mapping it separate?

The Graphics Model of X

1. A set of commands that draw items on the display
   • E.g., drawLine( x1, y1, x2, y2 ) looks pretty self-explanatory, but there are some unanswered questions
     • how wide?
     • what colour?
     • dashed or solid?
     • rounded or square ends?
     • etc.
   • The obvious response is to add arguments but
     • code becomes very complex
     • messages from client to server expand in size.

     In practice,

     • most of the arguments don't change much from line to line.
2. A graphics context
   • a data structure maintained by the BWS containing most of the arguments
   • the application sets it up when the window is opened, and
     • changes values in it when the drawing style changes, which is infrequent
   • a window can have several graphics contexts for windows that have several distinct drawing styles
     • switch the current one when the drawing style changes

Better graphics models exist today, but all are descended from X

• at least in the sense that they use the same set of basic concepts

Graphics Tricks

Repainting the Canvas

Do all repainting in one function, so that you have the program structure

Initialize( );
while ( true ) {
    if ( ( evt = get-next-event( ) ) ) == ERROR ) exit( );
        switch ( evt.type ) {
        case XXX:
        ...
        }
        repaint( );
}

To repaint

1. Clear the screen
2. Use the painter's algorithm
   • Paint in order, back to front
3. Flush the buffer

Two performance killers

• Flushing too often
• Repainting too often

Expose events

Expose events are usually created in clusters, often big clusters

• E.g., window dragging

The count field is zero only if the next event is not an expose event

• repaint only on the last expose event

Return to:

• CS349 - Spring 2010
• CS349 page
• Bill Cowan's home page.