?<!--Mock<link rel="stylesheet" type="text/css" href="http://localhost/ext/resources/css/ext-all.css" /><link rel="stylesheet" type="text/css" href="http://localhost/ext/doc/resources/docs.css"/><link rel="stylesheet" type="text/css" href="http://localhost/ext/doc/resources/style.css"/>--><style type="text/css">    body {        overflow: scroll;    }    /**	 .mdesc .long {        display: block;    }     */</style><!-- End Mock--><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><div class="body-wrap">    <div class="top-tools">        <a class="inner-link" href="#Ext.layout.AnchorLayout-props"><img src="/images/s.gif" class="item-icon icon-prop">Properties</a><a class="inner-link" href="#Ext.layout.AnchorLayout-methods"><img src="/images/s.gif" class="item-icon icon-method">Methods</a><a class="inner-link" href="#Ext.layout.AnchorLayout-events"><img src="/images/s.gif" class="item-icon icon-event">Events</a><a class="inner-link" href="#Ext.layout.AnchorLayout-configs"><img src="/images/s.gif" class="item-icon icon-config">Config Options</a><a class="bookmark" href="../docs/?class=Ext.layout.AnchorLayout"><img src="/images/s.gif" class="item-icon icon-fav">Direct Link</a>    </div><h1>Class Ext.layout.AnchorLayout</h1>    <table cellspacing="0">        <!--        <tr>        <td class="label">        Package:        </td>        <td class="hd-info">        </td>        </tr>        -->        <tr>            <td class="label">                Defined In:            </td>            <td class="hd-info">                AnchorLayout.js            </td>        </tr>        <tr>            <td class="label">                Class:            </td>            <td class="hd-info">                Ext.layout.AnchorLayout            </td>        </tr>        <tr>            <td class="label">                Extends:            </td>            <td class="hd-info">                Ext.layout.ContainerLayout            </td>        </tr>    </table>    <div class="description">        <p>  
  相對于容器四周的尺寸大小，對其包含在內(nèi)的元素進(jìn)行定位式（Anchoring）的布局。
  如果容器大小發(fā)生變化，所有已固定的項都會隨著定位規(guī)則而變化（按照規(guī)則自動渲染）。
  應(yīng)通過繼承此類或設(shè)置<a href="###" onClick="alert('Ext.Container#layout');">Ext.Container#layout</a>的配置layout:'anchor' 的方式創(chuàng)建，一般很少通過關(guān)鍵字new直接使用。</p>
  <p>AnchorLayout不存在任何直接的配置項(other than inherited ones).
  不過使用這種AnchorLayot的布局就可使用針對該布局的<b>anchorSize</b>配置項屬性進(jìn)行設(shè)置。
  缺省下，AnchorLayout會基于其自身容器的大小來計算出定位的尺寸數(shù)值，但若指定了achorSize的值，AnchorLayout就會
  按照該尺寸生成一個虛擬的容器，在這個虛擬容器上計算出定位尺寸，使得定位邏輯和父容器相分離，可實現(xiàn)獨立調(diào)節(jié)大小</p>
  <p>AnchorLayout的子項都支持<b>anchorSize</b>的配置項屬性，這是一個字符串，包含兩種值：水平定位值和垂直定位值（例如，'100% 50%'）。
  這個值便是告知子項應(yīng)該怎么在容器內(nèi)定位。
  可使用的定位值有下列類型：
  <ul>
  <li><b>Percentage</b>: 1到100的任意百分比值。第一個值是容器作用下子項的寬度百分比，第二個值是高度。例如'100% 50%'就是生成完整的寬度和一半高度的子項。
  如果指定的是單獨的值就意味著高度和寬度都是這個值。</li>
  <li><b>Offsets</b>：任意整數(shù)值，可為正數(shù)或負(fù)數(shù)。 
  第一個值是相當(dāng)于容器右邊緣的便宜值，第二個是相當(dāng)于底部邊緣的偏移值。例如'-50 -100'即表示生成的容器在寬度和高度分別減去50象素和100象素。
  若只是指定一個值，那這個值將應(yīng)用到右偏移而下偏移則缺省為0。</li>
  <li><b>Sides</b>：有效的值是 'right'（或 'r'）和'bottom'（或 'b'）。  
  要么在容器上設(shè)置一個固定的值，要么在渲染時候指定好anchorSize的配置項，才能有正確的效果。</li>
  </ul>
  <p>可靈活設(shè)置定位的值。如'-50 75%'。</p>
     </div>    <div class="hr">    </div>    <a id="Ext.layout.AnchorLayout-configs"></a>    <h2>配置項</h2>            <table cellspacing="0" class="member-table">            <tr>                <th class="sig-header" colspan="2">                    配置項                </th>                <th class="msource-header">                    定義者                </th>            </tr>                            <tr class="config-row expandable">                    <td class="micon">                        <a class="exi" href="#expand">&nbsp;</a>                    </td>                    <td class="sig">                        <a id="CSS-header"></a>                        <b>CSS</b>                        : String                        <div class="mdesc">                            <div class="short">                                一個可選添加的CSS樣式類，加入到組件的容器上（默認(rèn)為''）。 這為容...                             </div>                            <div class="long">                                一個可選添加的CSS樣式類，加入到組件的容器上（默認(rèn)為''）。 這為容器或容器的子節(jié)點加入標(biāo)準(zhǔn)CSS規(guī)則提供了方便。                             </div>                        </div>                    </td>                    <td class="msource">                                                    <!--如果這不是同個namespace下-->							<a 	ext:cls="Ext.layout.ContainerLayout" 								ext:member="#method-CSS" 								href="output/Ext.layout.ContainerLayout.html#method-CSS">								ContainerLayout							</a>                                                                    </td>                </tr>                            <tr class="config-row expandable">                    <td class="micon">                        <a class="exi" href="#expand">&nbsp;</a>                    </td>                    <td class="sig">                        <a id="renderHidden-header"></a>                        <b>renderHidden</b>                        : Boolean                        <div class="mdesc">                            <div class="short">                                True表示為在渲染時隱藏包含的每一項（缺省為false）。                             </div>                            <div class="long">                                True表示為在渲染時隱藏包含的每一項（缺省為false）。                             </div>                        </div>                    </td>                    <td class="msource">                                                    <!--如果這不是同個namespace下-->							<a 	ext:cls="Ext.layout.ContainerLayout" 								ext:member="#method-renderHidden" 								href="output/Ext.layout.ContainerLayout.html#method-renderHidden">								ContainerLayout							</a>                                                                    </td>                </tr>                    </table>        	<a id="Ext.layout.AnchorLayout-props"></a>    <h2>公告屬性</h2>            <table cellspacing="0" class="member-table">            <tr>                <th colspan="2">                    屬性                </th>                <th>                    定義者                </th>            </tr>                            <tr class="property-row inherited expandable">                    <td class="micon">                        <a class="exi" href="#expand">&nbsp;</a>                    </td>                    <td class="sig">                        <a id="activeItem-activeItem"></a>                        <b>                        activeItem: activeItem</b>                        <div class="mdesc">                            <div class="short">                                 一個已激活Ext.Component的引用 例如，if(myPane...                             </div>                            <div class="long">                                 一個已激活<a href="###" onClick="alert('Ext.Component');">Ext.Component</a>的引用 例如，if(myPanel.layout.activeItem.id == 'item-1') { ... }。 activeItem只會作用在布局樣式上。（像<a href="###" onClick="alert('Ext.layout.Accordion');">Ext.layout.Accordion</a>,  <a href="###" onClick="alert('Ext.layout.CardLayout');">Ext.layout.CardLayout</a>和<a href="###" onClick="alert('Ext.layout.FitLayout');">Ext.layout.FitLayout</a>）。只讀的。   Related to <a href="###" onClick="alert('Ext.Container#activeItem');">Ext.Container#activeItem</a>.                               </div>                        </div>                    </td>                    <td class="msource">                    							                                                    <!--如果這不是同個namespace下--><a ext:cls="Ext.layout.ContainerLayout" ext:member="#method-activeItem" href="output/Ext.layout.ContainerLayout.html#method-activeItem">                                                ContainerLayout                                                </a>                                        </td>                </tr>                    </table>            <a id="Ext.layout.AnchorLayout-methods"></a>    <h2>公共方法</h2>            <table cellspacing="0" class="member-table">            <tr>                <th class="sig-header" colspan="2">                    方法                </th>                <th class="msource-header">                    定義者                </th>            </tr>                    </table>            <a id="Ext.layout.AnchorLayout-events"></a>    <a id="Ext.Ajax-events"></a>    <h2>公告事件</h2>                <div class="no-members">            這個類沒公共的事件。        </div>    </div>