绝对布局(Ext.layout.container.Absolute) 绝对布局让我回想到了使用Foxpro开发的时候,哪时候的界面布局就是这样,通过设置控件的左上角坐标(x,y)和宽度来进行的,因为输入控件的高度基本是固定的,所以不需要设置.在可视化编程没有出现之前,开发界面算是个苦差事,因为布局是需要花费不少功夫的,例如想要在已经定义好的组件中插入一个组件,那就得重新修改插入位置以下的组件的坐标,这工作是比较枯燥无聊的,因而,在没必要的情况下,还是少选择这种布局模式. 绝对布局是使用CSS的…
盒子布局 盒子布局主要作用是以水平(Ext.layout.container.HBox)或垂直方式(Ext.layout.container.VBox)来划分容器区域.这也是比较常有的布局方式. 使用盒子布局,除了要在容器定义layout配置项外,还需要在子组件指定子组件的宽度(HBox)或高度(VBox).指定宽度或高度有两种方式,一是直接使用width或height来定义,一是使用flex配置项,根据比例来划分.下面通过一些示例来了解一下盒子布局的使用,这里只使用水平盒子作为示例,垂直盒子就…
概述 在Ext JS中,包含两类布局:组件类布局和容器类布局.由于有些组件是有不同的组件组合而成的,如字段就由标题和输入框构成,他们之间也是存在布局关系的,而这就需要组件类布局来处理组件内自己特有的布局关系.如果我们不定义自己的组件,基本不需要使用到组件布局,知道就行了.本文主要介绍的是容器类布局,因为这个在开发中是必定会使用到的. 注意:在Ext JS中,字段有两层意思.在模型中所说的字段,与数据库中的字段的意义是一样.字段的第二层意思是指表单中的输入组件,这个大家要注意区分. 自动布局:Ex…
概述 在Ext JS中.包括两类布局:组件类布局和容器类布局.由于有些组件是有不同的组件组合而成的,如字段就由标题和输入框构成,他们之间也是存在布局关系的,而这就须要组件类布局来处理组件内自己特有的布局关系. 假设我们不定义自己的组件,基本不须要使用到组件布局,知道即可了. 本文主要介绍的是容器类布局,由于这个在开发中是必然会使用到的. 注意:在Ext JS中,字段有两层意思.在模型中所说的字段.与数据库中的字段的意义是一样.字段的第二层意思是指表单中的输入组件,这个大家要注意区分. 自己主动布…
绝对布局(Ext.layout.container.Absolute) 绝对布局让我回忆到了使用Foxpro开发的时候,哪时候的界面布局就是这样.通过设置控件的左上角坐标(x.y)和宽度来进行的,由于输入控件的高度基本是固定的.所以不须要设置.在可视化编程没有出现之前,开发界面算是个苦差事,由于布局是须要花费不少功夫的.比如想要在已经定义好的组件中插入一个组件,那就得又一次改动插入位置下面的组件的坐标.这工作是比較枯燥无聊的.因而,在不是必需的情况下,还是少选择这样的布局模式. 绝对布局是使用C…
盒子布局 盒子布局主要作用是以水平(Ext.layout.container.HBox)或垂直方式(Ext.layout.container.VBox)来划分容器区域.这也是比較常有的布局方式. 使用盒子布局,除了要在容器定义layout配置项外,还须要在子组件指定子组件的宽度(HBox)或高度(VBox).指定宽度或高度有两种方式.一是直接使用width或height来定义,一是使用flex配置项,依据比例来划分.以下通过一些演示样例来了解一下盒子布局的使用,这里仅仅使用水平盒子作为演示样例,…
概述 Ext.Component是所有Ext组件的基类,这在Ext.Component的API中第一句话就提到了.然后第二段说明了它包含的基本功能:隐藏/显示.启用/禁用以及尺寸控制等.除了以上这些基本功能,其实还包含了很多东西.当然,在API中不可能面面俱到,那么,我们应当如何去理解这个组件基类呢? Ext.Component===DIV 如果将一个Ext.Component渲染到页面,会看到该组件会简单的在页面中添加一个DIV标记,就是这么简单.也就是说,Ext.Component就相当于一…
概述 在页面中,比较棘手的地方就是布局.而要实现布局,就得有能维护布局的容器.可以说,在我试过和使用过的Javascript框架中,Ext JS的布局是做得最棒的一个,而这得益于它强大的容器类和丰富的布局类.在本文将介绍Ext JS的容器组合和布局类. 容器:Ext.container.Container 容器的主要功能是管理其内部的组件,因而在继承Ext.Component的全部功能的基础上,添加了对应的用来处理内部组件的方法add.insert.remove和removeAll.在配置项方法…
第二章:Ext.js高级组件 grid组件 普通方式 表格面板类Ext.grid.Panel xtype(别名):gridpanel.grid title标题.renderTo渲染至.width宽.height高 frame : Boolean 是否填充渲染gridpanel forceFit : true 列是否自动填充 store : store 数据集 tbar: [] 头部工具栏 dockedItems : Object/Array 可定位的停靠工具条(上.下.左.右) selType…
[20141011]编写高质量JS代码的68个有效方法(二) *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !important; } /* BLOCKS =============================================================================*/ p, blockquote, ul, ol, dl, table,…