< GTK+ By Example

About

The aim of this page is to provide a guide to creating and modifying themes for GTK+ on both Linux and Windows.

Description

Customising the look of GTK+ applications involves modifying RC files, usually called gtkrc.

Explanation of GTKs rc files.

Some Gtk apps can have lots of rc files. Theses are initialization files and are usually modified from the application's preference dialog. GTKRC files are plain text files saved as "gtkrc" with no extension. For more information on the GTK+ rc file format visit http://library.gnome.org/devel/gtk-tutorial/stable/c2111.html This guide will concentrate on the one file that is used to adjust the look and feel of the application.

GTKRC'S

A GTK+ rc file can contain 4 main parts:

  • The Style Declaration How an item will be drawn onscreen,
  • A Class Declaration Assigns styles to a class,
  • A Widget Declaration Assigns a style to a widget,
  • A Widget_class Declaration Assigns a style to a particular widget by class name.


All GTK+ programs are made up of widgets and there are several attributes or flags that can be set for each widget:

  • fg modifies the foreground of the widget,
  • bg modifies the background of the widget,
  • base the widget's Editable, Tree, or List background,
  • bg_pixmap assigns an image to the background of the widget,
  • font changes the font attributes.


And each of these can have several states:

  • [NORMAL] The widgets normal state,
  • [PRELIGHT] When a mouse cursor is hovering over a widget (this is used by buttons and their subclasses),
  • [ACTIVE] For active widgets e.g. selected tab and scroll bars,
  • [INSENSITIVE] A disabled widget,
  • [SELECTED] Highlighted objects in a widget e.g. text.


The colors for these can be set using 1 of 3 different methods:

  1. A GTK+ string This is a number between 0 and 1,
  2. Hexadecimal The same as some website, values are set like this - #000000, and can be any value between 00 and ff,
  3. RGB This is any number between 0 and 256 e.g. 256 256 256,

To adjust the properities of a widget you need to first define a style.

Style

A style declaration may look something like this:-

style "default"
{
    font = "-*-helvetica-medium-r-normal--*-120-*-*-*-*-*-*"
    fg[NORMAL] = "#000000"
    fg[PRELIGHT] = "#000000"
    fg[ACTIVE] = "#000000"
    fg[SELECTED] = "#000000"
    fg[INSENSITIVE] = "#999999"
}

The first line is the style declaration, this line defines a new style and calls it default (of course this can be called anything you want). The following lines are the actual style. However for this to be applied it needs to be assigned to a GTK+ widget.

Gtk Widgets

There are many widgets in the GTK system but for the sake of the tutorial we will target the top most parent widget called - widget_class "GtkWindow", of which all other widgets will get their style from. To assign a style to a widget you would use:

widget_class "GtkWindow" style "window"

This instructs the widget called "GtkWindow" to use the style "window".

When the above code is copyed to a gtkrc file and accompinied with:

widget_class "GtkWindow" style "default"

and saved in the "theme" folder a difference should be noticed next time a GTKApplication is started or restarted.

Extending this to include images

To include images in a theme you would have to create the images and save them in the folder with the previously created gtkrc file. Once there you would edit the file to use the image.

style "Button"
{
    bg_pixmap[NORMAL] = "warning.xpm"
}

this is an example of using images (please note you will need to create warning.xpm in GIMP for this to work.

This article is issued from Wikibooks. The text is licensed under Creative Commons - Attribution - Sharealike. Additional terms may apply for the media files.