Xfwm4, нативный менеджер окон рабочего стола Xfce4, использует простую, но гибкую машину тем оформления, основанную на карте элементов изображения в формате .xpm. Xfwm4 также использует текстовый файл для других опций конфигурации (см. раздел “Файл themerc”). Кроме того, можно заставить тему оформления подхватывать цвета из темы gtk, что описывается в разделе “Подхватывание цветов gtk” этого документа.

В версии 4.0 рабочего стола Xfwm4 темы можно найти в следующих папках:

• Домашняя (home) папка пользователя /.themes/xfwm4/название_темы (напр.: /home/joe/.themes/xfwm4/b5)
• Папка общих данных системы /xfwm4/theme_name (напр.: /usr/share/xfwm4/themes/b5)

В версии 4.2 рабочего стола Xfwm темы располагаются согласно стандарту и находятся в следующих папках:

• Домашняя (home) папка пользователя /.themes/название_темы/xfwm4 (напр.: “/home/joe/.themes/b5/xfwm4”)
• Папка общих данных системы /themes/название_темы/xfwm4, которая контролируется менеджером пакетов (напр.: “/usr/share/themes/b5/xfwm4”)
• Папка общих данных системы /local/themes/название_темы/xfwm4, которая контролируется локальным администратором (напр.: “/usr/local/share/themes/b5/xfwm4”)

У окон может быть два состояния: активные (в фокусе) и неактивные (не в фокусе). Для этих состояний xfwm4 использует растровые файлы с соответствующими названиями, например title-1-active.xpm и title-1-inactive.xpm.

Для оформления панели заголовка xfwm4 использует 5 растровых файлов с названиями от title-1-active.xpm до title-5-active.xpm. При этом файлы с названиями top-left-active.xpm и top-right-active.xpm представляют собой углы левого и правого краев, как показано на Рис. 2.

Рис. 2 - Растровые файлы, представляющие все внешнее оформление окна

Та же система названий файлов применяется и к неактивным окнам. При этом слово “active” в названиях файлов заменяется словом “inactive”, например title-1-inactive.xpm.

Цвет текста в панели заголовка, его тени, ориентация и прочие параметры задаются файлом themerc и описаны в соответствующем разделе этой страницы.

Каждая боковая сторона окна состоит из двух растровых файлов. Файлы для левой стороны именуются left-active.xpm и bottom-left-active.xpm, а для правой, соответственно, right-active.xpm и bottom-right-active.xpm.

Нижняя граница окна состоит из файлов bottom-active.xpm и bottom-inactive.xpm. При отрисовке окна такой файл повторяется цепочкой до достижения размера окна.

ПРИМЕЧЕНИЕ: Области для захвата мышью по краям окон для изменения размера этих окон задаются в xfwm по ширине границ окна. Таким образом, чем шире файлы границ окна, тем шире поле захвата мышью. Это может влиять на удобство (и возможность) изменения размеров окон путем захвата границы окна мышью (особенно могут играть роль файлы bottom-left и bottom-right, отвечающие за отрисовку нижних углов окна).

Xfwm4 до шести кнопок - закрепление (stick) окна на всех рабочих местах (виртуальных рабочих столах) меню управления окном, сворачивание окна в заголовок (shade), сворачиванеие окна в панель задач (minimize), разворачивание на весь экран (maximize) и закрытие (close).

У кнопок могут быть следующие состояния: активное (active, focused), неактивное (inactive, unfocused), подсвеченное (prelight, при наведении мыши) и нажатое (pressed). На Рис. 3: AbiWord Image menu-active.gif AbiWord Image menu-inactive.gif AbiWord Image image_2.gif

Рис. 3 - Состояния кнопок Xfwm4

Также в Xfwm4 могут использоваться состояния “задействовано” (toggled) для указания, задействована ли функция кнопки - см. Рис. 4. AbiWord Image stick-active.gif AbiWord Image stick-inactive.gif AbiWord Image stick-pressed.gif AbiWord Image stick-toggled-active.gif AbiWord Image image_3.gif AbiWord Image stick-toggled-pressed.gif

Рис. 4 - Кнопки прикрепления (stick) с вариантами отображения для задействованного состояния (toggled)

В версии Xfwm4 4.6 добавлен новый эффект для кнопок активного окна, prelight. При наведении курсора мыши на кнопку, кнопка может “подсвечиваться”. Этот эффект может добавляться ко всем шести видам кнопок активного (active) окна путем добавления файлов с соответствующими названиями, например maximize-prelight.xpm или maximize-toggled-prelight.xpm.

Для настройки таких параметров как цвета текста, расстояния для кнопок и прочих в панели заголовка xfwm4 использует текстовый файл с названием themerc, располагаемый рядом с остальными файлами в папке с соответствующей темой оформления.

Можно “закрепить” расположение кнопок для тем, в которых это задумано, хотя стоит упомянуть, что тем самым ограничивается свобода действий пользователя над оформлением и этого стоит избегать без веских явной необходимости (например, как в теме b5, показанной ниже). Далее дается описание меток для кнопок управления окном (строки, начинающиеся с #; их стоит добавлять в начало каждого такого файла для удобства пользователей),

# Значения меток для параметра button_layout:
#    O = Меню управления окном (option menu)
#    T = Кнопка "закрепить окно на всех виртуальных рабочих столах" (stick)
#    H = Кнопка "свернуть окно в панель задач" (hide)
#    S = Кнопка "свернуть окно в панель заголовка" (shade)
#    M = Кнопка "развернуть окно во весь экран" (maximize)
#    C = Кнопка "закрыть окно" (close)
#    | = Текст заголовка окна (title)
button_layout=OTS|HMC

В качестве рабочего примера рассмотрим тему “B5”. В ней используется только кнопка закрытия окна, чему соответствует строка “button_layout=C|” в файле themerc.

Еще один параметр, задаваемый в файле themerc это “title_full_width”. Логическое значение этого параметра задает, как располагаются изображения в панели заголовка.

Когда значение параметра выставлено как “true”, центральное растровое изображение повторяется цепочкой до заполнения всей ширины окна:

Когда значение параметра выставлено как “false”, центральное растровое изображение повторяется цепочкой до заполнения лишь ширины текста заголовка:

К тексту заголовка окна можно добавить тень путем задания значений “title_shadow_active” для активного окна и “title_shadow_inactive” для остальных, неактивных, окон.

Возможными значениями этого параметра являются “false”, “true”, и “frame”.

Положение текста заголовка можно смещать, чтобы оно соответствовало отрисовываемой графике. Количество пикселей по горизонтали и вертикали задается численными значениями после знака равенства в следующих строках:

• title_horizontal_offset=
• title_vertical_offset_active=
• title_vertical_offset_inactive=

Данные строки необязательны, и без их значения считаются равными нулю при их отсутствии.

Подобно описанному в предыдущем разделе, кнопки можно смещать по горизонтали, используя необязательный параметр “button offset”. Стоит упомянуть, что это значение рассчитывается относительно соответствующей границы окна (window border), не рамки окна (frame border).

Необязательный параметр “button_spacing” задает количество пикселей между всеми кнопками.

Необязательный параметр “maximized_offset” задает количество пикселей между крайней границей окна (top-right-active) и крайней кнопкой (close, hide или иной) в развернутом на весь экран окне.

При помощи необязательного параметра show_app_icon можно заменять кнопку меню управления окном на значок, соответствующий открытому приложению. Размер значка приложения при этом ограничивается шириной кнопки меню. Stay tuned!

• show_app_icon=true #Показывать значки приложений
• show_app_icon=false #Показывать кнопку меню

Если в теме не предумотрена отрисовка кнопки меню, можно использовать файл с пустым квадратом.

Как можно заметить, тема, используемая в Xfwm4 по умолчанию, подхватывает цвета текущей темы gtk. Цвета темы xfwm можно задавать в файле themerc. Если они там не задаются, они автоматически подхватываются из текущей темы gtk. Использовать можно следующие цвета:

Значения для параметров “fg” (передний план) и “bg” (задний план) в gtk задаются в файле gtkrc текущей темы gtk. Обратите внимание на то, что значения “dark”, “light” и “mid” не могут быть заданы в файле gtkrc. Эти значения вычисляются автоматически по формуле (dark = 0.7 * bg, light = 1.3 * bg, mid = 0.5 * (dark + light)). Если соответствующие цвета не заданы в файле themerc, то во время исполнения отрисовки символы заменяютя на вычесленные, чтобы границы окон унаследовали цвета из темы gtk.

Чтобы задействовались определенные автором темы цвета, файлы XPM нужно соответственно отредактировать. Поскольку файлы XPM внутренне представлены как текст, их можно редактировать не только в графическом редакторе типа GIMP, но и в любом текстовом редакторе.

XPM (X PixMap) это текстовый формат изображений в кодировке ASCII, используемый в X Window System. Создан в 1989 г. Даниэлем Дардайе (Daniel Dardailler) и Коласом Нахабу (Colas Nahaboo) в Inria Laboratories во Франции и позже улучшен Арно Ле Хором (Arnaud Le Hors). Формат предназначен в первую очередь для создания значков и поддерживает прозрачность. Файлы формата имеют простую структуру, производную от более раннего синтакса XBM. Файлы могут создаваться и манипулироваться при помощи любого текстового редактора и включаться в файлы, написанные на языке программирования C (Си).

Из вышеприведенного текста следует, что еслии открыть файл XPM в любом текстовом редакторе, можно будет увидеть примерно следующее:

/* XPM */
static char * title_2_active_xpm[] = {
"5 21 10 1",
"       c None",
".      c #000000",
"+      c #FFFFFF s active_hilight_2",
"@      c #D5D6D5 s active_color_2",
"#      c #4B58A2 s active_shadow_1",
"$      c #525FAB s active_color_1",
"%      c #848FD6 s active_mid_1",
"&      c #B4BAB4 s active_mid_2",
"*      c #949594 s active_shadow_2",
"=      c #FFFFFF s active_hilight_1",
".....",
"++++#",
"@@@@#",
"@@@@#",
"@@@@#",
"@@@@#",
"@@@@#",
"@@@@#",
"@@@@#",
"@@@@#",
"@@@@#",
"@@@@#",
"@@@@#",
"@@@@#",
"@@@@#",
"@@@@#",
"@@@@#",
"@@@@#",
"@@@@#",
"@@@@@",
"@@@@@"};

Не слишком углубляясь в подробности формата XPM, можно сказать, что файл изображения состоит из разных разделов: раздел описания формата изображения (ширина в пикселях, высота в пикселях, число цветов, количество обозначающих знаков на каждый цвет), раздел описания обозначений пикселей и раздел описания пикселей. Более подробно формат описан на Википедии: https://ru.wikipedia.org/wiki/X_Pixmap.

A character is assigned to each color of the image (if the image has more colors than available charaters, then more than a single character can be assiged to a colors). If a color symbol is specified, the given color will be ignored and replaced by the corresponding color in the color symbol table.

To get the gtk colors applied to your theme, you need to edit the XPM files and add the proper color symbols to the color definition table.

"       c None",
".      c #000000",
"+      c #FFFFFF",
"@      c #D5D6D5",
"#      c #4B58A2",
"$      c #525FAB",
"%      c #848FD6",
"&      c #B4BAB4",
"*      c #949594",
"=      c #FFFFFF",

must be changed to

"       c None",
".      c #000000",
"+      c #FFFFFF s active_hilight_2",
"@      c #D5D6D5 s active_color_2",
"#      c #4B58A2 s active_shadow_1",
"$      c #525FAB s active_color_1",
"%      c #848FD6 s active_mid_1",
"&      c #B4BAB4 s active_mid_2",
"*      c #949594 s active_shadow_2",
"=      c #FFFFFF s active_hilight_1",

As a matter of fact, “thinking” of the gtk colors as early as drawing the theme can save a lot of time in this phase. If you use the exact same color across all the pixmaps, you can use the Search/Replace functionnality of the text editor to add the color symbols. You could even use a tool such as “sed” to perform mass changes in all the XPM files of the theme.

As simple as it is, the color symbol replacement table of the XPM format is not powerfull enough to achieve the nice color gradients seen in most recent themes.

Xfwm 4.2 includes yet another functionality that gives real nice result while being still compatible with the previous theme format: It composes the final image from the XPM file and it colors replacement table, and another PNG file with transparency, if present.

The names of the PNG files are identical to the names of the corresponding XPM files, with the “.png” file extension (ie title-1-active.png, top-right-inactive.png, etc.). The PNG file is by no mean required, if it's not present, xfwm4 won't complain, but if there is a PNG image of the same name as the XPM image, and if that PNG has an alpha channel (ie, it has semi-transparent pixels) then the PNG image will be automatically layered on top of the XPM image to produce the final image.

This technique has several advantages:

• It's fairly simple from a theme designer point of view, most people are working with similar techniques when composing themes with tools such as The GIMP.
• It's backward compatible with xfwm4 from Xfce 4.0, the PNG files are just ignored by xfwm4 4.0.

I hope this small “how-to” for creating themes for xfwm4 will help you design your own themes. It would be great if you could share your themes with others on http://www.themedepot.org (which is the prefered site for xfce related themes) or from http://themes.freshmeat.net.

you can also find xfce theme at http://www.xfce-look.org

This is a list of all possible part names in a decoration, so you can easily copy and paste them. (Tip: if using Firefox hold Ctrl while dragging, to select cells instead of lines. )

This how-to has been started by Drewbian (drewbian at tsn dot cc) and later modifed by Olivier Fourdan (fourdan at xfce dot org) and Renato Santos (renatosan at gmail dot com).