Can I refresh a Flash with new parameters after setting new values in ZK

answered 2014-09-24 06:55:46 +0800

cor3000
6280 ● 2 ● 7

You can change the properties and then call invalidate() in the end to rerender the component with new properties.

<zk>
  <flash id="flashComp" src="http://www.zkoss.org/zkdemo/widgets/multimedia/flash/learn.swf" height="300" width="800" />
  <button label="open another" onClick='
    flashComp.setWidth("200px"); 
    flashComp.setHeight("70px"); 
    flashComp.setSrc("http://www.tizag.com/pics/example.swf"); 
    flashComp.invalidate();' />
</zk>

Robert

answered 2014-09-29 06:26:53 +0800

cor3000
6280 ● 2 ● 7

updated 2014-09-29 06:36:23 +0800

You can create a custom "mold" to have direct control over the generated markup, before it is parsed into dom nodes.

The mold could look like this, adding the missing param/attribute added to a folder in your classpath

/web/flashFul.js based on zul.jar:/web/js/zul/med/mold/flash.src.js

function (out) {
    out.push('<div', this.domAttrs_({width:true,height:true}),
        '><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=',
        this._version, '" width="', this._width||'', '" height="', this._height||'',
        '"><param name="movie" value="', this._src,
        '"></param><param name="wmode" value="', this._wmode,
        '"></param><param name="quality" value="', this._quality,
        '"></param><param name="autoplay" value="', this._autoplay,
        '"></param><param name="allowFullScreen" value="', true,
        '"></param><param name="loop" value="', this._loop,
        '"></param>');

    var bgc;
    if (bgc = this._bgcolor)
        out.push('<param name="bgcolor" value="', bgc, '"></param>'); // ZK-740

    out.push('<embed id="', this.uuid, '-emb" src="', this._src,
        '" type="application/x-shockwave-flash" wmode="', this._wmode,
        '" quality="', this._quality,
        '" autoplay="', this._autoplay,
        '" allowFullScreen="', true,
        '" loop="', this._loop,
        '" width="', this._width||'', '" height="', this._height||'',
        '"');

    if (bgc) out.push(' bgcolor="', bgc, '"');

    out.push('></embed></object></div>');
}

the flash component can be configured in a /WEB-INF/lang-addon.xml

<language-addon>
    <addon-name>mb-technik-addons</addon-name>
    <language-name>xul/html</language-name>
    <component>
        <component-name>flash</component-name>
        <extends>flash</extends>
        <mold>
            <mold-name>full</mold-name>
            <mold-uri>~./flashFull.js</mold-uri><!-- ~./ will load from the package folder "/web" -->
        </mold>
    </component>
</language-addon>

the langguage addon is enabled in the zk.xml (see)

  <language-config>
    <addon-uri>/forum/flash/lang-addon.xml</addon-uri>
  </language-config>

the your zul file can use the new mold:

<zk xmlns:w="client">
    <flash id="flashComp" mold="full" src="sampleMx.swf" height="300" width="800">
    </flash>
</zk>

I used the file sampleMx.swf of this flash fullscreen example

here my successful test

Robert

answered 2014-09-20 10:25:17 +0800

Darksu
1991 ● 1 ● 4

Hello sherwin,

The following url provides information on using zk with flash:

http://books.zkoss.org/wiki/SmallTalks/2008/June/EmbeddingFlashintoZK_applications.

From the url i found the following example very interesting, and probably will solve your issue:

<?xml version="1.0" encoding="utf-8"?>
<window id="window" title="ZK Flash Instrument" style="width:100%"
    border="normal">
    <zscript>
        int instrumentValue=0; int instrumentMax = 100; String
        showGlasBorder="false";

        public void changeValue(aValue) { instrumentValue = aValue;
        slider.setCurpos( instrumentValue ); drawGlas(); } public void
        setInstrumentBorder() { showGlasBorder=
        (instrumentCheckbox.isChecked()).toString(); drawGlas(); }
        public drawGlas() { String url =
        "Glas.swf?currentValue="+instrumentValue+"&amp;border="+showGlasBorder+"&amp;
        min=0&amp;lo=10&amp;li=20&amp;hi=80&amp;ho=90&amp;max=100";
        myInstrument.src = url; }

        void zoom(Slider slider) { changeValue( event.getPos() ); }
    </zscript>

    <hbox>
        <flash id="myInstrument"
            src="Glas.swf?currentValue=0&amp;min=0&amp;lo=10&amp;li=20&amp;hi=80&amp;ho=90&
            amp;max=100"
            width="128" height="128" />
    </hbox>
    <vbox>
        <label value="Fill glas:" />
        <slider id="slider" onScroll="zoom(slider)" />
        <checkbox id="instrumentCheckbox" label="Show Borders on Glas"
            onCheck="setInstrumentBorder()" />
    </vbox>
</window>

Best Regards,

Darksu