使用XML配置页面

嵌套关系

     XML现在可以支持嵌套。嵌套后得到的节点拥有父子关系，即和代码中的addChild()效果是一样的。

<node name="background" type="CCSprite">     <src img="common_bg.png"/>          <anchor x=0.5 y=0.5 />          <pos x=640.0 y=360.0/>          <node name="coin" type="CCSprite">               <src img="coin.png"/>               <anchor x=0.0 y=0.0 />               <pos x=10.0 y=10.0/>          </node>     </node></node>

     在上面的例子中，coin被添加为background的子节点。此时coin的position是相对于父节点的位置。以上面的配置来看，coin的锚点是左下角，而位置为ccp(10.0, 10.0)，配置的结果便是coin的左下角位于background内部(10.0, 10.0)的位置。

     按钮同样可以嵌套。在实际开发中，经常遇到按钮的背景是通用的，需要为每个按钮单独添加一个Label。现在可以这样:

<node name="action_menu" type="CCMenu">     <!--不叫 -->     <node name="action_call_0" type="CCMenuItemSprite">          <src img="cmn_btn_y.png" />          <anchor x=0.5 y=0.0 />          <pos x=820.0 y=0.0 />          <!— 嵌套的文字，被加入到"action_call_0"中 -->          <node name="label_call_0" type="CCLabelTTF">               <text str="不叫" />               <font name="ArialMT" size=24 smallSize=30/>               <pos xRatio=0.5 yRatio=0.5/>          </node>     </node></node>

     在上面的例子中，按钮的normalImage只是一张通用的图片，在按钮节点的内部又添加了CCLabelTTF节点，相当于button->addChild(label)。注意Label设置的pos属性使用了xRatio、yRatio字段，表示其位置在父节点中的位置（详见《位置（Position）》章节），此例均为0.5，表示位置居按钮图片中间。

属性设置

     属性的设置方式基本类似。在现行的XML配置中，有的属性（如颜色）提供了不止一种设置方法，有的属性（如位置）需要更多的配置项以适用不同分辨率的需要。现整理如下：

•      颜色（RGBA）     

 <property color="orange" opacity=255 />  <color color="black" />  <color r=255 g=255 b=255 a=255/> 
     以上三种方式均可设置颜色，property可设置多次，但color只会检测一次。
     每个设置项均为选配，推荐任何情况下只使用一种设置方式。

•      位置（Position）

 <pos x=100 y=100 /> 绝对定位，数值除以XScaleFactor 或 YScaleFactor。 <pos xInner=100 yInner=100 /> 相对定位，数值除以MaxScaleFactor。 <pos xRatio=0.5 yRatio=0.5 /> 相对定位，数值表示在父节点的contentSize内的位置。 

    

     定位有三种方式。

     第一种 x & y，用于绝对定位，也可认为是相对屏幕的定位，效果相当于x、y数值分别除以XScaleFactor和YScaleFactor。
     第二种 xInner & yInner，用于相对定位，效果相当于数值除以MaxScaleFactor。大部分情况下适用于小元素相对某个背景的定位。
     第三种 xRatio & yRatio，用于相对定位。这两个值考虑了父节点的大小（contentSize），效果相当于数值分别乘以父节点的宽高。

     需要注意：
     1.  xRatio & yRatio配合嵌套、锚点的使用可以很方便的定位元素（如标题在背景上的位置）；

     2.  每个节点可以设置多个<pos /> ，前后设置的效果可以叠加，例如： 

<node name="man_win_nm" type="CCSprite">     <src img="win_nm.png"/>     <anchor x=0.5 y=0.0 />     <pos xRatio=0.5 />     <pos xInner=300.0 yInner=140.0 /></node>

         上面的代码中，CCSprite初始化时的默认坐标为(0, 0)，解析第一个<pos xRatio=0.5 />，将横坐标设置为父节点大小的一半，即水平居中。然后解析第二个<pos xInner=300.0 yInner=140.0 />，在当前坐标的基础上，横坐标增加了 300.0/MaxScaleFactor，纵坐标增加了140.0/MaxScaleFactor；

     3.  横纵坐标的设置项是独立的，即可以在一个<pos>标签中可同时设置一个xRatio和一个yInner，但不建议一个标签内设置多个相同坐标项。像这样：

<pos xRatio=0.5 xInner=300.0 />

不建议这样使用，会造成不可知的结果。

• 其他属性

 <anchor x=0.5 y=0.5 />  设置锚点（Anchor） <property rotation=90 />  设置旋转（Rotation） <scale scale=1.2 />
 <scale x=1.2 y=1.5 /> 设置缩放（Scale）建议同一节点不要同时使用两种设置 <property visible="false" />设置visible属性"true" or "false" <property zOrder=1 />设置显示zOrder <src img="test.png" />设置CCSprite、TyNetSprite、CCScale9Sprite以及CCMenuItemSprite的默认图片

• 文字（CCLabelTTF & CCLabelBMFont）

 <text str=""/> 设置文字 <font name="ArialMT" size=24 smallSize=30/> CCLabelTTF设置字体以及字号（小屏字号） <font name="Digital-Yellow-44.fnt"       smallname="Digital-Yellow-30.fnt" />CCLabelBMFont设置字体及小屏字体（不能选择字号）

• 9宫格图（Scale9Sprite）

 <insetRect x=90 y=90 w=50 h=50 />设置Scale9Sprite资源的insetRect <size w=900 h=540 />设置Scale9Sprite拉伸后的大小w & h均除以MaxScaleFactor

• 按钮（CCMenuItemSprite）

 <property enable="false" tag=1  />设置按钮的使用状态，以及tag值。 <property callback="" />只针对GamePopLayerCenter内的按钮，主要用于配置按钮回调（类js字符串）。  <src normal="" selected="" disable="" />配置按钮各个状态的图片注意不要和<src img=“” />混合使用。

• 网络精灵（TyNetSprite）

 <src url="" />设置TyNetSprite下载的图片，下载完成前会显示img配置的本地图片。
最后需要注意的一些细节

     当需要配置多个<property/>时，可以将多个配置项写在一个里，例如：

<property  visible="false" enable="false" tag=2 />

     当然，也可以写多个<property/>。
     然而除<property/>之外，其他的配置项如<src />, <pos />, <anchor />等则只能存在一个。