Grid RowRender slow using 6.5.1 and sizable=true

asked 2013-03-06 10:07:07 +0800

This post is a wiki. Anyone with karma >100 is welcome to improve it.

updated 2013-03-07 11:00:27 +0800

claudioveryant
9 ● 1

In ZK3.6.4EE I have a grid that when I resize the column the textbox (or textboxes) get the same width of the columns. This work well in the 3.6.4 (see the mygrid3). In the ZK6.5.1EE when I resize a column I wait 4 seconds before to see the column resized. Sorry for long sample that I have added.

<zk>
   <vbox>
   <separator/>
   <label value="To have the texbox width = column size:" />
   <separator/>
   <label value="Slow render if resize a column using ZK6.5.1_EE and Cell" />
   <borderlayout width="400px" height="100px" >
      <center flex="true">
         <grid id="mygrid">
            <columns sizable="true">
                <column label="A"  width="30px" />
                <column label="B"  width="40px"/>
                <column label="C"  width="60px"/>
                <column label="D"  width="80px"/>
                <column label="E"  width="40px"/>
            </columns>
         </grid>
      </center>
   </borderlayout>
   <separator/>
   <label value="Slow render if resize a column using ZK6.5.1_EE using Div Hbox hflex=1" />
   <borderlayout width="400px" height="100px" >
      <center flex="true">
         <grid id="mygrid1">
            <columns sizable="true">
                <column label="A"  width="30px" />
                <column label="B"  width="40px"/>
                <column label="C"  width="60px"/>
                <column label="D"  width="80px"/>
                <column label="E"  width="40px"/>
            </columns>
         </grid>
      </center>
   </borderlayout>
   <separator/>
   <label value="Slow render if resize a column using ZK6.5.1_EE Div Hbox width=100%" />
   <label value="but fast using ZK3.6.4_EE" />
   <borderlayout width="400px" height="100px" >
      <center flex="true">
         <grid id="mygrid2">
            <columns sizable="true">
                <column label="A"  width="30px" />
                <column label="B"  width="40px"/>
                <column label="C"  width="60px"/>
                <column label="D"  width="80px"/>
                <column label="E"  width="40px"/>
            </columns>
         </grid>
      </center>
   </borderlayout>
   </vbox>
   <zscript><![CDATA[

  import org.zkoss.zul.Row;
  import org.zkoss.zul.RowRenderer;

  String[][] model = new String[1000][5]; 

  public class MyRowRenderer implements RowRenderer { 
     Vector righe = new Vector();
     int idx = -1;
     public MyRowRenderer (int idx) { 
        this.idx = idx;
        for(int j = 0; j < model.length; ++j)
           righe.add(model[j]);
     }
     public void render(Row row, java.lang.Object data) {
        for (int i = 0; i < data.length; i++) {
           switch (idx) {
           case 1:
              renderSlowZK651(row);
              break;
           case 2:
              renderSlowZK651_2(row);
              break;
           case 3:
              renderSlowZK651_butFastZK364(row);
              break;
           }
        }
     }
     private void renderSlowZK651(Row row) {
        Cell hb = null;
        Textbox tb = null;
        hb = new Cell();
        tb = new Textbox();
        tb.setStyle("border:solid green");
        tb.setParent(hb);
        hb.setParent(row);
        hb.setHflex("1");
        tb.setHflex("1");
     }
     private void renderSlowZK651_2(Row row) {
        Div dv = new Div();
        Hbox hb = new Hbox();
        Textbox ll = new Textbox();
        hb.setHflex("1");
        dv.setHflex("1");
        ll.setHflex("1");
        ll.setParent(hb);
        ll.setStyle("border:solid red");
        hb.setParent(dv);
        dv.setParent(row);
     }
     private void renderSlowZK651_butFastZK364(Row row) {
        Div dv = new Div();
        Hbox hb = new Hbox();
        Textbox ll = new Textbox();
        ll.setParent(hb);
        ll.setStyle("border:solid blue");
        ll.setWidth("100%");
        hb.setWidth("100%");
        dv.setWidth("100%");
        hb.setParent(dv);
        dv.setParent(row);
     }
  }
  mygrid.setModel(new SimpleListModel(model)); 
  mygrid.setRowRenderer(new MyRowRenderer(1));    
  mygrid1.setModel(new SimpleListModel(model)); 
  mygrid1.setRowRenderer(new MyRowRenderer(2));    
  mygrid2.setModel(new SimpleListModel(model)); 
  mygrid2.setRowRenderer(new MyRowRenderer(3));    
      ]]>
   </zscript>
</zk>

Thank for your help.

Claudio