java - GWT - 如何创建下拉菜单

Question

您好，我正在尝试使用 GWT 创建下拉菜单。这是我要实现的布局:

| Categories | Pictures | Other |

现在，当类别打开时，我想显示实际的下拉菜单，以两个为一组显示类别。比方说:

 | Categories | Pictures | Other |
 |  Cat 1    Cat 2   |
 |  Cat 3    Cat 4   |
 |  Cat 5    Cat 6   | <---------- Menu of categories here
 |  Cat 7    Cat 8   |
 |  Cat 9    Other   |
  -------------------

我查看了 MenuBar 小部件 http://gwt.google.com/samples/Showcase/Showcase.html# MenuBar 和那里的其他小部件。但是，这似乎不符合我的需要，因为类别将以 2 对显示，所以每当我将鼠标移到一行上时，它都会选择它们而不是只选择一个。

我目前使用的是 FlexTable，所以基本上我有一个带空格的矩阵，我只显示类别中的元素，因为它是唯一一个有元素的元素。换句话说，所有元素都是矩阵中的一个单元格。我几乎实现了用例但是，目前编程的方式有点老套和不自然..目前它看起来像这样:

       Column1        |       Col2   |  Col3
| Categories                Pictures | Other |               <- Row1
|  Cat 1                     Cat 2   |  Empy |               <- Row2
|  Cat 3                     Cat 4   |  Empy |               <- Row3
|  Cat 5                     Cat 6   |  Empy |   <---------- Menu of categories here
|  Cat 7                     Cat 8   |  Empy |               <- Row5
|  long descriptions ruin layout     |  Empy |               <- Row6
-------------------------------------

因此标题“图片”和“其他”的布局总是会根据类别菜单的宽度移动。

谁能告诉我如何使用 GWT 实现这一点？我知道可以选择创建自己的小部件。但在此之前，我想知道如何实现这一目标。可能有人可以指导我如何集成其他技术，如 jQuery，或实现添加 CSS 类或允许具有不同列和行大小的特定 GWT 小部件布局的格式。

谢谢

Answer 1

您可以使用，例如。制作菜单的标签。单击标签(可以将鼠标悬停在 ...)上，您将显示相应的下拉菜单。

下拉菜单应该是(或扩展)DecoratedPopupPanel。在此小部件中，您可以将一个子小部件设置为下拉列表中元素的容器。所以你可以有很多不同的布局。对于您的情况，您可以简化这种结构:

<g:HorizonatlPanel>
  <g:VerticalPanel>
     items in first column
  </g:VerticalPanel> 
  <g:VerticalPanel>
     items in second column
  </g:VerticalPanel>
</g:HorizontalPanel>

在显示下拉菜单之前，确保根据点击的标签更新弹出位置。如果菜单下拉菜单很复杂，请尝试使用 UiBinder 来使用 XML 表达布局。

Here是点击按钮时显示的 DecoratedPopupPanel 示例。

更多关于UiBinder，不熟悉的找here .