Tags
People
Badges
Help-
CORE FRAMEWORK
FEATURED COMPONENTS
-
RESOURCES
-
LEARN ZK
RESOURCES
Hello everyone!
I need a help with a width change issue. I change the width of the groupbox in the btn onClick event, but the listbox inside of the groupbox don't resize, so a part is cutted.
I did a fiddle, but I won't be able to publis, the name is: Hflex issue on the change.
Here is the .ZUL
<zk>
<window border="normal" title="hello" apply="pkg$.TestComposer">
<groupbox id="grpbx" width="750px">
<caption label="Groupbox" style="color:#006699; font-weight: bold" />
<listbox height="213px" hflex="1">
<listhead>
<listheader width="30px"/>
<listheader label="test" width="100px"/>
<listheader width="120px" />
<listheader width="170px" />
<listheader width="125px" />
<listheader width="90px" />
<listheader width="90px" />
</listhead>
<listitem>
<listcell label="foo"/>
<listcell label="foo"/>
<listcell label="foo"/>
<listcell label="foo"/>
<listcell label="foo"/>
<listcell label="foo"/>
<listcell label="foo"/>
</listitem>
</listbox>
</groupbox>
<button id="btn" label="Click me to see the error" />
</window> </zk>
Here is the .JAVA
import org.zkoss.zk.ui.*;
import org.zkoss.zk.ui.event.*;
import org.zkoss.zk.ui.util.*;
import org.zkoss.zk.ui.ext.*;
import org.zkoss.zk.au.*;
import org.zkoss.zk.au.out.*;
import org.zkoss.zul.*;
public class TestComposer extends GenericForwardComposer{
private Groupbox grpbx;
private boolean bool = true;
public void doAfterCompose(Component comp) throws Exception {
super.doAfterCompose(comp);
}
public void onClick$btn(Event e) throws InterruptedException{
if (bool == true) {
grpbx.setWidth("650px");
} else {
grpbx.setWidth("750px");
}
bool = !bool;
}
}
Thanks in advance!
Hello caiofilipemr,
You have to use percentages instead of fixed pixels for it to work properly (dont forget parent-child relations for percentages).
Also you can use sizedByContent="true" for auto setting the column sizes.
Best Regards,
Darksu
Thanks for the answer Darksu, but I don't get it, I tried to do this: <groupbox id="grpbx" width="50%">, <listbox height="213px" width="100%"> and
public void onClick$btn(Event e) throws InterruptedException{
if (bool == true) {
grpbx.setWidth("50%");
} else {
grpbx.setWidth("35%");
}
bool = !bool;
}
What am I doing wrong ?
UPDATE: In the first example, if I close and then open the groupbox the listbox resize and fit correctly.
I figured out! I don't know if is the best way neither if is the right way, but works fine for me. I add this line grpbx.invalidate() in
public void onClick$btn(Event e) throws InterruptedException{
if (bool == true) {
grpbx.setWidth("650px");
} else {
grpbx.setWidth("750px");
}
grpbx.invalidate(); //here
bool = !bool;
}
I hope this helps someone. The fiddle is 4-Hflex-issue-on-the-change. I can't post links yet.
Asked: 2016-05-06 18:29:25 +0800
Seen: 26 times
Last updated: May 10 '16