根据内容调整 GWT 面板的高度 [英] Adjusting height of GWT Panels based on content

问题描述

我们有许多屏幕使用不同类型的 GWT 面板.

We have many screens where different types of GWT panels are used.

跨多个屏幕的一个常见问题是，内容大小是在运行时派生的.因此，如果我为面板(垂直/水平/DockPanel)定义高度，并且当面板中添加任何新组件或内容更多时，面板高度保持不变.所以我们看不到内容.UI 外观和感觉变得最差.

One common problem across many screens is that, content size is derived at runtime. So, if I define a height for a panel(Vertical/Horizontal/DockPanel) and when any new components are getting added within panel or content is more, panel height remains the same. So we are not able to see the contents. UI look and feel becomes worst.

我们如何处理身高问题?当屏幕上的某些内容发生变化时，我们是否必须手动编码以调整每个面板/小部件的高度.这不是一种非常糟糕的编码方式吗?另外，现在我们在一些地方有数据网格，如果没有非常少的记录，我们会看到数据网格下面有很大的空间，不知道我们如何处理这些情况?

How do we handle the height problems? Do we have to manually code to adjust every panel/widget height when something gets changed in screen. Is it not a very bad way of coding? Also, now we have datagrids at some places, if no of records are very less, we see a huge space left out below datagrid, not sure how do we handle these cases?

根据评论在下面更新了几个示例:你的意思是说，每当我们知道内容垂直增长时，我们总是可以选择FlowPanel.因为，我们使用了一些屏幕垂直面板/水平面板，当用户单击某些内容时，会在其中添加和显示新字段.所以垂直面板/水平面板高度不会自动调整.再举一个例子，我们在 Dock Layout Panel 内容区域内有主垂直面板，其中有一些内容可能会有所不同的小部件.所以现在如果我对大小不同的内容使用 FlowPanel，那么外面板呢?会调整吗?再次说明我们使用的面板类型 - Dock Layout Panel 与固定页眉、页脚、左侧菜单和内容区域一起使用.在内容区域内使用滚动面板.我们所有不同的小部件都在这个里面，这是水平/垂直/数据网格的混合和匹配......等.

Updated below with few examples as per the comment: Do you mean to say that whenever we know that content grows vertically, we can always choose FlowPanel. Because, some of the screens we have used Vertical panel/Horizontal Panel and inside that when user clicks something a new fields getting added and shown. So Vertical Panel/Horizontal Panel height automatically not getting adjusted. One more example is that we have main Vertical Panel within a Dock Layout Panel content area and inside that there are some widgets whose content may vary. So now if I use a FlowPanel to the content which varies in size, what about outer panels? Will get it adjusted? Again to say the kind of panels we have used - Dock Layout Panel is used with fixed header, footer, left menu and Content area. A scroll panel is used within Content area. All our different widgets go inside this which is mix and match of horizontal/vertical/datagrids..etc.

推荐答案

在 GWT(和 HTML)中，您可以设置面板的高度或让它自然展开.一般来说，一旦你设置了一个东西的高度，你就失去了让它自然膨胀的能力.

In GWT (and HTML) you can either set the height of a panel or let it expand naturally. In general, once you set the height of something, you lose the ability to let it expand naturally.

GWT 中的某些面板会隐式设置它们自己的高度(或要求您设置它们的高度)，因此对于动态调整大小的内容而言，它们绝不是好的选择.例如，LayoutPanels 和 ScrollPanels 永远不能动态调整，并期望您以编程方式提供大小信息.另一方面，FlowPanels 和 HTMLPanels 非常适合动态高度，并且您不希望显式设置它们的高度.

Some Panels in GWT implicitly set their own height (or require that you set their height) and so are never good choices for dynamically sized content. LayoutPanels and ScrollPanels, for example, can never adjust dynamically, and expect you to provide size information programmatically. FlowPanels and HTMLPanels, on the other hand, are great for dynamic heights and would rather you not set their height explicitly.

如果你想要一个滚动面板，当然你必须定义它应该有多高——否则它怎么知道什么时候滚动以及什么时候变大?但是，您可以将 FlowPanel(自动扩展)放在 ScrollPanel(您已设置为 800px 或其他值)中.然后，当您向 FlowPanel 添加内容时，它将在 ScrollPanel 内展开.然后用户可以滚动查看 FlowPanel 的不同部分.

If you want a scrolling panel, of course you have to define how high it should be - how else could it know when to scroll and when to just get bigger? But, you can put a FlowPanel (which expands automatically) inside a ScrollPanel (which you have set at 800px or whatever). Then, as you add content to the FlowPanel, it will expand inside the ScrollPanel. Users can then scroll to see different parts of the FlowPanel.

故障排除提示:

1. 确保没有在要自然展开的面板上设置高度
2. 确保您在面板上设置的高度应始终保持相同的大小
3. 尝试使用 FlowPanels 而不是 Horizo​​ntal/VerticalPanels
4. *LayoutPanels 和 AbsolutePanels 总是需要明确的大小，并且永远不会随着您添加更多内容而动态增长.您想随内容增长的任何内容都应该是 FlowPanel 或 HTMLPanel.

这篇关于根据内容调整 GWT 面板的高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！