|
|
GTK主题的样式是由引擎决定的，如果大家还记得，我们曾经使用过嫣然分享的clearlooks系列gtk主题，那个主题的引擎是自带的。但由于系统冲突造成了问题，veket不再带有这个系列。
现在我们就剩下系统默认的gtk2.0主题了，没关系，我们照样还可以做出和我们的icewm主题配合的gtk主题来，而且制作方法非常简单，效果也不算太差。大家用过我做的Dark系列应该有感受，如果你同时使用同名的icewm和gtk主题，程序窗口和窗口内容部分是协调的，看不出来是由不同的程序管理的。
目前我们系统里默认的有两种gtk主题样式，我先介绍简单的一种。
Gradient-grey是系统自带的主题，非常简单，非常容易制作：
图一
我们可以利用这个模板很快做出一个和我们的icewm主题配合的gtk主题来。Perryfa-Beige就是这么做出来的：
图二
1. 概述
首先，我们来看一下gtk主题目录：/usr/share/themes/
在这个目录下已经装有一些gtk主题，目录名就是我们在主菜单“桌面 - chtheme GTK主题选择”界面看到的gtk主题的名字。“chtheme GTK主题选择”的界面做得不错，每个主题的效果，例如滑动条、按钮、标题栏的效果，在这个界面基本上能看出大概来，你无须加载主题就能有个大概的印象。
点击进入目录：/usr/share/themes/Gradient-grey/gtk-2.0/
目录里非常简单，只有四张png图片和一个定义文件：gtkrc
（1）图片在主题中的作用
为了让大家看得清楚，我在下图选用了一个颜色对比比较强烈的gtk主题- MAXSPEED，这个主题也是用Gradient-grey当模板改的，我打开了“桌面 - chtheme GTK主题选择”，点MAXSPEED主题，不需要应用，整个窗口就显示MAXSPEED主题的外观，我用gimp打开了MAXSPEED主题里的tab1、2、3三张图片：
图三
从上图可以看出：
tab1.png：用于已选择按钮，滑动条前景。还有在上图看不见需要到界面上去试的，鼠标移上按钮时按钮的变色，鼠标移到下拉条时的变色（图中写着“Theme”的）。还有，多标签的页Active标签，如默认的firefox（firefox主题比较简单，所以窗口内容就被gtk接管）的标签页，sakura多标签页时的激活标签等。基本上，这个图片定义Active激活状态。
tab2.png：用于未被选择按钮，滑动条背景，下拉条背景。以及在这图上看不见的，多标签的页一般标签，程序菜单下拉时的选择条等。
tab3.png：用于无法被选择的按钮，即图中的“禁用”按钮。
在目录中还有个default.png，从gtkrc文件看，应该是用于除上面三种按钮之外的按钮，到目前为止，我只在Sylpheed里面发现过它的一点点作用，在某个按钮边上出现一圈边框。
（2）gtkrc定义
gtkrc这个文件是用来定义图片应用，以及各种背景、前景和文字的颜色的。
颜色是要应用到元素上去的，gtk主题的元素有两对：背景(bg）和前景（fg），基层（base）和文字（text）。
背景和前景应用于窗口功能部分，而基层和文字一般应用于文本编辑界面。
gtk对于每一个元素的颜色定义有五种状态：激活（ACTIVE），非激活（NORMAL），鼠标移过去时的变色（PRELIGHT)，已被选择（SELECTED），不可选择（INSENSITIVE）。
2. 制作
我使用先前icewm主题教程做出来的主题为范例，因为那个主题现在还没有gtk主题去配它。
模板使用MAXSPEED，因为它的颜色对比比较强烈，改完了效果比较明显。而它本来就是Gradient-grey改的，所以文件结构以及参数项和Gradient-grey一模一样。
（1）制作主题目录
在/usr/share/themes/目录里复制MAXSPEED到另一个名字，我这里用“Perryfa-Fallout-1”，因为它是用来和“Perryfa-Fallout”icewm主题搭配的。
（2）在gtkrc定义窗口基色
gtkrc里面有很多颜色定义，但是有很多都是显示在图片上的，所以只有做好了图片才能定义，不然就看不清楚效果。颜色这个东西很难伺候，同样的颜色在不同的背景里，人眼看到的效果是不一样的，所以，颜色不放到背景里是很难定义准确的。也正因为如此，我通常都是先定义窗口基色，然后才去做图片，这样对图片颜色的感觉会比较准确。换句话说，就是要根据窗口的层次来一层一层定义，先定义最下面的窗口基色，然后定义上面的按钮，再定义按钮上的文字。
定义窗口基色需要考虑很多牵连因素，深色背景一般比较难做，因为深色背景就需要浅色文字搭配，而有些软件做得比较傻，它会自己定义窗口背景，例如白色，然后采用主题使用的文字颜色。这样就很麻烦，软件定义的窗口背景常常是浅色，在使用浅色文字的主题时，文字就看不清。所以，大部分gtk主题都很讨巧，直接做成背景浅色、文字深色，这样就比较百搭。可是我就是不喜欢浅色gtk主题，因为我喜欢用深色icewm主题，而浅色gtk主题总是和icewm主题特别地生分，不像一家子。
这个范例主题必然又是深色背景。因为整个窗口的基调就是黯哑深邃的。
我打开gcolor2，在桌面上选了一种偏棕的灰色。选这个颜色首要原因是它和Fallout主题是协调的，第二个原因是，它不算太黑，我仍然可以使用黑色作为窗口的文字色，这样，就避免了某些傻软件的文字看不清的问题。作为窗口文字的主色，其实我一直都喜欢用感觉中庸的黑色，用别的颜色总有小家子气轻浮佻达的感觉，但有时候是不得不用彩色，因为窗口底色太黑了。
图四
在gtkrc里的定义是这样的：
bg[NORMAL]= "#6F6C63" #窗口基色，深灰
fg[NORMAL]= "#000000" #窗口文字色，黑
（3）修改图片
首先要提醒一下：修改gtk主题的图片是有风险的！！
如果你的图片有问题、打不开，例如保存时系统或gimp有意外情况发生，那么使用该主题时会发生系统挂死的状况。重启系统也起不来，因为系统认为你选用的就是这个有问题的gtk主题，而gtk程序会一直在试图打开你的问题图片，你的veket图形界面就彻底什么也干不了了。我曾经有过这样一次体验，gtk主题已被选用，我在修改图片，存盘时gimp崩溃，图片出错，于是我就再也起不来系统了，我只能暂时舍弃这个2fs，用其他的2fs文件启动系统，挂载出问题的这个2fs，用好的图片替换有问题的图片，再把2fs换回来才把系统找回来了。请一定注意。
tab1.png 20x20
这张图片是用于激活状态的，在整个界面上显示得相对较少，所以，一般用比较鲜亮的颜色。
要注意的是，这个图片同时也用于程序窗口的滑动条，而且，横、竖的滑动条都用它，滑动条是会根据你所使用的窗口的内容多少发生大小变化，大到一长条、小到一个点都有可能。所以使用有纹理的图片就要多试，因为纹理会被拉长压扁，完全面目全非。这对我们这个主题很不利，因为Fallout主题是纹理至上的。
Fallout主题的激活状态标识就是暗绿色，这没什么可说的。我的素材就从Fallout的icewm主题里来。
到icewm主题的/usr/share/icewm/themes/Perryfa-Fallout/里去打开titleT.xcf，这是我们先前做icewm主题留下的素材文件。从里面找一段绿色：
图五
缩放成20x20，存成：tab1.png
文字看不见了，不要紧，这个文字是可以自己定义的，后面我们可以改掉它。
tab2.png 20x20
这个图片是会大面积出现的，所以要使用和背景比较融合的颜色，而且它会用于滑动条的背景，会在x和y轴两个方向都被大比例地拉伸，做纹理也会比较困难。
我拿icewm主题的工具条条背景图片 - taskbarbg.xpm垂直翻转，压缩成20x20，看看效果如何：
图六
看上去还凑合，那些纹理虽然变形得厉害，但看着也挺有意思的。
主要是黑色文字在上面还能看得清，这个颜色是不能单独改的，必须和窗口文字颜色一样。
tab3.png 20x20
这个图片简单了，反正用得不多。让它跟背景基本上融为一体就好了。
点gimp工具箱的前景色，在跳出来的改变前景色窗口里输入我们前面定义窗口基色的颜色“6F6C63”让它成为前景色。背景色选用灰色。
新开做一个20x20的透明图片，用混合工具填充上渐变的颜色，效果就是这样：
图七
上面“禁用”那个按钮，就是我们新做的。
default.png
虽然很难看到这个图片起作用，无论如何还是做一下：
图八
（4）定义gtkrc
现在我们可以来完成gtkrc的定义了。
背景(bg）和前景（fg）
先把Active按钮上的颜色改过来
fg[PRELIGHT] = "#05D005" #鼠标移上时前景色，浅绿
fg[ACTIVE] = "#05D005" #激活前景色，浅绿
图九
鼠标移上条目的背景色：
bg[PRELIGHT] = "#25140A" #深棕
图十
我用鼠标移到了Radio3的位置，它的背景就变成了深棕色。
这里要注意的是，对于按钮，鼠标移上去时，背景不会显示这个颜色，而是默认使用了激活状态的图片：tab1.png
已被选择项的前景和背景色：
fg[SELECTED] = "#05D005" #已被选择项前景色，浅绿
bg[SELECTED] = "#25140A" #已被选择项背景色，深棕
图十一
看rox-filer窗口已被选择的gtkrc文件的背景色和文件名颜色。
禁用项的文字色我觉得默认的就已经很好，注释掉这一行。
#fg[INSENSITIVE] = ""
下面这两项也被注释掉了，因为我们使用了图片。
#bg[INSENSITIVE] = "gray90"
#bg[ACTIVE] = "#CFCFAC"
基层（base）和文字（text）
文字编辑窗口背景和文字色：
base[NORMAL] = "#ffffff" #文字编辑窗口背景色，白
text[NORMAL] = "#000000" #文字编辑窗口文字色，黑
选择状态：
base[SELECTED]= "#25140A" #被选择的文字背景色，深棕
text[SELECTED]= "#FFFFFF" #被选择的文字色，白
图十二
看上图文本编辑器里被选择的部分，深棕色背景，白色字。
base[ACTIVE] = "#6F6C63" #当窗口为非激活时，被选择的文字背景色，深灰
text[ACTIVE] = "#25140A" #当窗口为非激活时，被选择的文字色，深棕
图十三
看上图，当文本编辑器成为非激活窗口时，被选择的部分变成深灰背景，深棕色文字。
base[PRELIGHT]和text[PRELIGHT]这一对参数被我注释掉了，因为，在文本编辑器上，通常我们不习惯鼠标走到哪里、哪里就变颜色。
base[INSENSITIVE]和text[INSENSITIVE]这一对也不需要的，文本编辑窗口，有谁见过打上去的字不能碰的？死机不算。
虽然参数定义被注释掉了，碰上意外情况也不用担心，反正还有默认的，实在需要，就让它们走默认定义吧。
目录树背景颜色定义
GtkTreeView::odd_row_color = "#6F6C63" #目录奇数行背景色
GtkTreeView::even_row_color = "#B6CEB6" #目录偶数行背景色
我用了程序窗口背景的偏棕的灰色，和一种偏灰的淡绿。
图十四
程序菜单选择项更改
这个主题模板默认是采用一般按钮的图片（tab2.png）来做下拉菜单的选择条的。如图六和图九所示。
我觉得这种选择不好，和icewm主题的主菜单选择条不配合，所以就改成暗绿条，也就是tab1.png:
style "menuitem"
{
engine "pixmap" {
image
{
function = BOX
recolorable = TRUE
file = "tab1.png"
border = { 6,6,6,6 }
stretch = TRUE
}
}
}
上面“file="tab1.png”就是我改的，默认是tab2.png。这样，下拉菜单就变成这样了：
图十五
标签页标题栏背景更改
原模板主题有一个定义非常奇怪，看下面这一段：
style "notebook"
{
engine "pixmap" {
image
{
function = EXTENSION
recolorable = TRUE
state = ACTIVE
file = "tab2.png"
border = { 6,6,6,6 }
stretch = TRUE
}
image
{
function = EXTENSION
recolorable = TRUE
file = "tab1.png"
border = { 6,6,6,6 }
stretch = TRUE
}
}
}
乍一看感觉比较奇怪，因为ACTIVE项使用了tab2.png.一开始我们就知道，按钮的ACTIVE项是用tab1.png定义的，这里反过来了。
更为奇怪的的是，ACTIVE和非ACTIVE的标签页的标题所使用的文字颜色是反的，ACTIVE标签页标题文字使用的是fg[NORMAL颜色，而fg[ACTIVE]被用于未被选择的标签页文字，这真能把人活活气死。于是出来的效果是这样的：
图十六
在标签页标题栏，ACTIVE和非ACTIVE所使用的文字颜色和一般的定义是反的，ACTIVE标签页标题文字使用fg[NORMAL]的颜色（我们使用黑色），而fg[ACTIVE]（浅绿色）却被用于未被选择的标签页标题文字。
所以，为了让标签页的标题文字能看清楚，我只能把上面这一段改一下，改成：
style "notebook"
{
engine "pixmap" {
image
{
function = EXTENSION
recolorable = TRUE
state = ACTIVE
file = "tab3.png"
border = { 6,6,6,6 }
stretch = TRUE
}
image
{
function = EXTENSION
recolorable = TRUE
file = "tab2.png"
border = { 6,6,6,6 }
stretch = TRUE
}
}
}
于是，出来的效果就变成这样了
图十七
虽然没有使用默认的激活标志（在这个主题是暗绿色），但是好歹能看清楚标签页的标题了。
当然还是不完美。谁要是知道怎么把这个文字的颜色定义扭过来，麻烦告诉我。
对于模板主题的gtkrc里的其他定义行，保持远样，除非你对这些定义都很了解了，否则不要做任何改动，以免让你的主题不工作了。
另外，做gtkrc文件也要非常仔细，如果你在gtkrc里面有任何错误，例如某个标点符号不对或者某个颜色的数字少了一位之类，整个gtk主题就退回默认，正确的部分也不会显示了。这一点不如icewm灵活。好在没什么危险。
好了，一个简单的GTK主题就做完了。
最后在这里要解释一下一些例外情况。
在leafpad文本编辑器，显示都是符合gtk定义的。在文件管理器ROX-Filer，文件所在的窗口应用背景(bg）和前景（fg）模式。但thunar文件管理器不是，它把自己的目录和文件所在的窗口当成文本编辑器窗口，按基层（base）和文字（text）的颜色定义显示，而且，当你用鼠标点住一个目录或文件时，它呈现SELECTED状态，但你如果点一下目录（不是点住不放），它呈现ACTIVE状态，这和我们这里的gtk定义稍微有点不一样。所以，我们对那些软件的显示也不能太较真了，这是linux，大家都很有个性呀。
[ 本帖最后由 perryfa 于 2010-1-8 22:30 编辑 ] |
|
|手机版|Archiver|veket官方网站论坛
( 粤ICP备 11052856 )
IP卡
狗仔卡
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
抢沙发
显身卡
