Revision history [back]

click to hide/show revision 1
initial version

answered 2014-07-17 12:52:55 +0800

terrytornado gravatar image terrytornado flag of Germany

http://www.oxitec.de/

Therefore ZK offers the onClientInfo event.

It must be placed on the 'root' window. Means the absolut outer window component in your application.

As an easy usage you can react in this event and store the sizes in the session or better in desktop scope attributes.

This is code for a MVVM.

/**
 * Reacts on browser resize and stores the desktop height and width.
 */
@Command()
public void updateClientInfo(@BindingParam("orientation") String _orientation, @BindingParam("width") int _width,
        @BindingParam("height") int _height) {

    // for access the values by new creation of a page/window. Means if NO
    // resize is fired.
    this.windowOuterMain.getDesktop().setAttribute("desktopHeight", _height);
    this.windowOuterMain.getDesktop().setAttribute("desktopWidth", _width);
    this.windowOuterMain.getDesktop().setAttribute("deviceOrientation", _orientation);

    /**
     * Notify all who listen with global command.
     */
    Map<String, Object> map = new HashMap<String, Object>();
    map.put("desktopHeight", _height);
    map.put("desktopWidth", _width);
    map.put("deviceOrientation", _orientation);
    BindUtils.postGlobalCommand(null, EventQueues.DESKTOP, "onDesktopResize", map);
}

int width = myComponent.getDesktop().getAttribute("desktopWidth");

best Stephan

Therefore ZK offers the onClientInfo event.

It must be placed on the 'root' window. Means the absolut outer window component in your application.

As an easy usage you can react in this event and store the sizes in the session or better in desktop scope attributes.

This is code for a MVVM.

/**
 * Reacts on browser resize and stores the desktop height and width.
 */
@Command()
public void updateClientInfo(@BindingParam("orientation") String _orientation, @BindingParam("width") int _width,
        @BindingParam("height") int _height) {
 

// for access the values by new creation of a page/window. Means if NO // resize is fired. fired we can get the sizes from the attribute that is // stored in the desktop scoped. this.windowOuterMain.getDesktop().setAttribute("desktopHeight", _height); this.windowOuterMain.getDesktop().setAttribute("desktopWidth", _width); this.windowOuterMain.getDesktop().setAttribute("deviceOrientation", _orientation); _orientation);

    /**
     * Notify all who listen with global command.
     */
    Map<String, Object> map = new HashMap<String, Object>();
    map.put("desktopHeight", _height);
    map.put("desktopWidth", _width);
    map.put("deviceOrientation", _orientation);
    BindUtils.postGlobalCommand(null, EventQueues.DESKTOP, "onDesktopResize", map);
}

zul:

. . .
<window id="windowOuterMain" width="100%" height="100%" border="none" sclass="outerwin"
        onClientInfo="@command('updateClientInfo', width=event.desktopWidth, height=event.desktopHeight, orientation=event.orientation)"
        apply="org.zkoss.bind.BindComposer" viewModel="@id('vm') @init('de.oxitec.zkboost.web.base.mainlayout.OXMainLayoutVM')">
. . .

int width = myComponent.getDesktop().getAttribute("desktopWidth");

best Stephan

Therefore ZK offers the onClientInfo event.

It must be placed on the 'root' window. Means the absolut outer window component in your application.

As an easy usage you can react in this event and store the sizes in the session or better in desktop scope attributes.attributes or fire an @GlobalCommand to all who will listen for that.

This is code for a MVVM.

/**
 * Reacts on browser resize and stores the desktop height and width.
 */
@Command()
public void updateClientInfo(@BindingParam("orientation") String _orientation, @BindingParam("width") int _width,
        @BindingParam("height") int _height) {

// for access the values by new creation of a page/window. Means if NO // resize is fired we can get the sizes from the attribute that is // stored in the desktop scoped. this.windowOuterMain.getDesktop().setAttribute("desktopHeight", _height); this.windowOuterMain.getDesktop().setAttribute("desktopWidth", _width); this.windowOuterMain.getDesktop().setAttribute("deviceOrientation", _orientation);

    /**
     * Notify all who listen with global command.
     */
    Map<String, Object> map = new HashMap<String, Object>();
    map.put("desktopHeight", _height);
    map.put("desktopWidth", _width);
    map.put("deviceOrientation", _orientation);
    BindUtils.postGlobalCommand(null, EventQueues.DESKTOP, "onDesktopResize", map);
}

zul:

. . .
<window id="windowOuterMain" width="100%" height="100%" border="none" sclass="outerwin"
        onClientInfo="@command('updateClientInfo', width=event.desktopWidth, height=event.desktopHeight, orientation=event.orientation)"
        apply="org.zkoss.bind.BindComposer" viewModel="@id('vm') @init('de.oxitec.zkboost.web.base.mainlayout.OXMainLayoutVM')">
. . .

int width = myComponent.getDesktop().getAttribute("desktopWidth");

best Stephan

Support Options
  • Email Support
  • Training
  • Consulting
  • Outsourcing
Learn More