1

我有一个 GWT 应用程序,我想在其中使用 PopupPanel 来显示大量信息。我想让 PopupPanel 占据屏幕的其余部分(加上一些填充),并使其内容可滚动。

如果弹出面板中的材料数量超过屏幕上的空间,弹出面板的内容会超出范围,没有滚动条,而是主窗口的大小增加(带有滚动条)以为弹出窗口提供足够的空间。

我的理解是 PopupPanel 的大小取决于它的内容。

那么,实现这一目标的最简单方法是什么?

我曾考虑在 PopupPanel 中放置一个滚动面板,并将其大小设置为显示弹出窗口时的可用空间,但这似乎是一个 hack。

4

1 回答 1

1

“屏幕的其余部分”是什么意思?我想,你的意思是“全屏”?

让我们从 CSS 的角度来看它。我们将调用外部容器C和您的 PopupPanel PP将绝对定位在C.

当使用绝对定位的元素如P时,我通常这样做的方式是设置类似的东西top: 1em; right: 1em; bottom: 1em; left: 1em,因此它占用了 的所有空间C,但留下了 1em 的边距(然后您也可以添加填充)。或者,您可以使用top: 0; left: 0; width: 100%; height: 100%; margin: 1em;.

然后设置overflow: auto;P,您将滚动。

现在唯一的问题是:如果您的外部容器没有固定高度怎么办(例如,当您有一个垂直滚动的 HTML 文档时)?答案是:你总是可以创建一个辅助容器:使用position: fixed;和设置top: 0; right: 0; bottom: 0; left: 0。然后将您的 PopupPanel 作为子项添加到该新容器中。(或者,如果 GWT 允许,可以为弹出面板本身使用固定定位。)

在我的脑海中,我不能确切地说如何使用 GWT PopupPanel 最好地实现这一点,但原理应该是相同的,因为 GWT 布局是基于 CSS 的。

于 2011-09-09T10:17:19.283 回答