Question

我计划在文本上添加一些注释，为此，首先，我需要将相关文本作为一个按钮来启动弹出窗口，然后再显示注释。要做到这一点，我需要让那个有关的文本像GWT中的按钮一样，但由于一些美学原因，我不希望它看起来像普通的GWT按钮，相反，我更喜欢它看起来像任何正常HTML超级链接，点击它后，就像一个GWT按钮，它反过来显示弹出窗口中的注释。那么有没有办法让GWT按钮看起来更像是一个html超链接？或者，至少，是否可以将相关文本转换为.JPG，以便将其插入GWT中的图像按钮？

Answer 1

你可能正在寻找的是Anchor（嘿，这很简单;））。它实现了HasClickHandlers接口，因此您可以添加ClickHandler之类的内容：

Anchor a = new Anchor("This is some text", false); // Set to true if the text contains HTML tags
a.addClickHandler(new ClickHandler() {
    onClick(ClickEvent event) {
        //Do some stuff
    }
});

更新
另一个解决方案是使用FocusPanel - 优点是FocusPanel是SimplePanel，这意味着您可以在其中添加另一个面板，这样可以更轻松地将其他GWT小部件放入其中它（如果你想要的东西不仅仅是可点击区域中的纯文本 - 当然你可以把任何HTML放在Anchor中，但我的方式不那么'hacky'恕我直言。）

HorizontalPanel hPanel = new HorizontalPanel();
hPanel.add(new Image("images/img.png"));
hPanel.add(new Label("Some text"));

FocusPanel focusPanel = new FocusPanel(hPanel);
focusPanel.addClickHandler(new ClickHandler() {
    onClick(ClickEvent event) {
        //Event fired when clicked anywhere in the hPanel - meaning the image and label
        //Do some stuff, maybe show a PopupPanel
    }
});

顺便说一句，如果您需要弹出窗口，请查看PopupPanel小部件。

Answer 2

现在，我并不熟悉GWT，但可能是GWT按钮的工作方式是它会触发一个显示弹出窗口的事件（实际上我很确定这是怎么做的）。

如果您在GWT按钮代码中稍微挖掘一下，那么将类似的事件 - handlar附加到普通<a>时不应该有任何问题。

Answer 3

我从不使用GWT，但是当你在网页上有东西时，你可以用一种没人能猜出你用过的东西的方式改变CSS的控制方式。

我建议使用以下css代码块，并告诉我它对你有好处

#GWTButtonToLinkConverter
{
backgound-color: Transparent;
border: 0px;
border-collapse: collapse;
color: blue;
text-decoration: underline;
padding: 0px;
margin : 0px;
}

有没有办法让Google Web Toolkit（GWT）按钮看起来像HTML超链接？

3 个答案: