Home > Xfce, Xfwm4 > Xfwm4: modificare tema

Xfwm4: modificare tema

19 Ottobre 2019

Xfwm4, ovvero il window manager nativo di Xfce4, utilizza immagini in formato xpm ed un file di testo, per le altre opzioni di configurazione (themerc).
Come esempio di “theming”, modifichiamo il button close nella titlebar della finestra (in alto a destra) in modo che assuma la
colorazione rossa, quando il puntatore del mouse ci passa sopra.
Per fare questo, basterà modificare il file xpm corrispondente a quel pulsante.

Per prima cosa facciamo una copia del tema xfwm4 che ci interessa modificare, perchè non è mai una buona idea modificare i file originali; nel mio caso il tema in questione è Greybird.
Apriamo quindi un terminale e diamo i comandi per la copia:

banco@banco-desktop:~$ sudo cp -r /usr/share/themes/Greybird /usr/share/themes/GreybirdCustom

Il nome GreybirdCustom, indica il nostro tema che sceglieremo dopo aver effettuato le modifiche.

Ora dobbiamo identificare quale oggetto viene coinvolto dalla modifica.
Per prima cosa facciamo una distinzione

– Active Window e Inactive Window

Come da titolo, una window può essere attiva (active) e non attiva (inactive), pertanto quando cercheremo una parte di finestra, dovremo specificare anche se active o inactive, es:

title-1-active.xpm e title-1-inactive.xpm

– TitleBar

La titlebar della window è formata da 7 pixmaps per la active window:

top-left-active.xpm: raccordo in alto a sinistra


title-1-active.xpm
title-2-active.xpm
title-3-active.xpm
title-4-active.xpm
title-5-active.xpm

riguardano la titlebar

top-right-active.xpm: raccordo in alto a destra

e i relativi per la inactive window

top-left-inactive.xpm: raccordo in alto a sinistra
title-1-inactive.xpm
title-2-inactive.xpm
title-3-inactive.xpm
title-4-inactive.xpm
title-5-inactive.xpm
top-right-inactive.xpm: raccordo in alto a destra

Per modificare il testo della titlebar, quindi il colore, l’ombra e l’allineamento,
sarà necessario editare il file themerc.

– SideBars e Bottom

I cosiddetti lati della window, sono identificati da 2 pixmaps per parte, a sinistra:

left-active.xpm: lato sinistro
bottom-left-active.xpm: raccordo con il bottom bar

a destra:

right-active.xpm: lato destro
bottom-right-active.xpm: raccordo con il bottom bar

tra i due raccordi bottom-left-active.xpm e bottom-right-active.xpm, risiede il:

bottom-active.xpm

che verrà ripetuto fino a riempire la lunghezza della bottom bar.
Come si può notare dall’immagine del top-left-active, top-right-active, nel tema di riferimento Greybird, i lati sono minimi, infatti sono identificati da un unico pixel in trasparenza. Tali sezioni sono identificate dal file xpm:

/* XPM */
static char * <xpm_var_name>[] = {
"1 1 1 1",
" 	c #939393",
" "};

I relativi pixmaps dedicati alla inactive window.

– Buttons

Xfwm4 può utilizzare fino a 6 action-buttons:

stick
menu
shade
hide
maximize
close

Gli stati di questi bottoni sono 4:

active: aspetto del bottone nella active window
inactive: aspetto del bottone nella inactive window
prelight: aspetto del bottone quando il puntatore del mouse ci passa sopra
pressed: aspetto del bottone quando viene premuto

Alcune caratteristiche dei bottoni, come gli offset o la spaziatura tra essi, sono settabili, come per
i testi, nel file themerc, risiedente nella stessa dir dei pixmaps.

Ad esempio il file themerc di Greybird è:

active_text_color=#686868
active_text_shadow_color=#ececec
inactive_text_color=#bbbbbb
inactive_text_shadow_color=#ececec
title_shadow_active=true
title_shadow_inactive=true
full_width_title=true
title_vertical_offset_active=2
title_vertical_offset_inactive=2
button_offset=4
button_spacing=2
shadow_delta_height=2
shadow_delta_width=0
shadow_delta_x=0
shadow_delta_y=-10
shadow_opacity=50

Ricapitoliamo quali sono i pixmaps

Window frames:

active, inactive
top-left-active, top-left-inactive
title-1-active, title-1-inactive
title-2-active, title-2-inactive
title-3-active, title-3-inactive
title-4-active, title-4-inactive
title-5-active, title-5-inactive
top-right-active, top-right-inactive
right-active, right-inactive
bottom-right-active, bottom-right-inactive
bottom-active, bottom-inactive
bottom-left-active, bottom-left-inactive
left-active, left-inactive

Buttons:

active, inactive, prelight, pressed
menu-active, menu-inactive, menu-prelight, menu-pressed
shade-active, shade-inactive, shade-prelight, shade-pressed
stick-active, stick-inactive, stick-prelight, stick-pressed
hide-active, hide-inactive, hide-prelight, hide-pressed
maximize-active, maximize-inactive, maximize-prelight, maximize-pressed
close-active, close-inactive, close-prelight, close-pressed

Toggled Buttons:

toggled-active, toggled-inactive, toggled-prelight, toggled-pressed
shade-toggled-active, shade-toggled-inactive, shade-toggled-prelight, shade-toggled-pressed
stick-toggled-active, stick-toggled-inactive, stick-toggled-prelight, stick-toggled-pressed
maximize-toggled-active, maximize-toggled-inactive, maximize-toggled-prelight, maximize-toggled-pressed

L’obbiettivo iniziale era di colorare di rosso il close button della window, quando il puntatore del mouse ci passa sopra. Il pixmap interessato sarà:

close-prelight.xpm

Apriamo con un editor di testo il file suddetto:

sudo mousepad /usr/share/themes/GreybirdCustom/xfwm4/close-prelight.xpm

Il contenuto sarà il seguente:

/* XPM */
static char * close_prelight_xpm[] = {
"20 24 8 1",
" 	c None",
".	c #939393",
"+	c #FFFFFF",
"@	c #DEDEDE s active_color_2",
"#	c #4B4B4B",
"$	c #666666",
"%	c #E5E5E5",
"&	c #8B8B8B",
"....................",
"++++++++++++++++++++",
"@@@@@@@@@@@@@@@@@@@@",
"@@@@@@@@@@@@@@@@@@@@",
"@@@@@@@@@@@@@@@@@@@@",
"@@@@@@@@@@@@@@@@@@@@",
"@@@@@@@@@@@@@@@@@@@@",
"@@@@@@@@@@@@@@@@@@@@",
"@@@@@@@@@@@@@@@@@@@@",
"@@@@@@##@@@@##@@@@@@",
"@@@@@@$$#@@#$$@@@@@@",
"@@@@@@%$$##$$%@@@@@@",
"@@@@@@@%$$$$%@@@@@@@",
"@@@@@@@@&$$&@@@@@@@@",
"@@@@@@@#$$$$#@@@@@@@",
"@@@@@@#$$%%$$#@@@@@@",
"@@@@@@$$%@@%$$@@@@@@",
"@@@@@@%%@@@@%%@@@@@@",
"@@@@@@@@@@@@@@@@@@@@",
"@@@@@@@@@@@@@@@@@@@@",
"@@@@@@@@@@@@@@@@@@@@",
"@@@@@@@@@@@@@@@@@@@@",
"@@@@@@@@@@@@@@@@@@@@",
"@@@@@@@@@@@@@@@@@@@@"};

Come sappiamo, ad ogni carattere corrisponde un colore.
Volendo mantenere lo stesso sfondo, basterà modificare i colori dei simboli: #, $, %, &.
Modificando ad esempio le stringhe inerenti i simboli precedenti, con queste tonalità di rosso:

"#	c #940e04",
"$	c #fc1303",
"%	c #c95951",
"&	c #e69b95",

…si dovrebbe ottenere l’effetto desiderato.

Ora basterà modificare il tema Xfwm4 mediante il Gestore delle Finestre, scegliendo il nostro GreybirdCustom.

Lo stesso principio può essere utilizzato per modificare la forma della finestra.
Prendiamo ad esempio il top-left-active.xpm, che per la versione default di Greybird è così costituito:

/* XPM */
static char * top_left_active_xpm[] = {
"8 24 4 1",
" 	c None",
".	c #939393",
"+	c #FFFFFF",
"@	c #DEDEDE s active_color_2",
"     ...",
"   ..+++",
"  .@@@@@",
" .@@@@@@",
" .@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@"
};

se lo confrontiamo con l’omonimo del thema Greybird compact:

/* XPM */
static char * top_left_inactive_xpm[] = {
"8 18 4 1",
" 	c None",
".	c #939393",
"+	c #FFFFFF",
"@	c #DEDEDE s active_color_2",
"     ...",
"   ..+++",
"  .@@@@@",
" .@@@@@@",
" .@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@",
".@@@@@@@"
};

Come si nota, l’altezza del pixmap è minore: 18 righe contro le 24 della versione di default.
Per l’effetto curvatura viene utilizzato il carattere ” ” (None), che indica la trasparenza.
Con queste indicazione è possibile quindi modificare il profilo della window stessa.

link utili:
file XPM

Categorie:Xfce, Xfwm4 Tag: ,
I commenti sono chiusi.