2.6 相对布局
<p>SkinRelativeLayout表示相对布局。</p>
<p>相对布局是SkinUI最重要的布局容器,几乎所有的界面布局都可以由相对布局完成。</p>
<p>确定相对布局容器的子组件的水平位置有以下两种方法:</p>
<ul>
<li>给出组件宽度、组件左边坐标、组件右边坐标三个中任意两个</li>
<li>给出组件宽度和组件中心到父组件中心水平方向的距离</li>
</ul>
<p>确定相对布局容器的子组件的垂直位置有以下两种方法:</p>
<ul>
<li>给出组件高度、组件上边坐标、组件下边坐标三个中任意两个</li>
<li>给出组件高度和组件中心到父组件中心垂直方向的距离</li>
</ul>
<p>相对布局容器的子组件位置由其父组件和兄弟组件的位置共同决定,请看下面的示例:</p>
<ul>
<li>
<p>示例一</p>
<pre><code class="language-xml">&lt;CSkinRelativeLayout&gt;
&lt;SkinImageView LayoutWidth=&quot;100&quot; LayoutHeight=&quot;100&quot; AlignParentLeft=&quot;50&quot; AlignParentTop=&quot;50&quot;/&gt;
&lt;/CSkinRelativeLayout&gt;</code></pre>
<p>上面的布局文件给出了以下四个条件:1. 组件的宽度;2. 组件的高度;3. 组件左边到父组件左边的距离;4. 组件上边到父组件上边的距离</p>
</li>
<li>
<p>示例二</p>
<pre><code class="language-xml">&lt;CSkinRelativeLayout&gt;
&lt;SkinImageView LayoutWidth=&quot;100&quot; AlignParentLeft=&quot;50&quot; AlignParentTop=&quot;50&quot; AlignParentBottom=&quot;50&quot;/&gt;
&lt;/CSkinRelativeLayout&gt;</code></pre>
<p>上面的布局文件给出了以下四个条件:</p>
<ol>
<li>给出组件的宽度;</li>
<li>给出组件左边到父组件左边的距离;</li>
<li>组件上边到父组件上边的距离;</li>
<li>组件下边到父组件下边的距离</li>
</ol>
</li>
<li>示例三
<pre><code class="language-xml">&lt;CSkinRelativeLayout&gt;
&lt;SkinImageView AlignParentLeft=&quot;50&quot; AlignParentTop=&quot;50&quot; AlignParentRight=&quot;50&quot; AlignParentBottom=&quot;50&quot;/&gt;
&lt;/CSkinRelativeLayout&gt;</code></pre>
<p>上面的布局文件给出了以下四个条件:</p>
<ol>
<li>给出组件左边到父组件左边的距离;</li>
<li>组件上边到父组件上边的距离;</li>
<li>组件右边到父组件右边的距离;</li>
<li>组件下边到父组件下边的距离</li>
</ol></li>
</ul>
<h2>属性和相关方法</h2>
<h3>1 组件布局宽度</h3>
<p>组件布局宽度可以设置为绝对值,也可以设置为适应内容的宽度,还可以设置为跟父组件同宽。</p>
<h4>1.1 设置组件宽度为绝对值</h4>
<ul>
<li>将组件宽度设为100像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">LayoutWidth=&quot;100&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutWidth(100);</code></pre></li>
</ul>
<h4>1.2 设置组件宽度为适应内容的宽度</h4>
<ul>
<li>将组件宽度设为适应内容的宽度,有以下两种方法:
设置XML属性
<pre><code class="language-xml">LayoutWidth=&quot;WrapContent&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutWidth(WRAP_CONTENT);</code></pre></li>
</ul>
<h4>1.3 设置组件宽度为跟父组件同宽</h4>
<ul>
<li>将组件宽度设为跟父组件同宽,有以下两种方法:
设置XML属性
<pre><code class="language-xml">LayoutWidth=&quot;FillParent&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutWidth(FILL_PARENT);</code></pre></li>
</ul>
<h3>2 组件布局高度</h3>
<p>组件布局高度可以设置为绝对值,也可以设置为适应内容的高度,还可以设置为跟父组件同高。</p>
<h4>2.1 设置组件高度为绝对值</h4>
<ul>
<li>将组件高度设为100像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">LayoutHeight=&quot;100&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutHeight(100);</code></pre></li>
</ul>
<h4>2.2 设置组件宽度为适应内容的高度</h4>
<ul>
<li>将组件高度设为适应内容的高度,有以下两种方法:
设置XML属性
<pre><code class="language-xml">LayoutHeight=&quot;WrapContent&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutHeight(WRAP_CONTENT);</code></pre></li>
</ul>
<h4>2.3 设置组件高度为跟父组件同高</h4>
<ul>
<li>将组件高度设为跟父组件同高,有以下两种方法:
设置XML属性
<pre><code class="language-xml">LayoutHeight=&quot;FillParent&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutHeight(FILL_PARENT);</code></pre></li>
</ul>
<h3>3 组件左边坐标</h3>
<p>设置以下三个条件中任意一个就可以确定组件左边坐标:</p>
<h4>3.1 组件左边到父组件左边的距离</h4>
<ul>
<li>设置组件左边到父组件左边的距离为50像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">AlignParentLeft=&quot;50&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutAlignParentLeft(50);</code></pre></li>
</ul>
<h4>3.2 组件左边到兄弟组件左边的距离</h4>
<ul>
<li>设置组件左边到Id为1001的兄弟组件左边的距离为50像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">AlignLeftOf=&quot;1001,50&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutAlignLeftOf(1001, 50);</code></pre></li>
</ul>
<h4>3.3 组件左边到兄弟组件右边的距离</h4>
<ul>
<li>设置组件左边到Id为1001的兄弟组件右边的距离为50像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">ToRightOf=&quot;1001, 50&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutToRightOf(1001, 50);</code></pre></li>
</ul>
<h3>4 组件上边坐标</h3>
<p>设置以下三个条件中任意一个就可以确定组件上边坐标:</p>
<h4>4.1 组件上边到父组件上边的距离</h4>
<ul>
<li>设置组件上边到父组件上边的距离为50像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">AlignParentTop=&quot;50&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutAlignParentTop(50);</code></pre></li>
</ul>
<h4>4.2 组件上边到兄弟组件上边的距离</h4>
<ul>
<li>设置组件上边到Id为1001的兄弟组件上边的距离为50像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">AlignTopOf=&quot;1001,50&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutAlignTopOf(1001, 50);</code></pre></li>
</ul>
<h4>4.3 组件上边到兄弟组件下边的距离</h4>
<ul>
<li>设置组件上边到Id为1001的兄弟组件下边的距离为50像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">ToBottomOf=&quot;1001, 50&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutToBottomOf(1001, 50);</code></pre></li>
</ul>
<h3>5 组件右边坐标</h3>
<p>设置以下三个条件中任意一个就可以确定组件右边坐标:</p>
<h4>5.1 组件右边到父组件右边的距离</h4>
<ul>
<li>设置组件右边到父组件右边的距离为50像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">AlignParentRight=&quot;50&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutAlignParentRight(50);</code></pre></li>
</ul>
<h4>5.2 组件右边到兄弟组件右边的距离</h4>
<ul>
<li>设置组件右边到Id为1001的兄弟组件右边的距离为50像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">AlignRightOf=&quot;1001,50&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutAlignRightOf(1001, 50);</code></pre></li>
</ul>
<h4>5.3 组件右边到兄弟组件左边的距离</h4>
<ul>
<li>设置组件右边到Id为1001的兄弟组件左边的距离为50像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">ToLeftOf=&quot;1001, 50&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutToLeftOf(1001, 50);</code></pre></li>
</ul>
<h3>6 组件下边坐标</h3>
<p>设置以下三个条件中任意一个就可以确定组件下边坐标:</p>
<h4>6.1 组件下边到父组件下边的距离</h4>
<ul>
<li>设置组件下边到父组件下边的距离为50像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">AlignParentBottom=&quot;50&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutAlignParentBottom(50);</code></pre></li>
</ul>
<h4>6.2 组件下边到兄弟组件下边的距离</h4>
<ul>
<li>设置组件下边到Id为1001的兄弟组件下边的距离为50像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">AlignBottomOf=&quot;1001,50&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutAlignBottomOf(1001, 50);</code></pre></li>
</ul>
<h4>6.3 组件下边到兄弟组件上边的距离</h4>
<ul>
<li>设置组件下边到Id为1001的兄弟组件上边的距离为50像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">ToTopOf=&quot;1001, 50&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutToTopOf(1001, 50);</code></pre></li>
</ul>
<h3>7 组件中心到父组件中心水平方向的距离</h3>
<p>可以设置水平方向组件中心和父组件中心重合,可以在父组件中心左边,也可以在父组件中心右边。</p>
<h4>7.1 水平方向组件中心和父组件中心重合</h4>
<ul>
<li>设置水平方向组件中心和父组件中心重合,有以下两种方法:
设置XML属性
<pre><code class="language-xml">AlignParentHorizontalCenter=&quot;0&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutAlignParentHorizontalCenter(0);</code></pre></li>
</ul>
<h4>7.2 水平方向组件中心在父组件中心左边</h4>
<ul>
<li>设置水平方向组件中心在父组件中心左边10像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">AlignParentHorizontalCenter=&quot;-10&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutAlignParentHorizontalCenter(-10);</code></pre></li>
</ul>
<h4>7.3 水平方向组件中心在父组件中心右边</h4>
<ul>
<li>设置水平方向组件中心在父组件中心右边10像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">AlignParentHorizontalenter=&quot;10&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutAlignParentHorizontalCenter(10);</code></pre></li>
</ul>
<h3>8 组件中心到父组件中心垂直方向的距离</h3>
<p>可以设置垂直方向组件中心和父组件中心重合,可以在父组件中心左边,也可以在父组件中心右边。</p>
<h4>8.1 垂直方向组件中心和父组件中心重合</h4>
<ul>
<li>设置垂直方向组件中心和父组件中心重合,有以下两种方法:
设置XML属性
<pre><code class="language-xml">AlignParentVerticalCenter=&quot;0&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutAlignParentVerticalCenter(0);</code></pre></li>
</ul>
<h4>8.2 垂直方向组件中心在父组件中心左边</h4>
<ul>
<li>设置垂直方向组件中心在父组件中心左边10像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">AlignParentVerticalCenter=&quot;-10&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutAlignParentVerticalCenter(-10);</code></pre></li>
</ul>
<h4>8.3 垂直方向组件中心在父组件中心右边</h4>
<ul>
<li>设置垂直方向组件中心在父组件中心右边10像素,有以下两种方法:
设置XML属性
<pre><code class="language-xml">AlignParentVerticalCenter=&quot;10&quot;</code></pre>
<p>调用C++方法</p>
<pre><code class="language-c">pView-&gt;SetLayoutAlignParentVerticalCenter(10);</code></pre></li>
</ul>
<h2>请看下面的示例</h2>
<h4>效果图</h4>
<p><img src="http://www.skinui.cn/doc/img/2/6/1.png" alt="相对布局" /></p>
<h4>布局文件</h4>
<pre><code class="language-xml">&lt;SkinDialog DefaultWidth=&quot;680&quot; DefaultHeight=&quot;840&quot; SysButton=&quot;CLOSE&quot; Icon=&quot;128&quot; Caption=&quot;IDS_LAYOUT_SHOW6&quot; Animation=&quot;SizeChange&quot;&gt;
&lt;SkinRelativeLayout Layout=&quot;SeparatorLine.xml&quot; ChildText1=&quot;相对父视图&quot; LayoutHeight=&quot;30&quot; AlignParentLeft=&quot;10&quot; AlignParentTop=&quot;30&quot; AlignParentRight=&quot;10&quot;/&gt;
&lt;SkinRelativeLayout AlignParentLeft=&quot;20&quot; AlignParentTop=&quot;80&quot; AlignParentRight=&quot;20&quot; LayoutHeight=&quot;340&quot;&gt;
&lt;SkinRelativeLayout AlignParentLeft=&quot;0&quot; AlignParentTop=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='AlignParentLeft=&quot;0&quot; AlignParentTop=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout AlignParentRight=&quot;0&quot; AlignParentBottom=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='AlignParentRight=&quot;0&quot; AlignParentBottom=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout AlignParentLeft=&quot;0&quot; AlignParentBottom=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='AlignParentLeft=&quot;0&quot; AlignParentBottom=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout AlignParentRight=&quot;0&quot; AlignParentTop=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='AlignParentRight=&quot;0&quot; AlignParentTop=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout AlignParentLeft=&quot;0&quot; AlignParentVerticalCenter=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='AlignParentLeft=&quot;0&quot; AlignParentVerticalCenter=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout AlignParentRight=&quot;0&quot; AlignParentVerticalCenter=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='AlignParentRight=&quot;0&quot; AlignParentVerticalCenter=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout AlignParentTop=&quot;0&quot; AlignParentHorizontalCenter=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='AlignParentTop=&quot;0&quot; AlignParentHorizontalCenter=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout AlignParentBottom=&quot;0&quot; AlignParentHorizontalCenter=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='AlignParentBottom=&quot;0&quot; AlignParentHorizontalCenter=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout AlignParentHorizontalCenter=&quot;0&quot; AlignParentVerticalCenter=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='AlignParentHorizontalCenter=&quot;0&quot; AlignParentVerticalCenter=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout Layout=&quot;SeparatorLine.xml&quot; ChildText1=&quot;相对兄弟视图&quot; LayoutHeight=&quot;30&quot; AlignParentLeft=&quot;10&quot; AlignParentTop=&quot;440&quot; AlignParentRight=&quot;10&quot;/&gt;
&lt;SkinRelativeLayout AlignParentLeft=&quot;20&quot; AlignParentBottom=&quot;20&quot; AlignParentRight=&quot;20&quot; LayoutHeight=&quot;340&quot;&gt;
&lt;SkinRelativeLayout Id=&quot;100000&quot; AlignParentHorizontalCenter=&quot;0&quot; AlignParentVerticalCenter=&quot;0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='Id=&quot;100000&quot; 我是参照物' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout ToLeftOf=&quot;100000,20&quot; ToTopOf=&quot;100000,20&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='ToLeftOf=&quot;100000,20&quot; ToTopOf=&quot;100000,20&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout ToLeftOf=&quot;100000,20&quot; AlignTopOf=&quot;100000,0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='ToLeftOf=&quot;100000,20&quot; AlignTopOf=&quot;100000,0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout ToLeftOf=&quot;100000,20&quot; ToBottomOf=&quot;100000,20&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='ToLeftOf=&quot;100000,20&quot; ToBottomOf=&quot;100000,20&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout ToRightOf=&quot;100000,20&quot; ToTopOf=&quot;100000,20&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='ToRightOf=&quot;100000,20&quot; ToTopOf=&quot;100000,20&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout ToRightOf=&quot;100000,20&quot; AlignTopOf=&quot;100000,0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='ToRightOf=&quot;100000,20&quot; AlignTopOf=&quot;100000,0&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout ToRightOf=&quot;100000,20&quot; ToBottomOf=&quot;100000,20&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='ToRightOf=&quot;100000,20&quot; ToBottomOf=&quot;100000,20&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout AlignLeftOf=&quot;100000,0&quot; ToTopOf=&quot;100000,20&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='AlignLeftOf=&quot;100000,0&quot; ToTopOf=&quot;100000,20&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;SkinRelativeLayout AlignLeftOf=&quot;100000,0&quot; ToBottomOf=&quot;100000,20&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot; BkgColor=&quot;ID_COLOR_RED&quot;&gt;
&lt;SkinTextView Text='AlignLeftOf=&quot;100000,0&quot; ToBottomOf=&quot;100000,20&quot; LayoutWidth=&quot;200&quot; LayoutHeight=&quot;100&quot;' LayoutWidth=&quot;FillParent&quot; LayoutHeight=&quot;FillParent&quot; HorzAlignment=&quot;Center&quot; VertAlignment=&quot;Center&quot; FontColor=&quot;ID_COLOR_WHITE&quot; MultiLine=&quot;true&quot;/&gt;
&lt;/SkinRelativeLayout&gt;
&lt;/SkinRelativeLayout&gt;
&lt;/SkinDialog&gt;</code></pre>