如何使qooxdoo效果起作用？

| 我正在尝试弄清楚如何进行以下工作：

qx.Class.define(\"effects.Application\",
{
extend : qx.application.Standalone,
members :
{
main : function()
{
    // Call super class
    this.base(arguments);

    // Enable logging in debug variant
    if (qx.core.Environment.get(\"qx.debug\"))
    {
        // support native logging capabilities, e.g. Firebug for Firefox
        qx.log.appender.Native;
        // support additional cross-browser console. Press F7 to toggle visibility
        qx.log.appender.Console;
    }

    var button = new qx.ui.form.Button(\"First Button\");
    var fadeToggle = new qx.fx.effect.core.Fade(button.getContainerElement().getDomElement());
    fadeToggle.set({
       from : 1.0,
       to : 0.0
    });

    var doc = this.getRoot();
    doc.add(button);

    button.addListener(\"execute\", function() {
        fadeToggle.start();
    },this);
}
}
});

这是整个Application.js 只是想对没有运气的东西产生影响。就像qooxdoo忽略了影响一样

已邀请:

2 个回复

畦桨存灯

问题是DOM元素。执行时

button.getContainerElement().getDomElement()

它尚未出现在DOM树中。因此该函数的返回值为is2ѭ。 Qooxdoo有一个渲染队列，因此您在程序中所做的工作大部分会延迟一点。使用\'appear \'事件解决此问题：

var button = new qx.ui.form.Button(\"First Button\").set({
    enabled: false
});
var doc = this.getRoot();
button.addListener(\'appear\',function(){
    var fadeToggle = new qx.fx.effect.core.Fade(
        button.getContainerElement().getDomElement()
    ).set({
        from : 1.0,
        to : 0.0
    });
    button.addListener(\'execute\',function(){
        fadeToggle.start();
    });
    button.setEnabled(true);  
});

禁用和启用按钮只是为了炫耀……它是如此之快以至于没人注意到。框架中还有几个* .flush（）方法，您可以在其中强制立即进行渲染，因此也可以选择调用它们（正确的方法:-) ...但是由于JS应该在任何时候异步编写可能，以上可能是正确的做法。

寒健

您可能还想看看相应的手册页动画演示的代码，例如这（尽管我承认他们主要是将动画钩在用户操作上）

要回复问题请先登录或注册

如何使qooxdoo效果起作用？

2 个回复

发起人

effects

qooxdoo

问题状态

如何使qooxdoo效果起作用？

与内容相关的链接

2 个回复

发起人

effects

qooxdoo

问题状态