Zk borderlayout resize event

I am creating an ERP in Java using Zk. I am creating the whole website from java instead of using .zul files. What I need is to listen to an onResize event for when the BorderLayout is dragged by the user. I need to save the new width value in the database.

I have tried with setting the setSlide(true) and listening to the ON_SLIDE event but that doesn't seem to work. And neither did other events. My BorderLayout consists of a fixed north, a west that has the bar, and a center. I only need to listen to the west.

DesktopLayout.getWest().addEventListener(Events.ON_SLIDE, this)


onEvent(Event event) {
    if(Events.ON_SLIDE.equals(event.getName())){
        System.out.println("The slider has been moved");
    }
}

Solution

ON_SLIDE might not be the right event for your use case. It triggers when using the slide in feature of the borderlayout region, but not on click-and-drag resize.

For click-and-drag resize, the easiest option would on ON_SIZE, with a hflex (or vflex for vertical sizing) attribute on the target region. The trick here is that when you resize with the drag bar, you actually resize the "BorderLayout Children Container", so you need to tell the Region (West, Center, etc) to also size up to its direct parent, hence hflex.

See here for a code sample. It use a zul file as initiator, but the page is build in Java from the composer.

Drag-n-drop the bar for slide, and click the center button of the bar to collapse the West panel. when collapse, click anywhere EXCEPT the arrow to slide the component open and trigger onSlide.

https://zkfiddle.org/sample/31dt63d/2-Borderlayout-region-sizing