ZK學習研究（二）

　　書接上回，前面說了那麼多，到底ZK有啥好處呢？這個就只可意會不可言傳了，呵呵。

　　舉個例子，假設有個列表須要顯示，在頁面中能夠使用table或者是ul li來實現，table的代碼以下：

<table cellspacing= "0" cellpadding= "0" width= "90%" border= "0" class= "table_cont">
  <tbody>
<%
     //判斷列表是否爲空
     if(activeList== null || activeList.isEmpty() || activeList.size()<1)
    {
       //爲空，顯示提示信息
      out.print( "<tr><td colspan=\"4\" style=\"width:400px;\">目前 "+strProvinceName+ " 尚未活動</td></tr>");
    }
     else
    {
       //不爲空，顯示列表內容
      out.println( "<tr>\n<th style=\"width:40%;\">名稱</th><th style=\"width:30%;\">活動日期</th><th style=\"width:10%;\">狀態</th><th style=\"width:20%;\">操做</th>\n</tr>");
      Iterator<Active> iter = activeList.iterator();
      Active active = null;
       while(iter.hasNext())
      {
        active = (Active)iter.next();
        out.println( "<tr>");
        out.print( "<td style=\"width:40%;\">"+active.getTitle()+ "</td>");
         if(active.getCreateDt()!= null)
        {
          out.print( "<td style=\"width:30%;\">"+active.getCreateDt().toString().substring(0,10)+ "</td>");
        }
         else
        {
          out.print( "<td style=\"width:10%;\"> </td>");
        }
         if(active.getStatus()==1)
        {
          out.print( "<td>上線</td>");
        }
         else if(active.getStatus()==2)
        {
          out.print( "<td>下線</td>");
        }
        out.print( "<td style=\"width:20%;\"><a href=\"activeUpdate.jsp?province="+province+ "&activeId="+active.getId()+ "\">修改</a>  ");
        out.print( "<a href=\"activeDel.jsp?province="+province+ "&activeId="+active.getId()+ "\">刪除</a></td>");
        out.println( "</tr>");
      }
    }
%>
  </tbody>
</table>

　　效果圖以下：

　　能夠看出其中有一些的判斷，而後還要擔憂「<%」和「%>」是否匹配，「{」和「}」是否匹配等等狀況。若是是ZK的話，這些沒必要要的擔憂就能夠省去了。

　　頁面（list.zul）代碼：

<? xml version ="1.0" encoding ="UTF-8" ?>
<? page title ="列表" contentType ="text/html;charset=UTF-8" ?>
< zk >
< window style ="heigth:100%; border:0; text-align:center;" id ="winList" >
   < style src ="../styles/global.css" > </ style >
   < div style ="padding-top:20px; vertical-align:bottom;" >
     < label value ="列表" /> < separator />
   </ div >
   < div style ="padding:0px 0px 0px 0px;text-align:center;width:80%;" >
     < label id ="lblTips" visible ="false" style ="color:#FF0000;" />
     < listbox id ="blacklistList" style ="width:100%;" >
       < listhead style ="text-align:center;" >
         < listheader label ="用戶號碼" style ="width:15%;" />
         < listheader label ="用戶類別" style ="width:15%;" />
         < listheader label ="說明" style ="width:35%;" />
         < listheader label ="添加日期" style ="width:15%;" />
         < listheader label ="操做" style ="width:20%;" />
       </ listhead >
     </ listbox >
   </ div >
   < zscript language ="Java" >
    <![CDATA[
             import com.zk.list;
             list ui = new list();
             ui.setWinMain(winlList);
             ui.showAllBlacklist();
    ]]>
   </ zscript >
</ window >
</ zk >

　　邏輯處理代碼（list.java）：

public void showAllBlacklist()
{
   try
  {
     // 獲得列表
    BlacklistIF blacklistIf = ServiceLocator.getBlacklistIF();
    List<Blacklist> blacklistList = blacklistIf.findAllBlacklist(-1);
    
     // 判斷列表是否爲空
     if(blacklistList.size()>0 && !blacklistList.isEmpty())
    {
       this.showList(blacklistList);
    }
  }
   catch(Exception ex)
  {
    ex.printStackTrace();
  }
}

private void showList(List<Blacklist> blacklistList)
{
   // 獲得列表組件，用於顯示羣發安排列表
  Listbox listbox = (Listbox)winMain.getFellow( "blacklistList");
    
   // 列表的行組件
  Listitem listitem = new Listitem();
    
   // 列表的列組件
  Listcell listcell = new Listcell();
    
   for( int i=0;i<blacklistList.size();i++)
  {
     // 用戶號碼
    listcell.setLabel(blacklistList.get(i).getMobile());
    listitem.appendChild(listcell);
    
     // 用戶類別
    listcell = new Listcell();
     switch(blacklistList.get(i).getType())
    {
       case 1:
        listcell.setLabel( "黑名單");
         break;
       case 2:
        listcell.setLabel( "黃名單");
         break;
       case 3:
        listcell.setLabel( "綠名單");
         break;
       case 4:
        listcell.setLabel( "非彩信用戶");
         break;
    }
    listitem.appendChild(listcell);
    
     // 說明
    listcell = new Listcell();
     if(blacklistList.get(i).getDescription().equals(""))
    {
      listcell.setLabel( "暫無");
    }
     else
    {
      listcell.setLabel(blacklistList.get(i).getDescription());
    }
    listitem.appendChild(listcell);
    
     // 添加日期
    listcell = new Listcell();
    listcell.setLabel(blacklistList.get(i).getCreateDate().toString().substring(0,10));
    listitem.appendChild(listcell);
    
     // 顯示操做按鈕
    Hbox hbox = new Hbox();
    
     // 彩信產品的id，添加事件監聽時要用final修飾的變量
     final int id = Integer.parseInt(blacklistList.get(i).getId().toString().trim());
     // 添加一個查看按鈕
    Button button = new Button();
    button.setLabel( "查看");
     // 爲查看按鈕添加一個
    button.addEventListener(Events.ON_CLICK, new EventListener()
    {
       public void onEvent(Event arg0) throws Exception {
        showBlacklistDetail(String.valueOf(id));
      }
    });
    button.setVisible( false);
    hbox.appendChild(button);
    
     // 添加一個刪除按鈕
    button = new Button();
    button.setLabel( "刪除");
     // 爲刪除按鈕添加一個
    button.addEventListener(Events.ON_CLICK, new EventListener()
    {
       public void onEvent(Event arg0) throws Exception {
        delBlacklist(String.valueOf(id));
      }
    });
    hbox.appendChild(button);
    
    listcell = new Listcell();
    listcell.appendChild(hbox);
    listitem.appendChild(listcell);
    
     // 將當前行在列表中顯示
    listbox.appendChild(listitem);
    
    listitem = new Listitem();
    listcell = new Listcell();
  }
}

　　效果圖以下：

　　能夠看到，這樣就達到了邏輯處理和頁面顯示的代碼分離，使得頁面顯示的代碼更加清晰，而邏輯處理類的做用也更加明顯。