1. 程式人生 > >ZK 使用者介面標記語言初理解

ZK 使用者介面標記語言初理解

      ZK 使用者介面標記語言(ZUML)是基於XML的,每一個XML元素描述了要建立的元件.一個XML屬性描述了被建立元件的初始值,一個XML處理指令(processing instruction),如頁面的標題.

 

      不同的元件集通過XML命令空間來區分. 例如,XML的名稱空間為

xmlns:z="http://www.zkoss.org/2005/zul"

      而XHTML的名稱空間為

<html xmlns="http://www.w3.org/1999/xhtml"> 

那  XML和HTML的有什麼區別?

(一)、語法要求不同:

1. 在html中不區分大小寫,在xml中嚴格區分。

2. 在HTML中,有時不嚴格,如果上下文清楚地顯示出段落或者列表鍵在何處結尾,那麼你可以省略</p>或者</li>之類的結束標記。在XML中,是嚴格的樹狀結構,絕對不能省略掉結束標記。

3. 在XML中,擁有單個標記而沒有匹配的結束標記的元素必須用一個/ 字元作為結尾。這樣分析器就知道不用查詢結束標記了。

4. 在XML中,屬性值必須分裝在引號中。在HTML中,引號是可用可不用的。 

5. 在HTML中,可以擁有不帶值的屬性名。在XML中,所有的屬性都必須帶有相應的值。 

6. 在XML文件中,空白部分不會被解析器自動刪除;但是html是過濾掉空格的。

(二)、標記不同:

1、html使用固有的標記;而xml沒有固有的標記。

2、Html標籤是預定義的;XML標籤是免費的、自定義的、可擴充套件的。

(三)、作用不同:

1. html是用來顯示資料的;xml是用來描述資料、存放資料的,所以可以作為持久化的介質!Html將資料和顯示結合在一起,在頁面中把這資料顯示出來;xml

則將資料和顯示分開。 XML被設計用來描述資料,其焦點是資料的內容。HTML被設計用來顯示資料,其焦點是資料的外觀。

2. xml不是HTML的替代品,xml和html是兩種不同用途的語言。 XML 不是要替換 HTML;實際上XML 可以視作對 HTML 的補充。XML 和HTML 的目標不同HTML 的設計目標是顯示資料並集中於資料外觀,而XML的設計目標是描述資料並集中於資料的內容。

3. 沒有任何行為的XML。與HTML 相似,XML 不進行任何操作。(共同點)

4. 對於XML最好的形容可能是: XML是一種跨平臺的,與軟、硬體無關的,處理與傳輸資訊的工具。

5. XML未來將會無所不在。XML將成為最普遍的資料處理和資料傳輸的工具。

 

我們在使用ZK的過程中需要注意一下幾點

① 元素必須格式良好

   首先,每個元素必須關閉.有倆種元素來關閉一元素,像下面描述一樣,他們是等價的

<window></window> 通過一個結束標籤來關閉元素
<window /> 不通過關閉元素來關閉元素


然後就是要注意,元素要被正確的巢狀(nested).

    

<z:listitem>
    <z:listcell>
     </z:listcell>
</z:listitem>
正確

<z:listitem>
    <z:listcell>
</z:listitem>

  </z:listcell>

錯誤

 

②特殊字元必須被替換掉

XML使用<element - name>來表示一個元素,所以你必須替換特殊字元.
 

特殊字元 替換字元
< &lt;
> &gt;
& &amp;
" &quot;
'' &apos;

 

③屬性值必須被引號("")包括

 

程式碼 結果
<z:intbox id="num" style="display:none"/>
正確的
<z:intbox  id=num  style=display:none /> 錯誤的

 

④字元編碼

   儘管是可選的,但在你的XML中指定編碼是個好主意,這樣XML解析器可以正確的解析文字.(注意:他必須放置在檔案的第一行)

<?xml version="1.0" encoding="UTF-8"?>

⑤名稱空間

名稱空間是區分XML文件中用到名字的一個簡單易懂的方法,ZK使用XML名稱空間來區分元件名稱,這樣,只要不在同一個名稱空間,倆個元件有相同的名字是可以的.ZK使用XML名稱空間來表示一個元件集.這樣,開發人員可以在同一頁面內混合使用倆個或者多個元件集,如下

 

<html xmlns:="http://www.w3.org/1999/xhtml" 
 xmlns:x="http://www.zkoss.org/2005/zul" 
xmlns:zk="http://www.zkoss.org/2005/zk"> 
<head> 
<title>ZHTMLDemo</title> 
</head>
 <body>     
<h1>ZHTML Demo</h1>    
<table>   
 <tr>       
<td><x:textbox/></td>       
 <td>
<x:button label="Now" zk:onClick="addItem()"/>
</td>  
  </tr>   
 </table>    
<zk:zscript>    
void addItem() {    }   
 </zk:zscript>
 </body> 
</html> 

 

 

⑥使用Schema 自動完成

許多IDE, 如Eclipse 支援自動完成,如果XML schema 被按如下方式指定.

<window xmlns="http://www.zkoss.org/2005/zul" 
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.zkoss.org/2005/zul 
http://www.zkoss.org/2005/zul/zul.xsd"> 

 

⑦ZK頁面的註釋