如何设计一个软件的皮肤配置文件雏形
PC客户端软件的皮肤配置方式有很多种，简单说来就是如何把图片在屏幕上贴起来，从需求上看，可能要应对多套皮肤、多种配色、异型皮肤等等。有的软件选择将所有小图片放在一张大图上，有的软件喜欢用各种小图放在一个目录下，还有的采用了混搭的方式，这里讲的是第一种。
先放出一张结构图来，方便理解（点击查看大图）：
theme处于最顶层，同一个皮肤下可以有多个style，一个style下可以有多个layout和color_schemes（实际上限制每个style只有一个layout跟color_schemes更好理解）。
layout的子节点就很清楚了，通常软件会有很多个窗体，其中有一个是主窗体，其他是附加窗体；每一个窗体里会有不同的组件，比如一个播放器窗体里可能会有滚动条组件、列表组件、按钮组件；每个组件为了美观，可以被划分为若干个碎片，比如滚动条的控制柄或是滚动条的顶部花纹等等，当一个组件为按钮的时候，碎片就要表现按钮的多种状态，如鼠标按下、弹起、悬停、按钮不可用，
图片的定位采用了选择起始坐标+长宽的方式，也就是image_x,image_y设定某个按钮贴图的左上角坐标，通过计算长宽来确定整个贴图的区域。
简单写一个配置文件如下：
<?xml version="1.0" encoding="utf-8"?>
<theme name="default">
<style name="red" transcolor="#ff00ff">
<!-- layout-->
<layout>
<windows name="main_windows" image="backgroud.bmp" backgroudcolor="#fffff" width="200" height="200" image_x="200" image_y="200" tips="主窗体">
<module name="scrollbar" image="scrollbar.bmp" image_x="15" image_y="20" width="200" height="200" type="scrollbar" tips="滚动条">
<fragment name="scrollbar_top" tips="滚动条顶部">
<area state="1" name="normal" image_x="0" image_y="0" width="9" height="12" />
<area state="2" name="hot" image_x="9" image_y="0" width="9" height="12" />
<area state="3" name="pressed" image_x="18" image_y="0" width="9" height="12" />
<area state="4" name="disable" image_x="27" image_y="0" width="9" height="12" />
</fragment>
</module>
</windows>
</layout>
<color_schemes>
<class name="media_list_view">
<color name="focus_text_color" value="#FFFFFF" />
<color name="focus_text_backgroud_color" value="#FFFFFF" />
<color name="normal_text_color" value="#FFFFFF" />
<color name="hilight_text_color" value="#FFFFFF" />
</class>
<class name="lrc_view"></class>
</color_schemes>
</style>
</theme>