XBMC皮肤开发入门篇

 源地址http://bbs.htpc1.com/thread-80239-1-1.html

 

目录 1. 简介 2. 剖析皮肤 3. 皮肤主题 4. 颜色主题 5. 字体 6. 包含文件 7. 窗口XML文件 8. 控件 9 可见条件 10 皮肤动态效果

XBMC具有非常灵活和强大的图形用户界面系统，使得制作主题皮肤和个人定制都十分便利。用户可以创建自己的个性化皮肤（或修改现有的皮肤）并与他人共享。 目前官方的默认皮肤是“Confluence”。

简介

XBMC包括一个全新编写的图形用户界面支持库。这个库使你可以随意定制XBMC的显示界面，如图片、控件的大小和位置，颜色、字体和文本，可以改变界面导航特性，甚至添加新的功能。这个皮肤系统相当复杂，在此，我们对它的工作机制做一个深入浅出的介绍，希望对有意制作XBMC皮肤的朋友有所帮助。

目前XBMC的默认皮肤是“Confluence”，这个皮肤是Jezz_X制作的，并随XBMC不断更新。如果你想让XBMC读取你自己制作或下载的其他皮肤，想在用户界面设置菜单选用它，则必须把你的皮肤文件存放到XBMC/Skin子目录中。新版本的XBMC只支持皮肤版本高于2.1.0，低于2.1版本的皮肤不能使用。

剖析皮肤

系统默认的 “Confluence” 皮肤是你学习皮肤制作的很好的范例，它包含了新版XBMC提供的很多新功能。如果你想制作自己的皮肤，可以先把“Confluence” 皮肤目录中的所有内容拷贝到一个新的目录中，比如XBMC/Skin/MySkin目录。然后你可以根据自己的要求编辑修改皮肤中的每个文件，这样你就能很快地熟悉XBMC的皮肤系统。

每个皮肤目录中都必须包含一上skin.xml文件，下面是皮肤的基本目录结构：

MySkin/skin.xml
XBMC从这个文件中获取如何找到皮肤中用到的其他文件的信息。这个文件还包含开发人员信息和版本信息。
MySkin/font
这个子目录包含皮肤中用到的所有字体文件，在这里，你可以增加或者替换字体。
MySkin/media
这个子目录包含所有的媒体文件（.png/.gif/.jpg...）
MySkin/sounds
这个子目录包含所有的声音文件（sounds.xml/.wav...）
MySkin/colors
这个子目录包含定义皮肤中使用的颜色的xml文件，可以在这里定义不同的颜色主题。
MySkin/PAL
与显示分辨率相关的目录。

很多皮肤还包含下面这些子目录：

MySkin/PAL16x9
与显示分辨率相关的目录。
MySkin/NTSC
与显示分辨率相关的目录。
MySkin/NTSC16x9
与显示分辨率相关的目录。
MySkin/720p
与显示分辨率相关的目录。
MySkin/1080i
与显示分辨率相关的目录。

XBMC可以运行于不同的显示分辨率，可能在不同分辨率下用到不同的文件（这是因为对于720x480的NTSC分辨率和1920x1080的1080i分辨率来说，在显示上还是有很大不同的）。 我们另文介绍XBMC是按什么优先顺序来读取不同分辨率皮肤文件的。

有的皮肤还使用一些特殊的子目录来保存要用到的附加组件，例如：

MySkin/extras
通常用来保存皮肤中使用的特殊组件或功能文件（如脚本程序）
MySkin/docs
通常用来保存文档资料（如readme、changelog等）

总之，目的是使你的皮肤目录结构清晰易读，易于维护和查找错误。如果是一个开发小组来制作皮肤，你就会发现这是非常重要的。

皮肤主题

一个皮肤中用到的所有基本的媒体文件都应该压缩到Textures.xbt文件中，并存放到media/目录。你可以用TexturePacker工具来完成这个工作。默认皮肤主题使用的所有图片文件都应该在Textures.xbt文件中。

此外，media/目录中还可以有其他.xbt文件，每个文件对应不同的皮肤主题。例如，你可以把皮肤的主要纹理贴图文件色调做成红色的，然后创建一个新的主题媒体文件压缩包Red.xbt。－这使得一个皮肤能选择更多的显示效果。要记住变更皮肤主题只是使用了不同的纹理贴图文件－皮肤的显示布局不变。用户选定一个皮肤主题后，当某个控件需要用到纹理贴图时，XBMC会先到<主题名称>.xpr文件中去找。如果<主题名称>.xpr中没有这个图片文件，它会自动退回到Textures.xpr文件中读取。也就是说皮肤主题的.xbt文件中只需要包含修改过的纹理贴图文件－所有其他纹理贴图可以使用Textures.xbt。

当用户选定一个皮肤主题时，XBMC同时会自动设置到使用这个皮肤主题的默认颜色集，也就是colors/目录中的<主题名称>.xml文件定义的颜色。详见后文　。

建议用下面的方法建立皮肤主题：
1. 在保存默认纹理贴图文件的目录运行TexturePacker.exe生成Textures.xbt。
2. 确定制作新皮肤主题时要修改的纹理贴图并把它们拷到一个单独目录中。
3. 在正常的皮肤工作区之外为每个皮肤主题建立单独的目录，然后把针对这些主题修改过的纹理贴图存到里面。
4. 在步骤3建立的每个皮肤主题目录上运行TexturePacker.exe来生成皮肤主题的.xpr文件（注意：你可以使用-output参数指定适当的文件名）。
5. 把Textures.xbt和每个皮肤主题的.xbt文件都存放到你的皮肤的media/目录中，XBMC就能自动找到它们了。

颜色主题

皮肤的不同颜色主题由colors/目录中的xml文件定义。这使皮肤开发人员可以在编写皮肤代码时使用事先定义好的颜色英文名称（好过使用16进制颜色码），同时也可以支持不同的颜色主题。

每个颜色主题有一个单独的.xml文件，默认颜色主题由default.xml定义－其它颜色主题中没有定义的颜色XBMC也会到这个文件中查找。

颜色主题.xml文件结构如下（注意，十六进制数是ARGB格式颜色码）：

1. <colors>
   
2.   <color name="white">ffffffff</color>
   
3.   <color name="grey">7fffffff</color>
   
4.   <color name="green">ff00ff7f</color>
   
5. </colors>

复制代码

现在你可以在皮肤文件中以<textcolor>white</textcolor>这样的形式来指定所使用的颜色了。这也使你只要在colors/目录中编写一个新的.xml文件就能改变整个皮肤的颜色了。

字体

XBMC的皮肤中可以自定义用户界面中显示的字体，这个问题说来话长，有时间在后面的贴子中再细说了。

包含文件

另一个特殊的（甚至可说是最重要的）皮肤文件是includes.xml。这个文件正如其名，是定义皮肤中控件的默认外观、大小、位置的地方，它使你在窗口xml文件中不用反复复制不同控件中用到的相同属性设置。例如，你可以设置一个按钮控件的大小和使用的纹理贴图，这样你在其他皮肤文件中就不用重复设置这些详细信息了，除非你在某个特定的窗口中有特殊要求而需要更改默认的外观或大小。

这是非常有用的，因为它大大减少了皮肤开发的工作量。此外，使用包含文件意味着只要在不同显示分辨率的包含文件中调整参数就能很方便地支持不同分辨率了。

其实在2.1版的皮肤引擎支持下，你可以有一个以上的包含文件－您可以指定文件属性来使用不同的包含文件，这使你可以让不同的包含文件专注于一组特定的属性。

包含文件的文件结构如下所示。

1.   <includes>
   
2.     <include name="whitetext">
   
3.       <textcolor>ffffffff</textcolor>
   
4.     </include>
   
5.     <include file="listdefaults.xml" />
   
6.     <default type="button">
   
7.       <include>whitetext</include>
   
8.     </default>
   
9.     <constant name="leftedge">50</constant>
   
10.   </includes>

复制代码

从上面的中可以看到，有4个不同类型的包含。第一个<Include>标签定义的内容会在这个包含名称被引用时插入到引用位置。例如，如果在一个窗口的.xml文件中这样写：

1.   <control type="togglebutton">
   
2.     <include>whitetext</include>
   
3.     ... other tags go here
   
4.   </control>

复制代码

包含标签中定义的<textcolor>标签就会被插入到引用位置。你可以使用多个包含的引用，同时一个包含定义中可以有很多标签内容－甚至可以是一个完整的控件定义或控件组定义。

例子中第二个<include>标签演示如何引用不同文件中的内容。由于没有指定包含名称，这将把整个文件内容插入到引用位置。

<default>标签类似于包含，不同的是它的内容会被定义的控件类型的所有控件所引用－即使你在相关控件中没有显示的引用包含。在上面的例子中每一个按钮控件都会引用whitetext包含。当然，你可以通过在按钮控件中定义<textcolor>来覆盖这个默认定义。

最后，使用<constant>标签可以定义数值常量（浮点数），这样就可以使用常量名称而不是直接使用数值（<posx>, height="" 等）。这利于使用统一的位置值，也方便调整这些数值，不用每个地方去改了。

窗口XML文件

其他xml文件每一个定义皮肤中的一个窗口。它们都有相同的基础结构，让你能在窗口上放置不同的控件，并定义导航操作的方式。

你可以在XBMC知识库中Window IDs页面找到所有窗口.xml文件的列表以及它们对应的界面窗口。

每个窗口都有一个唯一的标识码（id）。这个标识码是很重要的，XBMC用它来识别你的代码到底定义的是哪个窗口。此外，每个窗口中的许多控件同样应该有一个唯一的标识码，除非他们只是用于固定内容的图片或标签，XBMC不需要对它做什么操作因而不需要识别它。窗口id在窗口列表中列出。

窗口.xml文件的结构参见XBMC知识库中Window Structure页面。

控件

控件是皮肤开发的主要内容，它定义几乎所有东西，从按钮到文本标签等。XBMC知识库中Controls页面详细介绍每一个控件。

可见条件

XBMC皮肤引擎的强大之处就在于，皮肤开发者可以使用多种多样的条件语句来显示和隐藏皮肤的某一部分，由此能设计出非常用户友好的界面。关于可用的变量以及使用方法的进一步介绍参见XBMC知识库中Conditional Visibility页面。

皮肤动态效果

XBMC皮肤引擎支持所有控件的动态效果，如旋转、滑动、淡入淡出或任意组合。用条件语句组合动态效果会令你的皮肤有出众的效果。更进一步的资料请参阅XBMC知识库中Animating Your Skin页面。