`
未雨绸缪
  • 浏览: 215724 次
  • 性别: Icon_minigender_1
  • 来自: 陕西
社区版块
存档分类
最新评论

GXT 2.0m1版 Layout and LayoutData 介绍

    博客分类:
  • GWT
阅读更多

GXT 2.0m1版Layout and LayoutData 介绍

GXT将Layout的设置分成两部分,一是Layout的类型,二是与之相对应的Layout的属性,也就是LayoutData。让一LayoutContainer应用一种Layout时,先设置是应用哪种类型的,之后在添加Component时,把LayoutData也添加进去。我认为这样的优点是把添加Component同设置Component的Layout分离开,从而可以灵活的为Component应用不同的Layout。

AbsoluteLayout

绝对定位的Layout,以屏幕的上边和左边为基准,定位一个Component;

主要方法:
setPosition(Component c, int left, int top)

AbsoluteData

可以设置的属性有left、top

BorderLayout

这是一个面向应用程序用户界面的Layout,它可以按照方位(南、北、东、西、中)的放置Component,还支持两个相邻区域间的Split Bar的效果。任意一个区域都可以收缩或伸展,也可以显示或隐藏。
  public class BorderLayoutExample extends LayoutContainer {

    public BorderLayoutExample() {
      setLayout(new BorderLayout());

      ContentPanel west = new ContentPanel();
      ContentPanel center = new ContentPanel();

      BorderLayoutData westData = new BorderLayoutData(LayoutRegion.WEST, 200);
      westData.setSplit(true);
      westData.setCollapsible(true);
      westData.setMargins(new Margins(5));

      BorderLayoutData centerData = new BorderLayoutData(LayoutRegion.CENTER);
      centerData.setMargins(new Margins(5, 0, 5, 0));

      add(west, westData);
      add(center, centerData);
    }
  }

BorderLayoutData

可以设置的属性有:
  1. Margin、
  2. MaxSize、
  3. MinSize、
  4. Region(所在区域)、显示或隐藏、收缩或伸展和SplitBar功能。

CenterLayout

将一个widget放置在Container的中间位置;

FlowLayout

最简单的布局类型,是Container默认的Layout类型。应用此类型的Layout不会影响在其中的Component的尺寸和位置。

FormLayout

该布局类型适合制作类似注册表单的那种布局,它只能呈现继承了Field类型的控件,而其它控件在呈现时会被忽略。Field类型的控件有:ComboBox、TextField、CheckBox等网页常用的控件。

FormLayoutData

可以设置的属性有:

  1. Label的布局、
  2. Label宽度、
  3. Label的Pad、
  4. Label的间隔符(默认是“:”)
  5. 设置Label的显示或隐藏。

HBoxLayout和VBoxLayout

HBoxLayout是将Component横向放置的布局类型,VBoxLayout是将Component纵向放置的布局类型。

HBoxLayoutData和VBoxLayoutData

可以设置的属性:可以拉伸的最小尺寸(默认是0)和最大尺寸(默认是1000000)、Flex的设置。Flex是一个在改变尺寸时,做尺寸计算用的度量值。

TableLayout

这是一种表格的形式布局类型,可以指定列数,行数会自动根据添加的Component数来计算,之后将添加的Component按照从左到右、从上到下的顺序呈现出来。

TableLayoutData

  1. 合并单元格的个数
  2. 单元格的高度和宽度
  3. 单元格的Margin和Padding
  4. 单元格的横向和纵向的布局
  5. 单元格的CSS样式
0
2
分享到:
评论

相关推荐

    GXT2.0 EXT=GWT !!!!

    标题"GXT2.0 EXT=GWT !!!!"揭示了一个关键信息,即GXT(Ext GWT)的版本2.0。这是一个基于Google Web Toolkit(GWT)的UI组件库,它允许开发者使用Java来构建富互联网应用程序(Rich Internet Applications,...

    GXT 学习的好书

    《Ext GWT 2.0 Beginner's Guide》是一本非常适合初学者入门的书籍,它不仅详细介绍了GXT的基本概念和技术要点,还提供了丰富的实践案例和最佳实践建议。无论是希望快速上手GXT的新手,还是想要深入了解GXT高级特性...

    Gxt_BLOG(GXt项目)

    5. **数据绑定(Data Binding)**:GXT的模型-视图-视图模型(MVVM)架构允许开发者通过数据绑定来同步UI和后端数据,减少手动更新视图的工作量。 6. **主题与皮肤(Themes and Skins)**:GXT提供了一系列预设的...

    ext gwt gxt初学教程

    ### ExtGWT、GWT与GXT初学教程:打造企业级富客户端Web应用 #### 构建初识:ExtGWT与GWT的协同工作 ExtGWT,作为GWT(Google Web Toolkit)的有力补充,旨在为Java开发者提供更为丰富、功能全面的组件库,从而构建...

    Gxt,包含resource

    标题中的"Gxt"指的是Sencha GXT,这是一个基于Google Web Toolkit (GWT) 的Java库,专门用于构建富互联网应用程序(Rich Internet Applications, RIA)。GXT提供了丰富的组件、数据绑定、布局管理以及主题定制等功能...

    gxt初学进阶教程

    从给定的内容来看,这篇“gxt初学进阶教程”主要介绍了一个基于GWT(Google Web Toolkit)的扩展工具库ExtGWT,也被称作GXT,用于帮助Java程序员在Web开发中创建富客户端应用程序。以下是根据提供的文件内容总结出的...

    GXT组件使用教程

    这个文档专门介绍如何利用JavaBeans与GXT协同工作,包括数据模型的创建、数据的读写以及如何在UI上实时反映数据变化,是理解GXT数据绑定机制的重要参考资料。 通过学习上述文档,开发者将能够熟练地运用GXT来构建...

    一步一步教你新建GXT项目

    或`com.extjs.gxt.ui.client.widget.layout.FitLayout`,并添加一些基本组件,如按钮、文本框等。 6. **主入口类**:在`com.yourcompany.yourproject.client`目录下,找到`YourProject`类,修改`onModuleLoad()`...

    GXT 软件包和API

    例如,GXT 4.x版本引入了Material Design风格,提供更现代的外观,同时保持对旧版的兼容性。 7. **与其他框架的比较** GXT与其它前端框架(如Angular, React, Vue等)相比,主要优势在于其Java背景,适合有Java...

    EXT-GWT 2.2.0 API DOC (gxt) chm版

    EXT-GWT 2.2.0 API DOC (gxt) chm 版 。 2010年10月制作。完美的搜索功能。如果打不开,请选中它,点右键 看属性,选择解除锁定。别再抱怨打不开了。

    搭建简单的EXT-GWT(GXT)的开发环境(四)ext-gwt(gxt)结合google map第三版开发

    本教程将详细介绍如何搭建EXT-GWT(GXT)的开发环境,并结合Google Maps API第三版进行集成开发。 首先,我们需要准备以下基础环境: 1. **Java Development Kit (JDK)**:由于EXT-GWT是基于GWT,而GWT又是用Java...

    gxt-1.2.3.jar.zip

    标题 "gxt-1.2.3.jar.zip" 指的是一个包含GXT库的压缩文件,版本为1.2.3。GXT,全称为Google Web Toolkit EXT,是Google Web Toolkit(GWT)的一个扩展,它提供了一系列丰富的用户界面组件,用于构建功能强大的Web...

    gxt-2.2.5.zip

    《GXT 2.2.5:Ext-GWT的增强工具包详解》 GXT,全称为GWT eXtension,是由EXTJS团队开发的一个用于Google Web Toolkit(GWT)的扩展库,旨在为GWT开发者提供更丰富、更强大的用户界面组件和功能。GXT 2.2.5是该系列...

    GXT v2.2.1 API doc

    **GXT v2.2.1 API 文档详解** GXT (Ext GWT) 是一个基于Google Web Toolkit (GWT) 的用户界面库,它提供了一系列丰富的组件和样式,用于构建复杂的、高性能的Web应用程序。GXT v2.2.1 API文档是官方提供的详细参考...

    gwt , gxt文件上传

    GWT(Google Web Toolkit)和GXT(Sencha GXT)是两个在Web开发中用于构建富互联网应用程序(RIA)的框架。GWT是Google推出的一款开源工具,它允许开发者使用Java语言编写客户端代码,然后编译成优化的JavaScript,...

    gxt-2.2.4 EXT GWT

    gxt-2.2.4 EXT GWT Note : Ext GWT 2.X requires GWT 1.7+ or GWT 2.0+ (any build ending in "-gwt2.zip").

    GXT Cascade ComboBox Samples

    在IT行业中,GXT(Ext GWT)是一种用于构建富客户端Web应用的JavaScript库,它基于Google的GWT(Google Web Toolkit)。GXT提供了一系列组件,使得开发者可以创建功能丰富的用户界面,类似于桌面应用程序的体验。...

    GXT的JAR包

    总结来说,GXT是GWT的增强版,提供了丰富的UI组件和功能,简化了富互联网应用程序的开发工作。通过使用GXT的JAR包和源代码,开发者可以更高效地构建具有专业级界面和用户体验的Web应用。而GXT 2.2.5则是一个特定的...

Global site tag (gtag.js) - Google Analytics