`
Djava.sohu.com
  • 浏览: 64618 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

ExtJs的布局管理

Web 
阅读更多
   这两天一直在搞布局管理.虽然ExtJs提供了不少布局管理方式.我觉得最有用的还是BorderLayout。它在应用中,使用的最广泛。比如,在Web开发中的列表页面,上面显示查询条件,下面显示查询数据。在布局上要求上面的查询区域不要占太大空间,下面的数据显示区要自动凋整高度,宽度,这种情况下使用BorderLayout的布局方式就很合适.
   使用BorderLayout的步骤也不复杂.大体步骤就是:
1.创建一个Viewport,注意一个窗口只能创建一个Viewport
2.设置它的layout属性为'border'
3.然后把查询区和数据显示区的两个区域放到items里
4.设置查询区的region属性为'north'
5.设置数据区的region属性为'center'
然后就只可以了.简单吧.
分享到：
| 轻装前进（随笔) (2009.10.31)
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    extjs布局管理学习指南

    ### ExtJS布局管理学习指南 #### 一、引言 ExtJS是一款强大的JavaScript框架，用于构建复杂的前端应用程序。其中布局管理是ExtJS的核心特性之一，它可以帮助开发者有效地组织UI组件，使得用户界面既美观又实用。...

    Extjs学习笔记之七 布局

    以上介绍的只是Extjs布局管理中的一小部分，Extjs官网提供了丰富的例子和详细的文档，这是学习Extjs布局的最佳资源。通过官网的例子，可以直观地看到不同布局类型的效果和配置方法，极大地便利了开发者的布局实践和...

    ExtJS布局之border实例

    ### ExtJS布局之border实例详解 #### 一、Border布局简介 在ExtJS框架中，`border`布局是一种非常常见的布局方式，它将容器划分为五个区域：north（北）、south（南）、east（东）、west（西）以及center（中心）。...

    ExtJS布局练习例

    ### ExtJS布局类型 #### 1. **Column Layout** 文件中的示例使用了`column`布局，这是ExtJS中的一种常用布局方式，用于将子元素按列排列。例如，在代码中，可以看到一个`Ext.Panel`对象被创建，并指定了`layout:'...

    Extjs文件管理系统

    此外，ExtJS 支持响应式布局，能够在不同设备上提供良好的用户体验。 在"Extjs文件管理系统"中，文件管理功能是核心。文件压缩和解压功能通常依赖于后台服务，如使用 ZIP 或 RAR 库来处理压缩和解压缩任务。前端...

    ExtJs教学管理系统

    ExtJs的核心特性包括数据绑定、布局管理、拖放功能、可访问性支持以及强大的图表功能。在"教学管理系统"中，ExtJs可能被用来创建交互式的界面元素，如可排序和分页的课程表，或者可编辑的学生信息表单。 .Net框架是...

    合同管理系统 extjs开发的 让大家一起学习

    3. **响应式布局**：EXTJS支持响应式布局，可以自适应不同设备和屏幕尺寸，保证在移动端和桌面端都有良好的用户体验。 4. **强大的图表组件**：EXTJS内置了多种图表类型，可用于展示合同数据的统计分析，帮助企业...

    extjs布局全面讲解

    ### ExtJS布局全面讲解 #### 一、Border Layout（方位布局） **定义与特性：** - **定义**：Border布局由类`Ext.layout.BorderLayout`定义，布局名称为`border`，这是一种非常实用且常见的布局方式，适用于创建...

    Extjs通用权限管理系统

    Extjs提供了丰富的组件和布局模式，使得开发者能够轻松创建复杂的用户界面。其数据绑定机制和Model-View-Controller（MVC）设计模式，有助于保持前端逻辑的清晰与分离，同时增强了应用的可维护性和可扩展性。 后台...

    ExtJs制作新闻管理系统

    其强大的布局管理和组件模型可以帮助开发者快速构建复杂的交互式界面。例如，使用Grid Panel展示新闻列表，Text Field用于输入新闻标题，Date Picker处理发布日期，而Editor Grid则可以支持直接在表格内编辑数据。 ...

    extjs相关

    ### ExtJS布局管理器：BorderLayout **BorderLayout** 是ExtJS中的一个布局管理器，它将容器划分为五个部分：北、南、东、西和中心区域。每个区域都可以包含一个组件。例如，在文件中提到了 `layout: 'accordion'`，...

    extjs4.0.7后台管理框架

    5. **Layouts**：EXTJS的布局管理器确保组件在不同屏幕尺寸和分辨率下的适配，如Fit、Border、Accordion等布局。 6. **Drag & Drop**：EXTJS支持拖放操作，方便用户重新排列组件或在组件之间传输数据。 7. **Ajax...

    基于ExtJS的通用后台管理系统

    描述中提到"淘宝买的"，这可能意味着这个系统是基于某个开源模板或者框架修改而来的，可能包括了预定义的UI组件、布局、以及一些常见的后台管理功能模块。"亲试可用"表明这个系统经过了一定程度的测试，具有较好的...

    Extjs5.0从入门到实战开发信息管理系统

    这包括学习ExtJS的架构、事件模型、布局管理、组件系统以及数据绑定。在ExtJS中，每个UI元素都是一个组件，它们可以通过组合和配置来创建复杂的用户界面。事件模型允许组件之间进行交互，而数据绑定则实现了视图和...

    ExtJS之布局详解

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

    ExtJS3.2列布局

    在3.2版本中，它提供了丰富的组件和布局管理机制，使得开发者可以构建出复杂的、响应式的用户界面。"ExtJS3.2列布局"是这个框架中的一个重要概念，尤其在处理form表单时非常实用。 列布局（Column Layout）是ExtJS...

    ExtjS--accordion布局

    它提供了丰富的组件和布局管理功能，使得开发者能够创建复杂、交互式的用户界面。在本篇博客中，我们将聚焦于"accordion布局"这一特性，它是ExtJS布局系统中的一种特殊形式。 Accordion布局，又称为折叠面板布局，...

    EXTJS产品级别管理后台源代码

    7. **响应式设计**：EXTJS支持移动设备，使用`Ext.viewport`和`Ext.layout.container.Box`等布局管理器，可以实现跨平台的响应式设计，确保在不同设备上都能提供良好的用户体验。 在压缩包文件`ysc-APDPlat-5e7a864...

    EXTJS图书管理系统页面（JAVA）

    此外，EXTJS的布局管理机制也是其强大之处，它可以自动调整组件的大小和位置以适应屏幕尺寸变化。这在图书管理系统中尤其重要，确保用户在不同分辨率和设备上都能获得一致的体验。 总的来说，"EXTJS图书管理系统...

Magicbox
Global site tag (gtag.js) - Google Analytics