【问题标题】:Which Layout would I take when I want to fit a form in a window当我想在窗口中放置表单时我会采用哪种布局
【发布时间】:2013-07-05 15:46:55
【问题描述】:

我有多个表单,想使用一个 Window 类来查看它们。现在碰巧所有表格都有不同的大小,我不想管理所有表格,所以我考虑了“适合”布局以及窗口的最小/最大重量/高度。

但这很容易,如果我应用了dockedItems,那么布局就会混乱,并且layout failed 会出现错误。无论这个错误应该告诉我什么......但是好吧,我用谷歌搜索并发现我需要定义一个高度和一个宽度以使这个错误消失以及一个名为:shrinkWrapDock 的新特殊属性应该告诉布局取决于内容的大小。

我的问题又来了

当我想在窗口具有最大/最小尺寸的情况下自动适应窗体时,我会采用哪种布局?

编辑

它不必是严格的表单,它只是配置了“适合”布局的 Ext.window.Window,它应该为自己保持一个最小/最大大小。因此,窗口中的一个非常小的项目可能有未使用的空间,而一个非常大的项目则有滚动条。窗口的最小值/最大值之间的所有内容都被精确地调用。 例如

// lets say we have a window configured like this
{
    xtype:'window',
    minHeight: 50,
    maxHeight: 500,
    layout: 'fit'
}
  1. 到小表单 -> 添加一个只有一个textfield的表单。

    窗口使用minHeight: 50,因为一个字段的高度只有~40 px

  2. 适合最小值/最大值 -> 添加一个包含 6 个textfields 的表单。

    Windows 缩放到窗体所需的大小 ~ 240px

  3. 到高度表格 -> 添加一个带有20个textfields的表格

    窗口使用maxHeight: 500,因为 20 字段的高度约为 800 像素

【问题讨论】:

  • 您是否要分别提交这两个表格?或者它们是否在同一个表单中但只是像 2 个单独的表单一样显示?
  • @radtad 我编辑可能会质疑应用更详细的信息。请看一下
  • @JJR,据我所知,您在使用布局配置后无法获得您的行为。调整容器大小而不是创建内容时使用最小值和最大值。添加内容时需要确定窗口的大小。

标签: extjs extjs4 extjs4.2


【解决方案1】:

使用窗口内的面板(具有固定 max,min ht wdt)作为父容器,对其项目使用 flex 属性,即您的多个表单 例如:

{ xtype:'面板', itemId:'somePanelId', 布局:'适合', 项目 :[ { xtype:'形式', 弹性:2, 项目 [{..}] }, { xtype:'形式', 弹性:3, 项目 [{..}] } }

根据每个表单的大小为每个表单尝试不同的 flex 组合。在给 flex 考虑作为固定数字时,在这里说“5”作为超出,即 form1 的 2/5 大小和 form2 的 3/5(5 分之三)空间。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2017-03-30
    • 2016-05-02
    • 2014-02-25
    • 2014-09-26
    • 2012-01-25
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多