第12章 XSL-FO格式化輸出PDF 12-1 XSL-FO的基礎 12-2 XSL-FO的文件架構 12-3 XSL-FO的頁面範本

Presentation on theme: "第12章 XSL-FO格式化輸出PDF 12-1 XSL-FO的基礎 12-2 XSL-FO的文件架構 12-3 XSL-FO的頁面範本"— Presentation transcript:

1 第12章 XSL-FO格式化輸出PDF 12-1 XSL-FO的基礎 12-2 XSL-FO的文件架構 12-3 XSL-FO的頁面範本
12-8 應用實例：XSL-FO與XSLT

2 12-1 XSL-FO的基礎 什麼是XSL-FO 如何從XML文件產生PDF文件 XSL-FO工具與引擎

3 什麼是XSL-FO XSL-FO(Extensible Stylesheet Language Formatting Objects)是一種XML語法的語言來格式化XML資料，在2001年10月15日成為W3C的建議規格。 XSL-FO語言可以視為XML預設的樣式語言XSL(Extensible Stylesheet Language)，標準的樣式語言包含轉換和格式化資料的功能，簡單的說，XSL包含轉換和格式化XML文件的語法。在2000年11月W3C工作小組將XSL分成三種建議規格，如下所示： XSLT：轉換XML文件的語言。 XPath：查詢XML文件中的部分資料。 XSL-FO：格式化XML文件的語言。

4 如何從XML文件產生PDF文件-1 在實作上，我們並不會直接建立XSL-FO文件，而是透過XSLT Script將XML文件轉換成XSL-FO，然後格式輸出成PDF檔案，如下圖所示：

5 如何從XML文件產生PDF文件-2 將XML文件轉換成PDF的步驟，如下所示： 步驟一：XML+XSLT轉換成XSL-FO
第一步是將XML文件內容轉換成XSL-FO文件，我們可以使用XSLT Script將XML文件透過XSLT處理器轉換成XSL-FO文件。 步驟二：XSL-FO格式化成PDF 當轉換成XSL-FO文件後，可以使用XSL-FO引擎(Formatting Engine)格式化輸出成PDF檔案格式。

6 XSL-FO工具與引擎 XSL-FO Debugger是Altsoft公司的免費XSL除錯工具，屬於.NET Framework平台的應用程式，它是使用Altsoft的Xml2PDF格式化引擎來將XSL-FO文件或是XML和XSLT Script轉換輸出成PDF檔案。

7 12-2 XSL-FO的文件架構 第一份XSL-FO文件 XSL-FO格式模型

8 第一份XSL-FO文件-1 XSL-FO文件的副檔名為.fo或.fob，或是和XML文件相同的.xml，在本章是使用.fo副檔名。XSL-FO文件的根標籤是<fo:root>，在根標籤宣告名稱空間字首fo，XSL-FO預設的URI，如下所示：

9 第一份XSL-FO文件-2 <?xml version="1.0" encoding="UTF-8"?>
<fo:root xmlns:fo=" <fo:layout-master-set> <fo:simple-page-master master-name="page1"…>………… </fo:simple-page-master> <fo:simple-page-master master-name="page2"…>……… <fo:page-sequence-master> ……… </fo:page-sequence-master> </fo:layout-master-set>

10 第一份XSL-FO文件-3 <fo:page-sequence master-reference="page1">
<fo:title>………</fo:title> <fo:static-content…>…</fo:static-content> <fo:flow…>………</fo:flow> </fo:page-sequence> <fo:page-sequence master-reference="page2"> </fo:root>

11 第一份XSL-FO文件-4 fo:layout-master-set元素：定義頁面範本的版型，每一個fo:simple-page-master子元素可以定義一個頁面的尺寸和邊界等版面配置資訊，以此例是名為page1和page2兩頁頁面範本。對於多頁面範本，我們需要使用fo:page-sequence-master子元素定義各頁面範本出現的順序和次數。 fo:page-sequence元素：使用master-reference屬性對應指定的頁面範本名稱，其內容就是此頁顯示的內容，內含fo:title、fo:static-content和fo:flow子元素，分別顯示標題、固定內容和頁面內容。

12 第一份XSL-FO文件-5 XSL-FO的格式物件
在XSL-FO文件的元素就是XSL-FO的「格式物件」(Formatting Objects)，其樹狀結構如下圖所示：

13 XSL-FO格式模型-1 XSL-FO格式模型(XSL Formatting Model)是由長方形的地區（Areas）組成，XSL-FO引擎將輸出內容的文字、空白字元、圖形和其它格式物件格式編排進入這些地區，如下圖所示：

14 XSL-FO格式模型-2 區域地區(Region Area)：在每一個XSL-FO頁面包含5個區域，相當於Word文件的頁首、本文和頁尾部分。XSL-FO定義區域的格式物件為fo:region-body、fo:region-before、fo:region-after、fo:region-start和fo:region-end。 區塊地區(Block Area)：在XSL-FO的區域包含區塊，在區塊之中可以擁有其它區塊，每一個區塊是使用斷行符號來分割，我們可以將區塊視為是一個段落、表格或清單。XSL-FO定義區塊的格式物件有fo:block、fo:table和fo:list-block。

15 XSL-FO格式模型-3 行地區(Line Area)：行代表區塊中的一行，例如：清單中的每一個項目就是行地區，XSL-FO並沒有對應的格式物件，其目的主要是讓XSL-FO引擎能夠計算區塊中行地區的大小，以便在區塊中正確的換行。 行內地區(Inline Area)：行內地區是位在行地區之內，例如：一個字、片語和公式等。在XSL-FO可以定義行內地區的格式物件有fo:inline、fo:external-graphic、fo:leader和fo:page-number等。

16 12-3 XSL-FO的頁面範本 簡單頁面範本 頁面區域範本

17 簡單頁面範本-1 XSL-FO的簡單頁面範本是fo:simple-page-master格式物件，這是fo:layout-master-set的子元素，可以使用fo:simple-page-master定義頁面範本。 在XSL-FO 1.0版只定義一種簡單頁面範本，也就是一頁長方形的頁面，如下所示： <fo:simple-page-master master-name="myPage" page-width="8.5in" page-height="11in" margin-top="20pt" margin-bottom="20pt" margin-left="50pt" margin-right="50pt"> <fo:region-body region-name="region-body" margin-bottom="25pt" margin-top="250pt"/> </fo:simple-page-master>

18 簡單頁面範本-2 以此例，我們定義一頁8.5in X 11in大小的頁面，上下邊界20pt，左右邊界50pt的長方形地區，如下圖所示：

19 簡單頁面範本-3 fo:simple-page-master元素常用的屬性說明，如下表所示：

20 頁面區域範本-1 在XSL-FO的頁面共分為上、下、左、右和中間五個區域，如下圖所示：

21 頁面區域範本-2 5個區域的格式物件名稱都是fo:simple-page-master的子元素，如下所示：
<fo:region-before region-name="region-before" extent="25pt"/> <fo:region-after region-name="region-after" extent="25pt"/> <fo:region-body region-name="region-body" margin-bottom="25pt" margin-top="250pt"/> <fo:region-start region-name="region-start" extent="25pt"/> <fo:region-end region-name="region-end" extent="25pt"/>

22 頁面區域範本-3 格式物件相關屬性如下表所示：

23 12-4 XSL-FO的頁面內容 XSL-FO的頁面內容 頁面內容fo:title和fo:flow
靜態內容fo:static-content 頁碼fo:page-number

24 XSL-FO的頁面內容 接下來，我們就可以針對指定範本定義頁面的實際內容，也就是一至多個fo:page-sequence格式物件，如下所示：
<fo:page-sequence master-reference="myPage"> ……… </fo:page-sequence> 在fo:page-sqeuence元素之下依序擁有3個子元素，如下所示： fo:title：這是可有可無的元素，用來指定文件標題，其功能類似HTML/XHTML語言的title標籤。 fo:static-content：可以有0到多個fo:static-content元素，這是每一頁都擁有的固定內容。 fo:flow：可以擁有1個且只有1個fo:flow元素，用來定義每一個頁面範本顯示的內容。

25 頁面內容fo:title和fo:flow
XSL-FO的fo:title元素可以指定文件標題，如下所示： <fo:title>Ch fo</fo:title> XSL-FO的fo:flow元素內容是頁面的實際內容，它是fo:page-sqeuence元素的子元素，而且只能有一個，如下所示： <fo:flow flow-name="region-body" font-family="SimHei"> <fo:block font-size="36pt" line-height="40pt"> ………… </fo:block> …………… </fo:flow>

26 靜態內容fo:static-content-1
在fo:flow元素的內容只會出現在文件的某一頁，fo:static-content元素的內容則可以出現在每一頁。換句話說，fo:static-content通常是用來顯示頁首和頁尾資訊，也就是置於region-before和region-after區域。

27 靜態內容fo:static-content-2
XSL-FO的fo:static-content元素是fo:page-sequence元素的子元素，其順序是在fo:title元素之後，fo:flow元素之前，同一個fo:page-sequence元素可以擁有0到多個fo:static-content子元素，如下所示： <fo:static-content flow-name="region-before"> <fo:block font-family="SimHei" font-size="44pt" line-height="50pt"> 陳會安的圖書清單 </fo:block> </fo:static-content>

28 頁碼fo:page-number-1 XSL-FO的fo:page-sequence元素可以指定頁碼的起始值和頁數，如下所示：
<fo:page-sequence master-reference="myPage" initial-page-number="2"> …………… </fo:page-sequence> 上述fo:page-sequence元素除了master-reference屬性外，可以使用initial-page-number和force-page-count屬性來定義頁碼。

29 頁碼fo:page-number-2 在fo:page-sequence元素定義好頁碼後，就可以在行內區域使用fo:page-number元素插入頁碼，通常是顯示在fo:static-content元素的固定內容，如下所示： <fo:static-content flow-name="region-after"> <fo:block font-family="SimHei" font-size="30pt" line-height="36pt"> 第 <fo:page-number/> 頁 </fo:block> </fo:static-content>

30 12-5 XSL-FO的多頁面範本 XSL-FO的多頁面範本 依序使用多頁面範本 重複使用多頁面範本 交互使用多頁面範本

31 XSL-FO的多頁面範本-1 <fo:simple-page-master master-name="leftPage"
page-width="8.5in" page-height="5in" margin-top="20pt" margin-bottom="20pt" margin-left="25pt" margin-right="50pt"> ……… </fo:simple-page-master> <fo:simple-page-master master-name="rightPage" margin-left="50pt" margin-right="25pt">

32 XSL-FO的多頁面範本-2 當在fo:layout-master-set元素定義多個fo:simple-page-master元素時，我們需要定義各頁面範本的出現順序，如下所示： <fo:layout-master-set> <fo:simple-page-master master-name="leftPage"… <fo:simple-page-master master-name="rightPage"… <fo:page-sequence-master master-name="myPage"> ………… </fo:page-sequence-master> </fo:layout-master-set>

33 XSL-FO的多頁面範本-3 在fo:page-sequence-master元素擁有三種子元素來定義各頁面範本的出現順序，如下所示：
fo:single-page-master-reference fo:repeatable-page-master-reference fo:repeatable-page-master-alternatives

34 依序使用多頁面範本 XSL-FO的fo:single-page-master-reference元素可以在fo:page-sequence-master元素定義頁面範本依序出現的順序，如下所示： <fo:page-sequence-master master-name="myPage"> <fo:single-page-master-reference master-reference="leftPage"/> <fo:single-page-master-reference master-reference="rightPage"/> </fo:page-sequence-master>

35 重複使用多頁面範本 XSL-FO的fo:single-page-master-reference元素適用在已知頁數的文件，對於不確定頁數的情況，fo:repeatable-page-master-reference元素可以定義重複出現指定頁面範本和最大出現次數，如下所示： <fo:page-sequence-master master-name="myPage"> <fo:repeatable-page-master-reference master-reference="leftPage" maximum-repeats="2"/> <fo:single-page-master-reference master-reference="rightPage"/> </fo:page-sequence-master>

36 交互使用多頁面範本-1 XSL-FO的fo:repeatable-page-master-alternatives元素可以指定頁面範本依位置、交互或內容是否為空白頁來定義出現順序，特別適用在圖書封面、序、左頁和右頁都擁有不同頁面範本的情況。

37 交互使用多頁面範本-2 在fo:repeatable-page-master-alternatives元素是使用fo:conditional-page-master-reference子元素來指定參考的頁面範本，如下所示： <fo:page-sequence-master master-name="myPage"> <fo:repeatable-page-master-alternatives> <fo:conditional-page-master-reference odd-or-even="odd" master-reference="leftPage"/> odd-or-even="even" master-reference="rightPage"/> </fo:repeatable-page-master-alternatives> </fo:page-sequence-master>

38 12-6 XSL-FO的段落內容 區塊fo:block 清單fo:list-block 表格fo:table

39 區塊fo:block XSL-FO的fo:block元素可以輸出一個長方形地區，用來輸出段落或是其它fo:block元素，如下所示：
<fo:block font-size="36pt" font-family="SimHei" line-height="40pt" text-align="center" space-before="5pt" space-after="5pt"> 什麼是XSL-FO </fo:block>

40 清單fo:list-block-1 XSL-FO的清單是由四種格式物件所組成，各種清單格式物件的說明，如下所示：
fo:list-block：建立清單，它是多個fo:list-item元素的父元素。 fo:list-item：建立清單的每一個項目，它是fo:list-item-label和fo:list-item-body的父元素。 fo:list-item-label：項目前的符號或編號。 fo:list-item-body：項目內容。

41 清單fo:list-block-2 <fo:list-block font-size="17pt"
space-before="10pt" line-height="20pt"> <fo:list-item> <fo:list-item-label>…</fo:list-item-label> <fo:list-item-body start-indent="10pt"> ……… </fo:list-item-body> </fo:list-item> ………… …………… </fo:list-block>

42 表格fo:table-1 XSL-FO的表格也是由一組格式物件來組成，常用XSL-FO表格的格式物件對應XHTML表格標籤，如下表所示：

43 表格fo:table-2 <fo:table space-before="10pt" text-align="center">
<fo:table-column column-width="2in"/> <fo:table-header> <fo:table-row> <fo:table-cell border-style="solid" border-width="1pt"> ……… </fo:table-cell> border-width="1pt"> ……… </fo:table-row> </fo:table-header>

44 表格fo:table-3 <fo:table-body> <fo:table-row> ………

45 9-7 XSL-FO的文字內容 文字效果 插入水平線 新增圖片 建立超連結

46 文字效果 對於段落中的指定文字或片語，可以使用fo:inline格式物件來建立文字效果，如下圖所示：
<fo:block font-size="36pt" font-family="SimHei" line-height="40pt" text-align="center" space-before="5pt" space-after="5pt"> 什麼是<fo:inline font-weight="bold" font-family="monospace" font-style="italic"> XSL-FO</fo:inline> </fo:block>

47 插入水平線 如同HTML/XHTML語言可以使用<hr/>標籤插入水平線，在XSL-FO是使用fo:leader格式物件來插入水平線，如下所示： <fo:block text-align="center"> <fo:leader leader-pattern="dots" leader-length="500pt"/> </fo:block>

48 新增圖片 XSL-FO的fo:external-graphic格式物件，相當於HTML/XHTML語言的<img/>標籤，可以在文件中新增圖片，如下所示： <fo:block text-align="center"> <fo:external-graphic src="Ch gif"/> </fo:block>

49 建立超連結 XSL-FO的fo:basic-link格式物件，相當於HTML/XHTML語言的<a>標籤，可以在文件中建立超連結文字，如下所示： <fo:block text-align="center" font-size="15pt" line-height="20pt" font-family="SimHei" space-before="25pt" space-after="25pt"> 中華電信公司: <fo:basic-link external-destination=" HiNet </fo:basic-link> </fo:block>