9.2. Edición avanzada de Themes

La mayoría de esta sección es tomada o con gran influencia de la página del manual de Fluxbox v0.1.13. Usualmente, la página del manual es la autoridad definitiva en este tema, pero este documento puede ser un poco más aclaratorio para el autor de styles principiante.

Para entender cómo el mecanismo de los styles funciona, es bueno saber un poco acerca de cómo los recursos de X11 funcionan.

Los recursos X11 consisten en una key (llave) y un valor. La llave esta construida a partir de varias llaves más pequeñas (a veces llamadas niños), delimitadas por un punto (.). Las llaves también pueden contener un asterisco (*) para funcionar como comodin, significa que una linea de texto servirá como varias llaves. Esto es bueno cuando se esta construyendo un style con uno o dos colores.

Fluxbox permite que usted configure sus tres principales componentes: la toolbar (barra de herramientas), el menú y la decoración de las ventanas. La slit automaticamente toma la configuración de la barra de herramientas pero puede ser configurada diferente si es necesario. La pequeña ventana que muestra la posición x-y mientras se arrastra la ventana, toma la configuración de la barra de titulo de la ventana.

Aqui hay algunos ejemplos rápidos para ilustrar la sintaxis básica:

Example 9-1. Estilo del reloj de la barra de herramientas

    toolbar.clock.color:  green

Esto configura el reloj de la barra de herramientas de color verde. Otro ejemplo:

Example 9-2. Estilo del Menú

    menu*color: rgb:3/4/5

Esto configura el menú y todos sus "niños" al color rgb:3/4/5. Para una descripción de los nombres de los colores, vea las paginas del manual de X11. Entonces esta configuración también se aplica a menu.title.color y menu.frame.color. Y con esto:

Example 9-3. Estilo de la Fuente

    *font: -b&h-lucida-medium-r-normal-*-*-140-*

puede configurar el recurso de la fuente para todas las llaves usen la misma fuente. Para información acerca de las fuentes instaladas en su sistema, puede usar un programa como xfontsel, gfontsel, o xlsfonts.

Ahora, lo que hace a Fluxbox tan espectacular, es la habilidad de renderizar texturas en el momento. La descripción de las texturas son especificadas directamente a la llave a la cual deben aplicarse, ejemplo:

Example 9-4. Estilo de la Textura

    toolbar.clock:   Raised Gradient Diagonal Bevel1
    toolbar.clock.color: rgb:8/6/4
    toolbar.clock.colorTo: rgb:4/3/2

No se preocupe, explicaremos cómo funcionan estas directivas. La descripción de una textura consiste en hasta cinco campos, que son los siguientes:

Table 9-1. Directivas de Textura

DirectivaDescripción
Flat / Raised / SunkenLe da al componente una apariencia plana (flat), levantada (raised) o hundida (sunken).
Gradient / SolidDibuja un color sólido (Solid) o una textura con gradiente (Gradient).
Horizontal / Vertical / Diagonal / Crossdiagonal / Pipecross / Elliptic / Rectangle / PyramidSeleccione uno de los tipos de texturas. Ellos solo funcionan cuando Gradient es especificado.
InterlacedEntrelaza la textura (oscurece cada otra linea). Esta opción es comunmente usada con gradientes, pero desde Blackbox v0.60.3 (y por lo tanto en todas las versiones de Fluxbox), también funciona con texturas solidas.
Bevel1 / Bevel2Tipo de bisel para utilizar. Bevel1 es el bisel por defecto. El sombreado es posicionado en el borde de la imagen. Bevel2 es una alternativa. El sombreado es posicionado un pixel adentro desde el borde de la imagen.

Aparte de la descripción de las texturas, la opción ParentRelative está también disponible, que hace que el componente aparezca como parte de su pariente.

Todos los gradientes estan compuestos por dos valores de colores: los recursos color y colorTo. Cuando Interlaced es usado en modo Solid, el recurso colorTo es usado para encontrar el color de interlace.

La lista completa de componentes y que tipo de valor pueden contener puede ser encontrada en Appendix C.

Ahora, esta parece una larga lista, pero recuerde, cuando cree su propio style, puede fácilmente configurar varias llaves con un simple comando, ejemplo:

Example 9-5. Típicos estilos cortos

    *color:             slategrey
    *colorTo:           darkslategrey
    *unfocus.color:     darkslategrey
    *unfocus.colorTo:   black
    *textColor:         white
    *unfocus.textColor: lightgrey
    *font:              lucidasans-10