相对布局
<p>相对布局CRelativeLayout，继承于CLayout，支持CLayout的所有属性和方法。</p>
<p>确定相对布局子视图的左右坐标有以下两种方法：</p>
<ul>
<li>设置视图宽度、视图左边坐标、视图右边坐标三个中任意两个</li>
<li>设置视图宽度和视图中心到父视图中心水平方向的距离</li>
</ul>
<p>确定相对布局子视图的上下坐标也有以下两种方法：</p>
<ul>
<li>设置视图高度、视图上边坐标、视图下边坐标三个中任意两个</li>
<li>设置视图高度和视图中心到父视图中心垂直方向的距离</li>
</ul>
<h2>相关属性和方法</h2>
<h3>设置视图右边距兄弟视图左边的距离</h3>
<ul>
<li>通过XML属性控制如下：</li>
</ul>
<pre><code class="language-xml">ToLeftOf="1001,10"</code></pre>
<ul>
<li>通过C++程序代码调用方法控制如下：</li>
</ul>
<pre><code class="language-c">virtual void SetLayoutToLeftOf(LONG nId, LONG nOffset);</code></pre>
<h3>设置视图下边距兄弟视图上边的距离</h3>
<ul>
<li>通过XML属性控制如下：</li>
</ul>
<pre><code class="language-xml">ToTopOf="1001,10"</code></pre>
<ul>
<li>通过C++程序代码调用方法控制如下：</li>
</ul>
<pre><code class="language-c">virtual void SetLayoutToTopOf(LONG nId, LONG nOffset);</code></pre>
<h3>设置视图左边距兄弟视图右边的距离</h3>
<ul>
<li>通过XML属性控制如下：</li>
</ul>
<pre><code class="language-xml">ToRightOf="1001,10"</code></pre>
<ul>
<li>通过C++程序代码调用方法控制如下：</li>
</ul>
<pre><code class="language-c">virtual void SetLayoutToRightOf(LONG nId, LONG nOffset);</code></pre>
<h3>设置视图上边距兄弟视图下边的距离</h3>
<ul>
<li>通过XML属性控制如下：</li>
</ul>
<pre><code class="language-xml">ToBottomOf="1001,10"</code></pre>
<ul>
<li>通过C++程序代码调用方法控制如下：</li>
</ul>
<pre><code class="language-c">virtual void SetLayoutToBottomOf(LONG nId, LONG nOffset);</code></pre>
<h3>设置视图左边距兄弟视图左边的距离</h3>
<ul>
<li>通过XML属性控制如下：</li>
</ul>
<pre><code class="language-xml">AlignLeftOf="1001,10"</code></pre>
<ul>
<li>通过C++程序代码调用方法控制如下：</li>
</ul>
<pre><code class="language-c">virtual void SetLayoutAlignLeftOf(LONG nId, LONG nOffset);</code></pre>
<h3>设置视图上边距兄弟视图上边的距离</h3>
<ul>
<li>通过XML属性控制如下：</li>
</ul>
<pre><code class="language-xml">AlignTopOf="1001,10"</code></pre>
<ul>
<li>通过C++程序代码调用方法控制如下：</li>
</ul>
<pre><code class="language-c">virtual void SetLayoutAlignTopOf(LONG nId, LONG nOffset);</code></pre>
<h3>设置视图右边距兄弟视图右边的距离</h3>
<ul>
<li>通过XML属性控制如下：</li>
</ul>
<pre><code class="language-xml">AlignRightOf="1001,10"</code></pre>
<ul>
<li>通过C++程序代码调用方法控制如下：</li>
</ul>
<pre><code class="language-c">virtual void SetLayoutAlignRightOf(LONG nId, LONG nOffset);</code></pre>
<h3>设置视图下边距兄弟视图下边的距离</h3>
<ul>
<li>通过XML属性控制如下：</li>
</ul>
<pre><code class="language-xml">AlignBottomOf="1001,10"</code></pre>
<ul>
<li>通过C++程序代码调用方法控制如下：</li>
</ul>
<pre><code class="language-c">virtual void SetLayoutAlignBottomOf(LONG nId, LONG nOffset);</code></pre>
<h3>设置视图左边距父视图左边的距离</h3>
<ul>
<li>通过XML属性控制如下：</li>
</ul>
<pre><code class="language-xml">AlignParentLeft="1001,10"</code></pre>
<ul>
<li>通过C++程序代码调用方法控制如下：</li>
</ul>
<pre><code class="language-c">virtual void SetLayoutAlignParentLeft(LONG nOffset);</code></pre>
<h3>设置视图上边距父视图上边的距离</h3>
<ul>
<li>通过XML属性控制如下：</li>
</ul>
<pre><code class="language-xml">AlignParentTop="1001,10"</code></pre>
<ul>
<li>通过C++程序代码调用方法控制如下：</li>
</ul>
<pre><code class="language-c">virtual void SetLayoutAlignParentTop(LONG nOffset);</code></pre>
<h3>设置视图右边距父视图右边的距离</h3>
<ul>
<li>通过XML属性控制如下：</li>
</ul>
<pre><code class="language-xml">AlignParentRight="1001,10"</code></pre>
<ul>
<li>通过C++程序代码调用方法控制如下：</li>
</ul>
<pre><code class="language-c">virtual void SetLayoutAlignParentRight(LONG nOffset);</code></pre>
<h3>设置视图下边距父视图下边的距离</h3>
<ul>
<li>通过XML属性控制如下：</li>
</ul>
<pre><code class="language-xml">AlignParentBottom="1001,10"</code></pre>
<ul>
<li>通过C++程序代码调用方法控制如下：</li>
</ul>
<pre><code class="language-c">virtual void SetLayoutAlignParentBottom(LONG nOffset);</code></pre>
<h3>设置视图中心与父视图中心水平方向的偏移</h3>
<ul>
<li>通过XML属性控制如下：</li>
</ul>
<pre><code class="language-xml">AlignParentHorzCenter="10"</code></pre>
<ul>
<li>通过C++程序代码调用方法控制如下：</li>
</ul>
<pre><code class="language-c">virtual void SetLayoutAlignParentHorzCenter(LONG nOffset);</code></pre>
<h3>设置视图中心与父视图中心垂直方向的偏移</h3>
<ul>
<li>通过XML属性控制如下：</li>
</ul>
<pre><code class="language-xml">AlignParentVertCenter="10"</code></pre>
<ul>
<li>通过C++程序代码调用方法控制如下：</li>
</ul>
<pre><code class="language-c">virtual void SetLayoutAlignParentVertCenter(LONG nOffset);</code></pre>
<h2>示例</h2>
<h3>定位左上角的九种方法</h3>
<h4>效果图</h4>
<p><img src="http://www.skinui.cn/doc/img/5.0/6/RelativeLayout1.png" alt="定位左上角的九种方法" /></p>
<pre><code class="language-xml">// 条件1 对齐父亲左边
// 条件2 对齐父亲上边，偏移100像素
AlignParentLeft="0" AlignParentTop="100"</code></pre>
<pre><code class="language-xml">// 条件1 对齐父亲左边
// 条件2 位于兄弟（Id="100"）下边，偏移100像素
AlignParentLeft="0" ToBottomOf="100,100"</code></pre>
<pre><code class="language-xml">// 条件1 对齐父亲左边
// 条件2 对齐兄弟（Id="100"）上边，偏移300像素
AlignParentLeft="0" AlignTopOf="100,300"</code></pre>
<pre><code class="language-xml">// 条件1 对齐兄弟（Id="100"）左边
// 条件2 对齐父亲上边，偏移100像素
AlignLeftOf="100,0" AlignParentTop="100"</code></pre>
<pre><code class="language-xml">// 条件1 对齐兄弟（Id="100"）左边
// 条件2 位于兄弟（Id="100"）下边，偏移100像素
AlignLeftOf="100,0" ToBottomOf="100,100"</code></pre>
<pre><code class="language-xml">// 条件1 对齐兄弟（Id="100"）左边
// 条件2 对齐兄弟（Id="100"）上边，偏移300像素
AlignLeftOf="100,0" AlignTopOf="100,300"</code></pre>
<pre><code class="language-xml">// 条件1 位于兄弟（Id="100"）右边
// 条件2 对齐父亲上边，偏移100像素
ToRightOf="100,0" AlignParentTop="100"</code></pre>
<pre><code class="language-xml">// 条件1 位于兄弟（Id="100"）右边
// 条件2 位于兄弟（Id="100"）下边，偏移100像素
ToRightOf="100,0" ToBottomOf="100,100"</code></pre>
<pre><code class="language-xml">// 条件1 位于兄弟（Id="100"）右边
// 条件2 对齐兄弟（Id="100"）上边，偏移300像素
ToRightOf="100,0" AlignTopOf="100,300"</code></pre>
<h3>定位右上角的九种方法</h3>
<h4>效果图</h4>
<p><img src="http://www.skinui.cn/doc/img/5.0/6/RelativeLayout2.png" alt="定位右上角的九种方法" /></p>
<pre><code class="language-xml">// 条件1 对齐父亲右边
// 条件2 对齐父亲上边，偏移100像素
AlignParentRight="0" AlignParentTop="100"</code></pre>
<pre><code class="language-xml">// 条件1 对齐父亲右边
// 条件2 位于兄弟（Id="100"）下边，偏移100像素
AlignParentRight="0" ToBottomOf="100,100"</code></pre>
<pre><code class="language-xml">// 条件1 对齐父亲右边
// 条件2 对齐兄弟（Id="100"）上边，偏移300像素
AlignParentRight="0" AlignTopOf="100,300"</code></pre>
<pre><code class="language-xml">// 条件1 对于兄弟（Id="100"）右边
// 条件2 对齐父亲上边，偏移100像素
AlignRightOf="100,0" AlignParentTop="100"</code></pre>
<pre><code class="language-xml">// 条件1 对齐兄弟（Id="100"）右边
// 条件2 位于兄弟下边，偏移100像素
AlignRightOf="100,0" ToBottomOf="100,100"</code></pre>
<pre><code class="language-xml">// 条件1 对齐兄弟（Id="100"）右边
// 条件2 对齐兄弟（Id="100"）上边，偏移300像素
AlignRightOf="100,0" AlignTopOf="100,300"</code></pre>
<pre><code class="language-xml">// 条件1 位于兄弟（Id="100"）左边
// 条件2 对齐父亲上边，偏移100像素
ToLeftOf="100,0" AlignParentTop="100"</code></pre>
<pre><code class="language-xml">// 条件1 位于兄弟（Id="100"）左边
// 条件2 位于兄弟（Id="100"）下边，偏移100像素
ToLeftOf="100,0" ToBottomOf="100,100"</code></pre>
<pre><code class="language-xml">// 条件1 位于兄弟（Id="100"）左边
// 条件2 对齐兄弟（Id="100"）上边，偏移300像素
ToLeftOf="100,0" AlignTopOf="100,300"</code></pre>
<h3>定位右下角的九种方法</h3>
<h4>效果图</h4>
<p><img src="http://www.skinui.cn/doc/img/5.0/6/RelativeLayout3.png" alt="定位右下角的九种方法" /></p>
<pre><code class="language-xml">// 条件1 对齐父亲右边
// 条件2 对齐父亲下边
AlignParentRight="0" AlignParentBottom="0"</code></pre>
<pre><code class="language-xml">// 条件1 对齐父亲右边
// 条件2 位于兄弟（Id="100"）上边，偏移-200像素
AlignParentRight="0" ToTopOf="100,-200"</code></pre>
<pre><code class="language-xml">// 条件1 对齐父亲右边
// 条件2 对齐兄弟（Id="100"）下边，偏移200像素
AlignParentRight="0" AlignBottomOf="100,200"</code></pre>
<pre><code class="language-xml">// 条件1 对齐兄弟（Id="100"）右边
// 条件2 对齐父亲下边
AlignRightOf="100,0" AlignParentBottom="0"</code></pre>
<pre><code class="language-xml">// 条件1 对齐兄弟（Id="100"）右边
// 条件2 位于兄弟（Id="100"）上边，偏移-200像素
AlignRightOf="100,0" ToTopOf="100,-200"</code></pre>
<pre><code class="language-xml">// 条件1 对齐兄弟（Id="100"）右边
// 条件2 对齐兄弟（Id="100"）下边，偏移200像素
AlignRightOf="100,0" AlignBottomOf="100,200"</code></pre>
<pre><code class="language-xml">// 条件1 位于兄弟（Id="100"）左边
// 条件2 对齐父亲下边
ToLeftOf="100,0" AlignParentBottom="0"</code></pre>
<pre><code class="language-xml">// 条件1 位于兄弟（Id="100"）左边
// 条件2 位于兄弟（Id="100"）上边，偏移-200像素
ToLeftOf="100,0" ToTopOf="100,-200"</code></pre>
<pre><code class="language-xml">// 条件1 位于兄弟（Id="100"）左边
// 条件2 对齐兄弟（Id="100"）下边，偏移200像素
ToLeftOf="100,0" AlignBottomOf="100,200"</code></pre>
<h3>定位左下角的九种方法</h3>
<h4>效果图</h4>
<p><img src="http://www.skinui.cn/doc/img/5.0/6/RelativeLayout4.png" alt="定位左下角的九种方法" /></p>
<pre><code class="language-xml">// 条件1 对齐父亲左边
// 条件2 对齐父亲下边
AlignParentLeft="0" AlignParentBottom="0"</code></pre>
<pre><code class="language-xml">// 条件1 对齐父亲左边
// 条件2 位于兄弟（Id="100"）上边，偏移-200像素
AlignParentLeft="0" ToTopOf="100,-200"</code></pre>
<pre><code class="language-xml">// 条件1 对齐父亲左边
// 条件2 对齐兄弟（Id="100"）下边，偏移200像素
AlignParentLeft="0" AlignBottomOf="100,200"</code></pre>
<pre><code class="language-xml">// 条件1 位于兄弟（Id="100"）右边
// 条件2 对齐父亲下边
ToRightOf="100,0" AlignParentBottom="0"</code></pre>
<pre><code class="language-xml">// 条件1 位于兄弟（Id="100"）右边
// 条件2 位于兄弟（Id="100"）上边，偏移-200像素
ToRightOf="100,0" ToTopOf="100,-200"</code></pre>
<pre><code class="language-xml">// 条件1 位于兄弟（Id="100"）右边
// 条件2 对齐兄弟（Id="100"）下边，偏移200像素
ToRightOf="100,0" AlignBottomOf="100,200"</code></pre>
<pre><code class="language-xml">// 条件1 对齐兄弟（Id="100"）左边
// 条件2 对齐父亲下边
AlignLeftOf="100,0" AlignParentBottom="0"</code></pre>
<pre><code class="language-xml">// 条件1 对齐兄弟（Id="100"）左边
// 条件2 位于兄弟（Id="100"）上边，偏移-200像素
AlignLeftOf="100,0" ToTopOf="100,-200"</code></pre>
<pre><code class="language-xml">// 条件1 对齐兄弟（Id="100"）左边
// 条件2 对齐兄弟（Id="100"）下边，偏移200像素
AlignLeftOf="100,0" AlignBottomOf="100,200"</code></pre>