BorderLayout, setOpen by code not fire onopen event?

answered 2013-08-19 11:04:15 +0800

tizios
3

Thanks for your concern, I am currently using zk CE ver. 6.5.2

This is my .zul :

<?page title="Auto Generated index.zul"?>
<zk>
<div id="mainLayout" apply="code.IndexController" hflex="1" vflex="1">
    <borderlayout>
        <north style="background-color:#ababab">
            <div>TITLE</div>
        </north>
        <west id="layoutWest" collapsible="true" width="300px">
            <tree id="treeMain">
                <treecols>
                    <treecol label="Items" />
                </treecols>
                <treechildren>
                    <treeitem label="itm 1" />
                    <treeitem label="itm 2" />
                    <treeitem label="itm 3" />
                </treechildren>
            </tree>
        </west>
        <center style="border:0">
            <div style="padding:30px">
                Press CTRL+M to open/close the West zone.
                <separator/>
                After the onOpen if you press the Arrow-Down (for move down on the next row)
                The selected row will not change, it seems that the focus is not on the tree ... 
            </div>
        </center>
    </borderlayout>
</div>
</zk>

And this is my class code.IndexController :

package code;

import org.zkoss.zk.ui.Component;
import org.zkoss.zk.ui.event.EventListener;
import org.zkoss.zk.ui.event.Events;
import org.zkoss.zk.ui.event.KeyEvent;
import org.zkoss.zk.ui.select.SelectorComposer;
import org.zkoss.zk.ui.select.annotation.Listen;
import org.zkoss.zk.ui.select.annotation.Wire;
import org.zkoss.zul.Div;
import org.zkoss.zul.Tree;
import org.zkoss.zul.West;

public class IndexController extends SelectorComposer<Component> {
    private static final long serialVersionUID = -4800231356684164268L;

    @Wire Div mainLayout;
    @Wire West layoutWest;
    @Wire Tree treeMain;

    @Override
    public void doAfterCompose(Component comp) throws Exception {
        super.doAfterCompose(comp);

        mainLayout.setCtrlKeys("^M");
        mainLayout.addEventListener(Events.ON_CTRL_KEY, new EventListener<KeyEvent>() {
            @Override
            public void onEvent(KeyEvent event) throws Exception {

                if (event.getKeyCode() == (byte)'M' && event.isCtrlKey()) 
                layoutWest.setOpen(!layoutWest.isOpen());

            event.stopPropagation();
            }
        });
    }

    @Listen(Events.ON_OPEN+"=#layoutWest")
    public void onOpenMenuLeft() {
        if (layoutWest.isOpen())
            treeMain.focus();  //  first  content control of the BorderLayout West component.
    }

}

Basically I would like after the opening of the West, the focus went to the tree so that pressing the arrow keys up / down I can move using the keyboard, not to force the user to use the mouse.

Thanks