3

GWTでウィジェットを作成しましたが、ユーザーがWebサイトに埋め込むことができるHTMLの小さなスニペットをユーザーに提供して、ウィジェットがそこでレンダリングされるようにしたいと思います。

ウィジェット上のリンクをクリックすると、ユーザーは（iframeのコンテンツを変更するだけでなく）自分のWebサイトに移動する必要があるため、iframeが適切であるとは思いません。

どんな助けでも大歓迎です。

PS次のものを埋め込もうとしましたが、うまくいきませんでした：<script src = "http://embeddedapptest.appspot.com/embeddedapp/embeddedapp.nocache.js"> </ script> <div id = "foo" />

4

3 に答える 3

3

可能です。スニペットは次のようにする必要があります

<script src="yourmodule.nocache.js"></script>
<div id="foo"/>

次に、エントリポイントでこれを行います。

RootPanel root = RootPanel.get("foo");
// add your things here. root.add(...);

外側のページのスタイルを踏まないように注意する必要があります。その逆も同様ですが、コンパイルされたCSSはそれを支援するのに大いに役立つはずです。

これは、APIExplorerをGoogleAPIドキュメントに埋め込むために使用される手法です。

于 2012-07-16T05:33:29.740 に答える
2

今はできないと思います。しかし将来的には、Webコンポーネントを使用してそれを行うことができます。

ただし、 gwt-exporterを使用してGWT /JavaAPIをエクスポートする可能性があります。これにより、JavaScriptAPIを自動的に作成できます。gwtchismesはこれを使用して、 JavaScriptバージョンのGWTウィジェットをエクスポートします。あなたは彼らのウィキでそれについてのチュートリアルを見つけることができます。

于 2012-07-15T08:50:52.977 に答える
0

NetBeansGWTプロジェクトで

mycss.css：

body, html,div.wrap-frame{ 
    margin: 0;
    padding: 0;
    widht: 100%;
    height: 100%;}body{
    background: white;
}

.row1or3 {
    width: 100%;
    height: 10%;
    background: blue;
    text-align: center;
}

.row2{
    width: 100%;
    height: 80%;
    background: yellow;
    text-align: center;
    display:flex;
}

.wrapper{
   width:100%;
   height: 100%;
}

.box{
    float:left; 
    height: 100%;
}

.box:nth-child(1){
    width:25%;
    background-color:red;
}

.box:nth-child(2){
    width:50%;
    background-color:green;
}

.box:nth-child(3){
    width:25%;
    background-color:yellow;
}

welcomeGWT.html

<html>
<head>
    <script id=ft type="text/javascript"  src="org.yournamehere.Main/org.yournamehere.Main.nocache.js"></script>
    <meta name='gwt:module' content='org.yournamehere.Main=org.yournamehere.Main'>
    <link rel="stylesheet" href="mycss.css"> 
</head>
<body>
    <div class="row1or3"> Row1
    </div>

    <div class="row2">
        <div class="wrapper">
            <div class="box">
                Left Side Menu
            </div>
            <div class="box" id="mydiv"> 
            </div>
            <div class="box">
                Right Side Menu
            </div>
        </div>
    </div>

    <div class="row1or3">
        Row3
    </div>​
</body>

MainEntryPoint.java

public class MainEntryPoint implements EntryPoint {

/**
 * Creates a new instance of MainEntryPoint
 */
public MainEntryPoint() {
}

/**
 * The entry point method, called automatically by loading a module that
 * declares an implementing class as an entry-point
 */
public void onModuleLoad() {
    final Label label = new Label("Hello, GWT!!!");
    final Button button = new Button("Click me!");

    button.addClickHandler(new ClickHandler() {
        public void onClick(ClickEvent event) {
            label.setVisible(!label.isVisible());
        }
    });

    RootPanel root = RootPanel.get("mydiv");
   root.add(button);
    root.add(label);
}
}

ここに画像の説明を入力してください

これで、任意のhtmlページの任意のdiv要素にid = mydivという名前を付け、コンパイルされたGWTjscriptを追加できます。私はテストしました。

于 2018-06-06T18:38:29.217 に答える