gwt - gwt 中的图像按钮

Question

我必须在 gwt 中创建一个图像按钮，它使用三个图像(左侧图像、中心拉伸(stretch)图像和右侧图像)。左侧图像和右侧图像具有圆角。中心图像想要拉伸(stretch)取决于按钮标题大小.创建的 ImageButton 应该具有 Button 的所有功能。

任何人都可以帮助我实现这一目标。

Answer 1

如果您需要带圆角的按钮，那么有多种选择:

1. 创建一个扩展 DecoratorPanel 的新小部件以创建圆角。 DecoratorPanel 将生成一个表格 (HTML)。您可能想要替换标准图像。查看 GWT 提供的 standard.css 以找到定义这些图像的样式，然后在自定义样式表中覆盖这些样式(查找 CSS 类“.gwt-DecoratorPanel”)。在小部件中，添加一个标签小部件以显示按钮文本，并在小部件上提供获取和设置方法以获取和设置内部标签的文本。标签会自动调整大小，迫使表格单元格变大。

2. 创建一个扩展 Composite 的新小部件。该小部件应包装一个 FlexTable。在同一行使用 3 个单元格。将标签添加到中心单元格，并在您的小部件上提供获取和设置方法以获取和设置文本到内部标签。标签将自动调整大小，迫使表格单元格变大。将适当的处理程序添加到 FlexTable 小部件。我建议您使用这些事件为适当的单元格添加或删除样式，并在样式表中定义背景图像。

3. 您可以创建自己的小部件。这需要您生成自己的 HTML 等，这些可能无法立即在所有浏览器中运行。我建议先尝试选项 1 或 2。