`
tangduDream
  • 浏览: 30219 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

ExtJS4 布局及边框

阅读更多
 this.items=[{
            fieldLabel:'公告内容',
            maxLength:50,
            xtype:'htmleditor',
            height:400,
            name:'content'
        },{
            layout:'column',
            xtype: 'container',
            anchor:'100%',
            defaults:{
                border:false,
                frame:true
            },
            items:[
                {layout:'form',columnWidth:.9,
                    items:[{fieldLabel:'附件',
                    xtype:'filefield',
                    buttonText:"浏览",
                    name:'file'}]},
                {layout:'form',columnWidth:.1,
                    items:[{xtype:'button',text:'删除',scope:this,handler:function(){this.down("filefield").reset();}}]}
            ]
        },
ExtJS4对于3来说变化还比较大嘛,部分地方写法都不一样了。比如,我写一个表单FORM。

 

第一个是,3是不需要写xtype:'container'

1 layout:'column',
2 xtype: 'container',

第二个是,TMD布局中竟然有边框,而且form1与form2 都是白色底色,我使用frame:true,border:true。底色好了,边框还是有。草。。。


 

  • 大小: 5 KB
分享到:
评论

相关推荐

    Extjs,解决双重边框问题

    本文以标题"Extjs,解决双重边框问题"和描述为例,探讨如何在Extjs 2、3、4版本中自定义Panel边框并解决双重边框现象。 首先,让我们关注Extjs 4中的情况。在默认状态下,Panel和Window组件都有边框,当Panel作为...

    EXTJS4.2浮动侧边框

    EXTJS作为一款基于JavaScript的开源框架,提供了丰富的组件库及强大的数据处理能力,使得开发者能够轻松构建出功能完善、界面友好的Web应用程序。本文将详细介绍如何在EXTJS4.2中实现一个可跟随鼠标移动显示或隐藏的...

    ExtJS之布局详解

    以下是关于ExtJS布局的详细解释: 1. **基本知识:布局操作** - 布局操作涉及容器组件内的子元素组件如何组织和分布。 - 布局的基类是`Ext.layout.ContainerLayout`,它提供了所有布局的基础功能,但本身并不具有...

    Extjs折叠布局中添加树

    在ExtJS中,折叠布局(Accordion Layout)是一种特殊的布局方式,它将所有子组件(Panels)垂直堆叠,并且在任何时刻只允许一个面板展开显示其内容,其他面板则保持折叠状态。`layout: 'accordion'` 就是用来设置...

    extjs4自定义深蓝色主题

    这个主题继承自ExtJS4的经典(Classic)主题,这意味着它在保持原有组件结构的基础上,对颜色、字体、边框等视觉元素进行了深度定制,以呈现出深蓝色调的界面风格。经典主题是ExtJS4提供的基础主题之一,包含了大...

    ExtJs布局教程Ext详细布局

    ExtJS布局是构建用户界面的关键部分,特别是在使用ExtJS库时。本文主要讲解ExtJS的Column布局,一种非常灵活的布局方式,可以帮助开发者创建复杂的、响应式的用户界面。 Column布局在ExtJS中用于将容器(如Panel)...

    ExtJS3.2列布局

    在ExtJS中,你可以通过CSS类或者组件的`style`属性来调整表单元素的外观,比如字体、颜色、边框等。你还可以使用预定义的样式类,如`.x-form-item-label`来改变标签的样式,`.x-form-field`来改变输入字段的样式。 ...

    extjs4扁平化设计

    在ExtJS 4中,可以利用Flexbox布局和响应式配置,确保应用程序在不同设备上都能呈现良好的扁平化界面。 6. **颜色方案**:扁平化设计通常使用明亮且对比鲜明的颜色。选择有限的主色调和辅助色,可以使界面更易读,...

    Extjs4使用要点个人整理

    ExtJS 4是其一个重要的版本,引入了许多新特性、改进和优化。以下是我根据提供的文件名整理的关于ExtJS 4的关键知识点: 1. **控件属性**:在`Extjs 控件属性.doc`中,可能会涵盖ExtJS 4中的各种组件(如窗口、面板...

    ExtJs中表单formPanel的横向布局

    4. **第四行**:再次应用`column`布局,将四个输入框(“电影最爱”、“音乐最爱”、“明星最爱”和“运动最爱”)并排显示,每个输入框宽度固定为50px,列宽分别为20%,实现了紧凑的布局效果。 ### 五、按钮布局 ...

    extjs_页面布局.doc

    10. **BorderLayout**:边框布局,是最常用的布局之一,将容器分为北、南、东、西、中心五个区域,常用于创建主-侧边栏类型的界面。 EXTJS的这些布局类提供了丰富的灵活性,可以根据需求选择合适的布局来构建复杂且...

    Extjs fieldset两行两列布局

    ### Extjs FieldSet 两行两列布局解析 在Extjs框架中,`FieldSet`是一种常见的组件,常用于组织一组相关的表单字段,并通过一个标题来标识这组字段的主题。本文将详细介绍如何使用Extjs实现一个两行两列布局的`...

    ExtJS改变默认字体大小的几种方式

    这种方法简单快捷,但可能会引发一些样式问题,比如按钮的边框(毛边)可能需要额外调整。针对这个问题,可以添加以下CSS规则修复: ``` .ext-ie .x-btn-text-icon .x-btn-center .x-btn-text { padding: 3px 0px...

    ExtJS 2.2 API文档

    例如,`Panel`组件可以用于创建带有标题、边框和内联布局的容器。 2. **布局管理**: ExtJS的布局系统允许开发者自定义容器中的子元素排列方式,如`Fit布局`(完全填充容器)、`Border布局`(分隔式布局)和`Form...

    Extjs3.2中文帮助手册

    3. **布局管理**:ExtJS提供多种布局模式,如表布局、边框布局、Fit布局等,帮助开发者构建适应不同屏幕尺寸和内容需求的界面。 4. **数据绑定**:数据绑定是ExtJS的一大特色,它允许将数据模型与UI组件直接关联,...

    实例分析ExtJs

    常见的布局类型有:fit布局(完全填充父容器)、border布局(类似CSS的边框布局)、form布局(用于表单元素)等。 4. **Store与Model**: Store是数据存储的容器,可以与远程服务器进行数据交换,而Model定义了数据...

    基于EXTJS 的在线EXCEL编辑器

    1. **组件化设计**:EXTJS 提供了各种可复用的组件,如表格、表单、按钮等,这些组件可以组合成复杂的用户界面,模仿Excel的工作表布局。 2. **实时编辑**:用户可以在网页上直接修改单元格内容,改动会立即显示...

    ExtJs官网2.3.0开发包

    2. **布局管理器**:2.3.0版本提供了多种布局方式,如“fit”(适应)、“border”(边框)、“form”(表单)等,使开发者能够灵活控制组件在容器中的排列和尺寸。 3. **数据绑定**:ExtJS支持数据绑定,允许将...

    ExtJs 1.1(zh-CN)

    它提供了多种布局模式,如:fit布局(完全填充父容器)、border布局(分隔边框)、form布局(表单元素排列)等,可以根据需要调整组件在容器中的位置和大小。 四、拖放功能 ExtJs内置了拖放支持,允许用户轻松创建...

Global site tag (gtag.js) - Google Analytics