TQS Home
Trivia Quiz Shell Version 2.8 Now Available!Bot Productions Home

Part VII: Customizing the TQS Window

While adding questions and hangman games to your tutorial application so far, you may be finding the TQS window to be rather small. In this section of the tutorial you will learn how to resize the window, as well as change colors, font, and background, and how to specify an audio file to play in the background.

Customization of the TQS window involves the addition of the TQSWINDOW element. It is placed as a child of the TQS element, at the same level as the TITLE, AUTHORINFO, and LOCATIONS elements. The following code shows how the TQSWINDOW element is used, after which the specific attributes will be discussed.

<?xml version="1.0"?>
<TQS VERSION="2.0" EDITABLE="1">
  <TITLE>My First TQS Application</TITLE>
  <AUTHORINFO ... />
  <TQSWINDOW
    WIDTH="720"
    HEIGHT="520"
    FONT="Times"
    TEXTCOLOR="yellow"
    SELCOLOR="#00FFFF"
    BGCOLOR="#0E2FB1"
    BGIMG="background.gif"
  />
  <LOCATIONS START="0">
    ...
  </LOCATIONS>
</TQS>

You do not need to use each of these attributes; use only the ones which you would like to change. Also, subsequent versions of TQS have introduced several more attributes which you can use; see the Reference for more information.

The first two, WIDTH and HEIGHT, specify the width and height of the window, in pixels. (Whether the size includes the title bar and borders can be controlled by the SIZEINCLNC attribute; more detail is given in the TQSWINDOW element reference.) Experiment with different sizes until you find the one that works best for your application.

The FONT attribute lets you choose which font is used to display all text. TQS uses Verdana as a default; you may find that you like the look of Times New Roman or some other font better. Currently, you cannot set the font of individual items, such as headings or hangman letters; all items are affected by the FONT attribute.

Instead of using the default text color of white, you may prefer using a different hue. The TEXTCOLOR attribute lets you set the color that is used for normal text. You can either specify the color in hexadecimal #RRGGBB format, or using a named color. See the Reference's color table for more information.

Like the TEXTCOLOR attribute, the SELCOLOR attribute can be set to either a color code or named color. This attribute lets you specify the color of selected items, such as when you hover over a menu item, answer, or hangman letter. It defaults to yellow.

If you find TQS's default dark blue background to be too dark for your appplication, you can change it using the BGCOLOR attribute. Once again, use a named color or color code.

The BGIMG attribute specifies the file name of an image to be tiled across the background of the window.

TQS 2.7 introduces additional attributes that you can use to control the background image, or display a gradient of two colors. Also, it introduces new mechanisms to give individual locations their own custom colors or backgrounds. See Part XVI of the tutorial for more information on these features.

Another way to customize the feel and mood of your application is to specify an audio file to play in the background. For instance, in our application featuring United States Hangman and Trivia, we may wish to play a MIDI file of the national anthem in the background. This is accomplished by adding a BGSOUND element to the TQS element, as follows:

<?xml version="1.0"?>
<TQS VERSION="2.0" EDITABLE="1">
  <TITLE>My First TQS Application</TITLE>
  <AUTHORINFO ... />
  <TQSWINDOW ... />
  <BGSOUND>anthem.mid<BGSOUND>
  <LOCATIONS START="0">
    ...
  </LOCATIONS>
</TQS>

The text of the BGSOUND element specifies the file name, which by default must reside in the same directory as the TQS document. TQS starts playing the file when the application starts and does not loop through it once it has finished.

In Part VII of the tutorial, you have been exposed to a variety of methods to customize your TQS application, including window size, color, font, and sound. Part VIII will demonstrate how to organize a number of locations, using a location hierarchy.

Part VIII: Creating a Location Hierarchy

©2020 Bot Productions. All rights reserved.Last Updated: September 9, 2007