Question

如何在GWT中使用这个简单的js函数？（例如图片动画脚本）

f(d, 1) = 2*f(d, 0) =           2*d

f(d, 2) = 2*f(d, 1) = 2*(2*d) = 4*d

f(d, 3) = 2*f(d, 2) = 2*(4*d) = 8*d

...  // Inductivly...
f(d, k) =  2^k *d     // for k > 0

尝试包装

<script type="text/javascript">
var cSpeed=4;
var cWidth=64;
var cHeight=64;
var cTotalFrames=8;
var cFrameWidth=64;
var cImageSrc='images/sprites.gif';

var cImageTimeout=false;
var cIndex=0;
var cXpos=0;
var cPreloaderTimeout=false;
var SECONDS_BETWEEN_FRAMES=0;

function startAnimation(){

    document.getElementById('loaderImage').style.backgroundImage='url('+cImageSrc+')';
    document.getElementById('loaderImage').style.width=cWidth+'px';
    document.getElementById('loaderImage').style.height=cHeight+'px';

    //FPS = Math.round(100/(maxSpeed+2-speed));
    FPS = Math.round(100/cSpeed);
    SECONDS_BETWEEN_FRAMES = 1 / FPS;

    cPreloaderTimeout=setTimeout('continueAnimation()', SECONDS_BETWEEN_FRAMES/1000);

}

function continueAnimation(){

    cXpos += cFrameWidth;
    //increase the index so we know which frame of our animation we are currently on
    cIndex += 1;

    //if our cIndex is higher than our total number of frames, we're at the end and should restart
    if (cIndex >= cTotalFrames) {
        cXpos =0;
        cIndex=0;
    }

    if(document.getElementById('loaderImage'))
        document.getElementById('loaderImage').style.backgroundPosition=(-cXpos)+'px 0';

    cPreloaderTimeout=setTimeout('continueAnimation()', SECONDS_BETWEEN_FRAMES*1000);
}

function stopAnimation(){//stops animation
    clearTimeout(cPreloaderTimeout);
    cPreloaderTimeout=false;
}

function imageLoader(s, fun)//Pre-loads the sprites image
{
    clearTimeout(cImageTimeout);
    cImageTimeout=0;
    genImage = new Image();
    genImage.onload=function (){cImageTimeout=setTimeout(fun, 0)};
    genImage.onerror=new Function('alert(\'Could not load the image\')');
    genImage.src=s;
}

//The following code starts the animation
new imageLoader(cImageSrc, 'startAnimation()');

但未捕获的ReferenceError：未定义startAnimation

我见过 http://www.gwtproject.org/doc/latest/DevGuideCodingBasicsJSNI.html 但没有找到js函数的例子

Answer 1

您需要添加$ wnd才能访问直接包含在HTML主页中的JavaScript。

$wnd.startAnimation();

Answer 2

您可以使用JSNI：

方法1：如果你总是用fun = 'startAnimation()'调用imageLoader，我的意思是，你总是这样使用imageLoader：imageLoader(s, 'startAnimation()');

class YourMethods
{
    public static native void imageLoader(String s) /*-{
    imageLoader(s, 'startAnimation()');
    }-*/;
}

您可以这样调用此方法：

YourMethods::imageLoader(s);

方法2：如果您fun参数更改（并非总是'startAnimation()'），但总是类型字符串

class YourMethods
{
    public static native void imageLoader(String s, String fun) /*-{
    imageLoader(s, fun);
    }-*/;
}

在这种情况下：你定义第二个参数，比如＆＃34;函数＆＃34;的javascript名称，并按这样调用：

YourMethods::imageLoader(s, "startAnimation()");

GWT理解有趣的参数，如javascript函数的名称，并输入字符串

方法3：将您的所有javascript代码转换为GWT

JS在GWT中运行

2 个答案: