ext.container.html

Ext中文API,学习ext的同志只要你学会ext里的一种控件后其实其他的就大同小异了

<!--
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.Container-props"><img src="/images/s.gif" class="item-icon icon-prop">Properties</a><a class="inner-link" href="#Ext.Container-methods"><img src="/images/s.gif" class="item-icon icon-method">Methods</a><a class="inner-link" href="#Ext.Container-events"><img src="/images/s.gif" class="item-icon icon-event">Events</a><a class="inner-link" href="#Ext.Container-configs"><img src="/images/s.gif" class="item-icon icon-config">Config Options</a><a class="bookmark" href="../docs/?class=Ext.Container"><img src="/images/s.gif" class="item-icon icon-fav">Direct Link</a>
    </div><h1>Class Ext.Container</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">
                Container.js
            </td>
        </tr>
        <tr>
            <td class="label">
                Class:
            </td>
            <td class="hd-info">
                Ext.Container
            </td>
        </tr>
        <tr>
            <td class="label">
                Extends:
            </td>
            <td class="hd-info">
                Ext.BoxComponent
            </td>
        </tr>
    </table>
    <div class="description">
        {@link Ext.BoxComponent}的子类，用于承载其它任何组件，容器负责一些基础性的行为，也就是装载子项、添加、插入和移除子项。
  根据容纳子项的不同，所产生的可视效果，需委托任意布局类{@link #layout}中的一种来指点特定的布局逻辑（layout logic）。
  此类被于继承而且一般情况下不应通过关键字new来直接实例化。
 
    </div>
    <div class="hr">
    </div>
    <a id="Ext.Container-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="monitorResize-header"></a>
                        <b>monitorResize</b>
                        : Boolean
                        <div class="mdesc">
                            <div class="short">
                                Ture表示为自动监视window resize的事件，以处理接下来一... 
                            </div>
                            <div class="long">
                                Ture表示为自动监视window resize的事件，以处理接下来一切的事情，包括对视见区（viewport）当前大小的感知，一般情况该值由<a href="###" onClick="alert('#layout');">#layout</a>调控，而无须手动设置。 
                            </div>
                        </div>
                    </td>
                    <td class="msource">
                        
                        
                            Container
                        
                    </td>
                </tr>
            
                <tr class="config-row expandable">
                    <td class="micon">
                        <a class="exi" href="#expand">&nbsp;</a>
                    </td>
                    <td class="sig">
                        <a id="layout-header"></a>
                        <b>layout</b>
                        : String
                        <div class="mdesc">
                            <div class="short">
                                此容器所使用的布局类型。如不指定，则使用缺省的Ext.layout.C... 
                            </div>
                            <div class="long">
                                此容器所使用的布局类型。如不指定，则使用缺省的<a href="###" onClick="alert('Ext.layout.ContainerLayout');">Ext.layout.ContainerLayout</a>类型。 当中有效的值可以是：accordion、anchor、border、cavd、column、fit、form和table。 针对所选择布局类型，可指定<a href="###" onClick="alert('#layoutConfig');">#layoutConfig</a>进一步配置。 
                            </div>
                        </div>
                    </td>
                    <td class="msource">
                        
                        
                            Container
                        
                    </td>
                </tr>
            
                <tr class="config-row expandable">
                    <td class="micon">
                        <a class="exi" href="#expand">&nbsp;</a>
                    </td>
                    <td class="sig">
                        <a id="layoutConfig-header"></a>
                        <b>layoutConfig</b>
                        : Object
                        <div class="mdesc">
                            <div class="short">
                                选定好layout布局后，其相应的配置属性就在这个对象上进行设置。 (... 
                            </div>
                            <div class="long">
                                选定好layout布局后，其相应的配置属性就在这个对象上进行设置。 (即与<a href="###" onClick="alert('#layout');">#layout</a>配置联合使用)有关不同类型布局有效的完整配置信息，参阅对应的布局类： <ul class="mdetail-params"> <li><a href="###" onClick="alert('Ext.layout.Accordion');">Ext.layout.Accordion</a></li> <li><a href="###" onClick="alert('Ext.layout.AnchorLayout');">Ext.layout.AnchorLayout</a></li> <li><a href="###" onClick="alert('Ext.layout.BorderLayout');">Ext.layout.BorderLayout</a></li> <li><a href="###" onClick="alert('Ext.layout.CardLayout');">Ext.layout.CardLayout</a></li> <li><a href="###" onClick="alert('Ext.layout.ColumnLayout');">Ext.layout.ColumnLayout</a></li> <li><a href="###" onClick="alert('Ext.layout.FitLayout');">Ext.layout.FitLayout</a></li> <li><a href="###" onClick="alert('Ext.layout.FormLayout');">Ext.layout.FormLayout</a></li> <li><a href="###" onClick="alert('Ext.layout.TableLayout');">Ext.layout.TableLayout</a></li></ul> 
                            </div>
                        </div>
                    </td>
                    <td class="msource">
                        
                        
                            Container
                        
                    </td>
                </tr>
            
                <tr class="config-row expandable">
                    <td class="micon">
                        <a class="exi" href="#expand">&nbsp;</a>
                    </td>
                    <td class="sig">
                        <a id="bufferResize-header"></a>
                        <b>bufferResize</b>
                        : Boolean/Number
                        <div class="mdesc">
                            <div class="short">
                                When set to true (100 milliseconds)... 
                            </div>
                            <div class="long">
                                When set to true (100 milliseconds) or a number of milliseconds,  当设置为true（100毫秒）或输入一个毫秒数，为此容器所分配的布局会缓冲其计算的频率和缓冲组件的重新布局。 如容器包含大量的子组件或这样重型容器，在频繁进行高开销的布局时，该项尤为有用。 
                            </div>
                        </div>
                    </td>
                    <td class="msource">
                        
                        
                            Container
                        
                    </td>
                </tr>
            
                <tr class="config-row expandable">
                    <td class="micon">
                        <a class="exi" href="#expand">&nbsp;</a>
                    </td>
                    <td class="sig">
                        <a id="activeItem-header"></a>
                        <b>activeItem</b>
                        : String/Number
                        <div class="mdesc">
                            <div class="short">
                                组件id的字符串，或组件的索引，用于在容器布局渲染时候的设置为活动。例... 
                            </div>
                            <div class="long">
                                组件id的字符串，或组件的索引，用于在容器布局渲染时候的设置为活动。例如，activeItem: 'item-1'或activeItem: 0 index 0 = 容器集合中的第一项）。只有某些风格的布局可设置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>），以在某个时刻中显示一项内容。相关内容请参阅<a href="###" onClick="alert('Ext.layout.ContainerLayout#activeItem');">Ext.layout.ContainerLayout#activeItem</a>。 
                            </div>
                        </div>
                    </td>
                    <td class="msource">
                        
                        
                            Container
                        
                    </td>
                </tr>
            
                <tr class="config-row expandable">
                    <td class="micon">
                        <a class="exi" href="#expand">&nbsp;</a>
                    </td>
                    <td class="sig">
                        <a id="items-header"></a>
                        <b>items</b>
                        : Mixed
                        <div class="mdesc">
                            <div class="short">
                                一个单独项，或子组件组成的数组，加入到此容器中。 每一项的对象类型是基... 
                            </div>
                            <div class="long">
                                一个单独项，或子组件组成的数组，加入到此容器中。 每一项的对象类型是基于{@link Ext.Component}的<br><br> 你可传入一个组件的配置对象即是lazy-rendering的做法，这样做的好处是组件不会立即渲染，减低直接构建组件对象带来的开销。 要发挥"lazy instantiation延时初始化"的特性，应对组件所属的登记类型的{@link Ext.Component#xtype}属性进行配置。<br><br> 要了解所有可用的xtyps，可参阅{@link Ext.Component}。如传入的单独一个项，应直接传入一个对象的引用（ 如items: {...}）。多个项应以数组的类型传入（如items: [{...}, {...}]）。 
                            </div>
                        </div>
                    </td>
                    <td class="msource">
                        
                        
                            Container
                        
                    </td>
                </tr>
            
                <tr class="config-row expandable">
                    <td class="micon">
                        <a class="exi" href="#expand">&nbsp;</a>
                    </td>
                    <td class="sig">
                        <a id="defaults-header"></a>
                        <b>defaults</b>
                        : Object
                        <div class="mdesc">
                            <div class="short">
                                应用在全体组件上的配置项对象，无论组件是由#items指定，抑或是通过... 
                            </div>
                            <div class="long">
                                应用在全体组件上的配置项对象，无论组件是由<a href="###" onClick="alert('#items');">#items</a>指定，抑或是通过<a href="###" onClick="alert('#add');">#add</a>、<a href="###" onClick="alert('#insert');">#insert</a>的方法加入，都可支持。 缺省的配置可以是任意多个容器能识别的“名称/值”， 假设要自动为每一个<a href="###" onClick="alert('Ext.Panel');">Ext.Panel</a>项设置padding内补丁，你可以传入defaults: {bodyStyle:'padding:15px'}。 
                            </div>
                        </div>
                    </td>
                    <td class="msource">
                        
                        
                            Container
                        
                    </td>
                </tr>
            
                <tr class="config-row expandable">
                    <td class="micon">
                        <a class="exi" href="#expand">&nbsp;</a>
                    </td>
                    <td class="sig">
                        <a id="autoDestroy-header"></a>
                        <b>autoDestroy</b>
                        : Boolean
                        <div class="mdesc">
                            <div class="short">
                                若为true容器会自动销毁容器下面全部的组件，否则的话必须手动执行销毁... 
                            </div>
                            <div class="long">
                                若为true容器会自动销毁容器下面全部的组件，否则的话必须手动执行销毁过程（默认为true）。 
                            </div>
                        </div>
                    </td>
                    <td class="msource">
                        
                        
                            Container
                        
                    </td>
                </tr>