此教程适用于塞班v5以及安卓的2.1版皮肤,只是两者分辨率不同导致代码中的位置部分不同而已,安卓的高分辨率皮肤可以用在v5上,会相应缩小,v5的貌似不可以用在安卓上,听人说的,由于没有安卓机也不好试……
另外此教程不用官方的制作的工具的,可能麻烦一点,这个自己取舍吧。
解包打包
首先是基本的解包打包,众所周知,百度2.1版本的皮肤后缀名为bds(这里只讨论安卓和塞班v5),我们要改皮肤的话就需要将后缀名改成zip,然后解压。
皮肤解压后得到的是三个(或者两个,下面会讲到)文件夹land、port和res,land里的是横屏皮肤对应的界面文件,port对应的是竖屏的,res则是键盘上出现的所有图片、文字以及按键之类的总定义的文件夹(语文不好,大家将就着看看吧,知道意思就好,不知道的话下面会详
细讲解的……)。有的皮肤可能只有竖屏界面,所以land文件夹没有了,就像我,只用竖屏,所以横屏的就删掉了,只要不用到横屏,那么就没有影响,当然如果想要发布的话,最好还是都留着,会有人需要的。
还有个info的txt文件,那个就是作者啊名称那些,不要也无所谓。
在修改完后再选中这三个文件夹然后打包成zip文件,再改后缀名为bds就可以使用了。
皮肤构成简介
现在的皮肤是各式各样的,那么它是如何构成的呢,这里我们简要说一下。以我的皮肤为例,如下图,这个面板是由皮肤背景、按键背景、按键前景等组成,左边那个符号所在的栏是list栏。
制作皮肤就是先确定按键位置和显示的文字,再做出对应的图片,并在res文件夹的default.css里定义好STYLE,然后一个键一个键的设置坐标、背景、前景、键值等。上图也可以看出要修改按键上显示的内容,只要修改按键前景就行,这个另附小教程。
接下来最先要讲的是res文件夹,因为所有的切片什么的都在这里面,我们要先搞清楚切片如
何调用才能制作或修改皮肤。首先就是多张png图片了,看到这些图片大家应该会感到很熟悉,各个按键上面的字母数字都在这,那么怎么让它显示到对应的键盘按键上呢,我们一步一步来说明。
*.png和*.til
一般来说第一张图都是back.png,这也就是此皮肤的默认背景了,要换默认背景的直接替换这张图就行了,最好是要长宽像素和原图一样,不一样的就话需要修改同名的til文件了,按照自己的图片的大小修改下面的img1中的SOURCE_RECT。
另外特殊点的就是bt.png和hint.png,前者一般用来定义按键的背景以及按下效果之类的,后者一般为气泡图片(后面图中红框中的那个就是气泡),当然这些都是随便定义的,名字没有实际意义,只要按照后面说的方法对应起来就可以了,在本节最后有个对应图,按照那个对应起来就可以了,官方这样命名应该只是方便辨认而已。
文件夹中每个png图片都对应了一个后缀为til的文件,这个文件就是用来定义切片的,包括了切片的位置、大小以及缩放情况等,可以直接用记事本打开til文件。
下面的图是我的皮肤中back.til里的内容,对应back.png。中括号代表要开始某一段代码,til文件第一段代码都是GLOBAL,这代表啥意思我也不知道,反正不用管它。
USE_ALPHA:是否用到了alpha混合,这玩意啥用不知道,貌似一般都是一,改到现在也没用到过这个,官方解释:img.ini中需要,0:不透,1:半透,2:全透。
TILE_NUM:切片数量,意思就是对应的图片中有几个切片,也就是该til文件中除了GLOBAL有多少段代码,比如第一张图中除了GLOBAL段外只有一个IMG1那么TILE_NUM=1。不过这个定义的貌似没啥用,我经常多写少写也没啥关系,尽量对应你的切片数量就好。
写完一段空一行,方便查看。
第二段IMG1代表切片一,从这里到下个IMG之间都是定义这个切片的。
SOURCE_RECT:切片在对应图片中所处的位置,四个数字分别代表X,Y,宽,高,具体意思可以看图。即SOURCE_RECT=X,Y,宽,高。
红框中的部分为一个切片,它的左上角顶点距图片左边线的长度就是X,距上边线的长度就是Y,切片的宽和高很好理解吧。至于具体数值需要用软件查看了,我用win7的画图工具放大后用标尺的数字看的,其他方法还不知道,百度一下呗。
INNER_RECT:这个定义的是切片中各部位的数值,一个切片可以分为九部分,这一行的四个数值的意思可以看图,还是用上面那个切片,四个数值分别代表了切片左上角部分的宽和高以及中间部分的宽和高,通过这四个数值确定了切片的九个部分,当需要将切片缩小或放大时,九个部分里四个角上的部分是不会变的,缩放的部分是图中标出的五个部分,1和5是
左右缩放,2和4是上下缩放,而3则是上下左右都缩放。缩放这个在按键什么的地方需要用到,我的皮肤背景也用到了。
SCALE:这里的五个数字依次代表上图中12345部分的拉伸情况,数值1代表拉伸,0代表平铺。配合上面INNER_RECT代码使用。
INNER_RECT和SCALE两行代码是定义缩放情况的,如果不需要缩放的话就可以去掉,就像下图这段定义按键上面显示的内容,不需要缩放就只有SOURCE_RECT这一行代码了。
default.css
png图片和til文件基本上就是这样了,只要确定切片的位置和大小基本就差不多了,然后是最重要的default.css文件了,这也是做皮肤最麻烦的一个地方的,当然修改的话还是不难的,弄懂它修改皮肤基本上不愁了。
图中是在default.css里取了第一段和其他几段各有特的代码,一段一段描述,其他都是类似的,懂了这几段就差不多了,就是制作时花点时间而已。
第一段代码还是GLOBAL,STYLE_NUM定义了本文件包含的STYLE的数量,一般来说数量很大的,这个数量感觉还是做样子的,我一直乱写的。
STYLE*代表某种样式,界面配置文件引用切片或者字体样式时需要通过数字来确定。
NM_IMG:正常状态时的样式,也就是刚出现输入法界面时显示的样式。
HL_IMG:高亮状态时的样式,也就是按下某个按键时的显示的样式。
拿STYLE1举例,NM_IMG=py9,1代表这个样式的正常状态效果为py9.til文件里img1所指定的切片,HL_IMG=py9,21代表这个样式的高亮状态效果为py9.til文件里img21所指定的切片。这么说还是有点迷糊的话下面这个对应图应该可以解释了。
STYLE21和STYLE116也差不多,STYLE116是背景的样式,不需要高亮状态,所以只定义了正常状态时的样式。
STYLE127这段代码有很多行,这是定义字体样式的,具体引用过程讲界面配置文件时再提。
FONT_SIZE:字体大小,有的需要修改候选字大小的,就要到对应的STYLE,然后再修改这个的值。
FONT_WEIGHT:字体宽度,基本没改过。
FONT_CLEARTYPE:是否启用字体平滑,一般都启用的,1为开启,0为关闭。
NM_COLOR:正常状态下字体颜,FFFFFF为白,000000为黑,其他的百度吧,这个和上面的NM_IMG性质是一样的。
HL_COLOR:高亮状态下字体颜,这个和HL_IMG类似。
有些STYLE只有里面的部分代码,应该就是默认,没有仔细研究过,因为一般就改改字体大
小FONT_SIZE和NM_COLOR、HL_COLOR这几项。
官方文件里还有字体名称和边框等,一般用不到,需要的话自己去看看吧。
在port、land文件夹里的文件打开后只要出现*_STYLE,那么调用的就是这个文件里面的STYLE,*_STYLE=n,就代表调用的是STYLEn。
这要讲的就差不多这些,主要是STYLE数目太多,从头制作的话很麻烦。
讲完res文件夹就只剩界面配置文件了,这里偷懒就只介绍port文件夹了,因为land文件夹里的文件与port里的一样,只是按键分布情况有所不同,其他都类似。cnd、pop文件都用记事本打开就可以了。这个感觉看官方教程就行了,我这个只是注释了一下,添加了部分图片,更直观一点。
img文件如何打开这是官方皮肤的port文件夹里的所有文件,bak后缀的文件就是同名ini文件的备份,貌似没啥用,不管它,自己制作时也不用这个的。
bh.ini:笔画界面的配置文件;
cand0d:导航栏0的配置文件;
cand1d:导航栏1的配置文件;
cand2d:导航栏2的配置文件;(这三个其实大同小异,就看各界面调用情况了,我是感觉都用一样的更方便)
def_9.ini:五笔九键的配置文件;
def_26.ini:五笔全键的配置文件;
en_9.ini:英文九键小写的配置文件;
en_9s.ini:英文九键大写的配置文件;
en_26.ini:英文全键小写的配置文件;
en_26s.ini:英文全键大写的配置文件;
gen.ini:这个是全局的配置文件,下面会详解;
hint1.pop:气泡的配置文件;
hw_full.ini:全屏手写的配置文件;
hw_grid.ini:半屏手写的配置文件;
num_9.ini:数字九键的配置文件;
num_26.ini:数字全键的配置文件,这个是从中文全键界面切换入数字界面时的界面;
num_26_1.ini:数字全键的配置文件,这个是从英文全键界面切换入数字界面时的界面;
py_9.ini:拼音九键的配置文件;
py_26.ini:拼音全键的配置文件;
sel_ch.ini:拼音九键的选词界面的配置文件;
sel_ch_26.ini:拼音全键的选词界面的配置文件;
sel_en.ini:英文九键的选词界面的配置文件;
sel_en_26.ini:英文全键的选词界面的配置文件;
sel_hw.ini:手写的选词界面的配置文件;
symbol.ini:非手写的符号界面的配置文件;
symbol_hw.ini:手写的符号界面的配置文件。
*d
先看几个特别一点的文件吧,显示三个cnd文件,这是导航栏配置文件,官方的就是有切换输入方式的那条,打拼音后会被拼音候选取代。图中红框中的那部分。
以cand1来举例,打开后就是这样的,这里只截取了部分,太长了。
TAB:还没研究过,官方的皮肤文档里也划掉了,不晓得啥意思,参考官方文档看看吧。
CAND:定义导航栏外观的。
BACK_STYLE:导航栏的背景样式,调用res文件夹的default.css里的STYLE,比如上面是117,则这里的背景就是STYLE117定义的样式。
FORE_STYLE:导航栏的前景样式,这里指的是显示在导航栏里的拼音候选的字体样式,也就是上上个图中的“我 有w x 用 位 要”的字体样式。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论