gwt / gwt-query - 使面板内的一些内部区域透明答案

【问题标题】：gwt / gwt-query - make a transparent some inner areas inside a panelgwt / gwt-query - 使面板内的一些内部区域透明
【发布时间】：2012-08-18 05:15:56
【问题描述】：

我一直在期待能够使面板内的某些内部区域透明但其余部分不透明的东西。比如说，如果我有一个尺寸为 500x300 的面板，我只想透明左侧和顶部（相对于其父级）分别为 30 和 40 且宽度和高度分别为 100 和 200 的区域。

提前致谢！

PS：也许解决方案是在本机方法中添加一些 js 内容，但不确定。

【问题讨论】：

标签： java gwt transparency gwtquery

【解决方案1】：

我认为没有一种直接的方法可以“剪切”面板的一部分。我会像这样解决它：

Panel:
+---------+--------------------------------+----------------+
|         |             B                  |                |
|         |                                |                |
|         +--------------------------------+                |
|         |                                |                |
|   A     |             T                  |      D         |
|         |                                |                |
|         |                                |                |
|         +--------------------------------+                |
|         |             C                  |                |
|         |                                |                |
+---------+--------------------------------+----------------+

让整个面板背景透明^[*]。然后添加白色背景的 A、B、C 和 D。这将使 T 保持透明。

使用 DockLayoutPanel 可以轻松实现这种排列！

^[*] 提示：如果您使用的是 GWT 主题，它可能已经在面板上设置了背景。如果是这种情况，请使用myPanel.addStyleName("transparent")，并定义 CSS 规则

div.transparent {
  background: none;
}

【讨论】：

另一种方法是使用AbsolutePanel，并设置$(absolutePanel).css("overflow","hidden")，这是制作视口的简单方法。