Question

我正在尝试将Google-Plus嵌入到我的GWT应用程序中。我希望它嵌入到HorizontalPanel中。我读过+1button developers google。我没有在stackoverflow中找到任何有关此特定问题的帖子。我的问题可能是我不明白如何将js包含到GUI组件中。如果您将Google+代码添加到Panel中，我将不胜感激。

Answer 1

以下是如何操作：

文档：

 <!-- Place this tag in your head or just before your close body tag -->
 <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
 <!-- Place this tag where you want the +1 button to render -->
 <g:plusone></g:plusone>

GWT中的

：

private void drawPlusOne() {
    String s = "<g:plusone href=\"http://urltoplusone.com\"></g:plusone>";
    HTML h = new HTML(s);
    somePanel.add(h);

    // You can insert a script tag this way or via your .gwt.xml
    Document doc = Document.get();
    ScriptElement script = doc.createScriptElement();
    script.setSrc("https://apis.google.com/js/plusone.js");
    script.setType("text/javascript");
    script.setLang("javascript");
    doc.getBody().appendChild(script);
  }

Answer 2

我个人从未在GWT中嵌入+1按钮，但链接的文章似乎非常自我解释。

在“简单按钮”部分中，它表明实施GooglePlus集成的最简单方法是添加以下内容：

<script src="https://apis.google.com/js/plusone.js" />
<g:plusone></g:plusone>

首先，<script>标记应包含在.gwt.xml文件中。

然后我就像这样实现<g:plusone></g:plusone>：

public class GPlusOne extends SimplePanel {
    public GPlusOne () {
        super((Element)Document.get().createElement("g:plusone").cast());
    }
}

（请注意，此代码未经测试，但它基于一个简单的概念，SimplePanel可以扩展为编译为任何HTML元素。）

然后，只要您想要按钮显示，就可以使用新的GPlusOne元素。

Answer 3

我找到了一个更好的方法：

按照此示例使按钮在正常的html页面上进行调用（您可以在此处尝试http://jsfiddle.net/JQAdc/）

<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<script src="https://apis.google.com/js/plusone.js">
    {"parsetags": "explicit"}
</script>
<script type="text/javascript">
    function gPlusBtn(id, params) {
        /* window.alert("searching for "+ id +" with params: "+ params) */
        paramsObj = eval( '('+params+')' );
        gapi.plusone.render(id, paramsObj );
    }
// params is here just for a reference to simulate what will come from gwt
 params = '{href:"http://1vu.fr", size:"tall"}';

</script>
</head>

<body>
taken from http://jsfiddle.net/JQAdc/
    <div id="gplus" />
    <button onclick="gPlusBtn('gplus', params)">show!</button>
</body>
</html>

然后你可以调用一个本机方法来触发Activity start上的按钮显示（如果你正在使用MVP）。

protected native void plusOneButton(String id, String params) /*-{
    $wnd.gPlusBtn(id, params);
}-*/;

您可以使用不同网址的多个按钮，这就是将id留作参数的原因。

注意：对我来说，原始HTML适用于localhost，但适用于GWT版本。我必须部署到服务器才能看到结果

在GWT中嵌入google-plus

3 个答案: