CIS 375Web App Dev II XSLFO XSLFO Introduction

CIS 375—Web App Dev II XSLFO

XSLFO Introduction n n XSLFO stands for Extensible Stylesheet Language __________. XSLFO is an _____-based markup language. XSLFO is a W 3 C Recommendation and is now formally named _____. “XSL” consists of three parts: n n XSLT (a language for transforming XML documents) XSL (a vocabulary formatting XML documents) XPath (a language for defining parts of an XML document) This may sound a little confusing, but sometimes life IS a little confusing. 2

XSLFO Documents n n n XSLFO documents are stored in files with a *. fo or a *. ____ extension. They can also have the *. ____ extension, because this makes them more accessible to XML editors. XSLFO documents start with an XML ______: <? xml version="1. 0" encoding="ISO-8859 -1"? > n The <fo: root> element contains the XSLFO document and declares a namespace. n To make XML elements unique, “fo” is given an XML namespace, such as http: //www. w 3. org/1999/XSL/Format. <fo: root xmlns: fo=http: //www. w 3. org/1999/XSL/Format>  </fo: root> 3

XSLFO Document Structure <? xml version="1. 0" encoding="ISO-8859 -1"? > <fo: root xmlns: fo="http: //www. w 3. org/1999/XSL/Format"> <fo: layout-master-set> <fo: simple-page-master-name=“My. Page">  </fo: simple-page-master> </fo: layout-master-set> <fo: page-sequence master-name="My. Page">  </fo: page-sequence> </fo: root> 4

XSLFO Areas n n n n The XSL formatting model defines a number of ______ areas to display output. One such area is called a _______. Each XSL-FO Page contains a number of _______: region-body, region-before (header), region-after (footer), region-start (left sidebar), and region-end. XSLFO Regions contain _______ areas. XSLFO Block areas most often contain _____ areas. XSLFO Line areas contain _______ areas. XSLFO Inline areas define _____ inside Lines (bullets, single character, graphics, and more). 5

Simple XSLFO Document n "Blocks" of content “______" into "Pages" and then to the output media. <? xml version="1. 0" encoding="iso-8859 -1"? > <fo: root xmlns: fo="http: //www. w 3. org/1999/XSL/Format"> <fo: layout-master-set> <fo: simple-page-master-name="my-page"> <fo: region-body margin="1 in"/> </fo: simple-page-master> </fo: layout-master-set> <fo: page-sequence master-reference="my-page"> <fo: flow-name="xsl-region-body"> <fo: block>Hello, world!</fo: block> </fo: flow> </fo: page-sequence> </fo: root> 6

hello. fo in an XSL Formatter (see http: //www. antennahouse. com/) 7

XSLFO Flow n n XSLT-FO pages are filled with ____ from the <fo: flow> element. The <fo: flow> element contains all the elements to be printed to the page. When the page is full, the same page _______ will be used until all the text is printed. The <fo: flow> element has a "flow-name" _______. n n n xsl-region-body (into the region-body) xsl-region-before (into the region-before) xsl-region-after (into the region-after) xsl-region-start (into the region-start) xsl-region-end (into the region-end) 8

XSLFO Pages n n XSLFO uses page templates called "Page ____" to define the layout of pages. The following illustrates page masters for odd and even page numbers: <fo: simple-page-master-name="left"> <fo: region-body margin-left="2 in" margin-right="3 in" /> </fo: simple-page-master> <fo: simple-page-master-name="right"> <fo: region-body margin-left="3 in" margin-right="2 in" /> </fo: simple-page-master> 9

Example Page Master <? xml version="1. 0" encoding="iso-8859 -1"? > <fo: root xmlns: fo="http: //www. w 3. org/1999/XSL/Format"> <fo: layout-master-set> <fo: simple-page-master-name="A 4" page-width= "297 mm" page-height= "210 mm" margin-top= "1 cm" margin-bottom="1 cm" margin-left="1 cm" margin-right= "1 cm"> <fo: region-body margin="3 cm"/> <fo: region-before extent="2 cm"/> <fo: region-after extent="2 cm"/> <fo: region-start extent="2 cm"/> <fo: region-end extent="2 cm"/> </fo: simple-page-master> </fo: layout-master-set> <fo: page-sequence master-reference="A 4"> <fo: flow-name="xsl-region-body"> <fo: block>Example Page Master</fo: block> </fo: flow> </fo: page-sequence> </fo: root> 10

11

XSLFO Blocks n XSL-FO output is normally nested inside <fo: block> elements, nested inside <fo: flow> elements, nested inside <fo: page-sequence> elements. <fo: page-sequence> <fo: flow> <fo: block>  </fo: block> </fo: flow> </fo: page-sequence> n Blocks can have many formatting attributes such as, margin, border-width, border-color, padding, background-color, font-family, etc. 12

Example of XSLFO Blocks n This code would be placed within the ______ element: <fo: block font-size="14 pt" font-family="verdana" color="red" space-before="5 mm" space-after="5 mm“ padding="2 mm"> W 3 Schools </fo: block> <fo: block text-indent="5 mm" font-family="verdana" font-size="12 pt" space-before="5 mm" space-after="5 mm"> At W 3 Schools you will find all the Web-building tutorials you need, from basic HTML and XHTML to advanced XML, XSL, Multimedia and WAP. </fo: block> 13

Example from Previous Slide 14

XSLFO List Blocks The following code creates a bulleted list: n <fo: list-block provisional-distance-between-starts="10 pt" > <fo: list-item-label> <fo: block>&#x 2022; </fo: block> </fo: list-item-label> <fo: list-item-body start-indent="body-start()"> <fo: block>Volvo</fo: block> </fo: list-item-body> </fo: list-item> <fo: list-item-label> <fo: block>&#x 2022; </fo: block> </fo: list-item-label> <fo: list-item-body start-indent="body-start()"> <fo: block>Saab</fo: block> </fo: list-item-body> </fo: list-item> </fo: list-block> 15

Example from previous slide: 16

XSLFO Tables n The hierarchy of XSLFO table elements (each element contains the listed sub-elements). <fo: table-and-caption> <fo: table-column> (optional) <fo: table-header> (optional) <fo: table-cell> <fo: block> <fo: table-body> <fo: table-row> <fo: table-cell> <fo: block> 17

XSLFO Table Example <fo: table-and-caption> <fo: table-column-width ="25 mm"/> <fo: table-header> <fo: table-cell> <fo: block font-weight = "bold“> Car </fo: block> </fo: table-cell> <fo: block font-weight="bold"> Price </fo: block> </fo: table-cell> </fo: table-header> <fo: table-body> <fo: table-row> <fo: table-cell> <fo: block>Volvo</fo: block> </fo: table-cell> <fo: block>$50000</fo: block> </fo: table-cell> </fo: table-row> <fo: table-cell> <fo: block>SAAB</fo: block> </fo: table-cell> <fo: block>$48000</fo: block> </fo: table-cell> </fo: table-row> </fo: table-body> </fo: table-and-caption> 18

Output from Table Example 19

Generate XSLFO from XML (1) XML document: n <? xml version="1. 0" encoding="ISO-8859 -1" ? > <info> <header> W 3 Schools </header> <paragraph> At W 3 Schools you will find all the Web-building tutorials you need, from basic HTML and XHTML to advanced XML, XSL, Multimedia and WAP. </paragraph> </info> 20

Generate XSLFO from XML (2) <fo: page-sequence masterreference="simple"> <fo: flow-name="xsl-regionn : body"> <? xml version="1. 0" encoding="ISO<fo: block 8859 -1"? > font-size="14 pt" font-family <xsl: stylesheet version="1. 0" ="verdana" color="red" xmlns: xsl="http: //www. w 3. org/1999/ space-before="5 mm" space. XSL/Transform" after="5 mm"> xmlns: fo="http: //www. w 3. org/1999/ <xsl: apply-templates select XSL/Format"> ="header" /> <xsl: output method="xml" version </fo: block> ="1. 0" /> <fo: block <xsl: template match="info"> font-size="10 pt" font-family <fo: root ="verdana" xmlns: fo="http: //www. w 3. org/1999/ space-before="5 mm" space-after XSL/Format"> ="5 mm"> <fo: layout-master-set> <xsl: apply-templates select <fo: simple-page-master ="paragraph" /> master-name="simple" </fo: block> page-width="150 mm" </fo: flow> page-height="200 mm"> </fo: page-sequence> <fo: region-body margin="3 cm"/> </fo: root> </fo: simple-page-master> </xsl: template> </fo: layout-master-set> </xsl: stylesheet> 21 XSL document

XSLFO from XML Output 22

PDF Output 23

XSLFO Table w/ XSLT (cd_xslfo. xsl) xmlns: xsl="http: //www. w 3. org/1999/XSL/Transform" xmlns: fo="http: //www. w 3. org/1999/XSL/Format"> <xsl: output method="xml" version ="1. 0" /> <xsl: template match="/"> <fo: root xmlns: fo= "http: //www. w 3. org/1999/XSL/Format"> <fo: layout-master-set> <fo: simple-page-master-name="my-page" page-width="150 mm" page-height="200 mm"> <fo: region-body margin="1 in"/> </fo: simple-page-master> </fo: layout-master-set> <fo: page-sequence master-reference="my-page"> <fo: flow-name="xsl-region-body"> <fo: table-and-caption> <fo: table-column-width ="2 in"/> <fo: table-body> <xsl: for-each select="CATALOG/CD"> <fo: table-row> <fo: table-cell> <fo: block font-size="10 pt" font-family ="verdana" color="red" space-before="5 mm" space-after="5 mm"> <xsl: value-of select="TITLE"/> </fo: block> </fo: table-cell> </fo: table-row> </xsl: for-each> </fo: table-body> </fo: table-and-caption> </fo: flow> </fo: page-sequence> </fo: root> </xsl: template> </xsl: stylesheet> 24

Output from cd_xslfo. xsl 25

XSLFO Software n n n Special software is required to format XSL documents. This software can produce output as _____. http: //www. antennahouse. com/xslformatter. html http: //www. lunasil. com/ http: //www. scriptura-xsl. com/index. html 26