XSL-FO

THEORIE

PRATIQUE

THEORIE XSL-FO

Présentation

XSL-FO (XSL Formatting Objects) permet d’exprimer de manière très précise le rendu d’un document. Il gère la pagination d’un document, les notes de bas de page, les marges,… Il est possible de préciser avec exactitude l’emplacement des différents objets sur la page, les polices des caractères, l’affichage de tableaux, etc.

Un document XSL-FO est assez pénible à réaliser à la main, c’est pourquoi on utilise XSLT dans le but de générer du XSL-FO à partir de données au format XML.

Présentation

Ce langage, qui a failli tomber dans les oubliettes, doit sa renaissance à FOP (Formatting Object Processor).

FOP, développé dans le cadre du projet Apache, permet à partir d’un document XSL-FO de générer un document PDF. Il représente ainsi la solution idéale pour l’édition de factures ou de contrats sur le Web.

Architecture utilisée pour générer du PDF

Les données à présenter sont en XML. A partir d’une feuille de style XSLT, on génère un document XSL-FO, à l’aide d’un processeur XSLT.

On utilise ensuite un processeur FOP pour convertir le document XSL-FO en PDF.

Architecture utilisée pour générer du PDF

XML - données XSLT

Processeur XSLT

Document XSL-FO

Processeur FOP

Document PDF

PRATIQUE XSL-FO

Exemple d’organisation d’un fichier XSL-FO

Nous allons utiliser un exemple simple que nous avons créé afin de montrer les différentes composantes d’un fichier XSL-FO.

Il est possible de trouver les exemples à l’adresse: http://tecfa.unige.ch/staf/staf-g/glaus/staf2x/ex3/recette

Fichier XML<?xml version="1.0" encoding="ISO-8859-1"?><?xml-stylesheet href="recettefo.xsl" type="text/xsl"?><?cocoon-process type="xslt"?>

<!DOCTYPE recette SYSTEM "recette.dtd">

<recette>

<titre>Les Bonnes Recettes de Cuisine</titre>

<gateau photo="gateau.gif"><type>Gâteau aux Noix et au Chocolat blanc</type>

<ingredients><ingredient>250g de chocolat blanc</ingredient><ingredient>60g de noix</ingredient>…<ingredient>10g de levure chimique</ingredient>

</ingredients>

<preparation>Faites ramollir le beurre dans un petit bol, lui même dans un grand bol d'eau très chaude. fouettez le beurre énergiquement et y ajoutez les sucres. ajoutez l'oeuf entier …</preparation>

<internet>http://www.medi1.com/scripts/recettes.php3?r=616</internet></gateau>

</recette>

Feuille de style XSL-FO

On appelle une page XSL-FO de la manière suivante:

<?xml version="1.0" encoding="ISO-8859-1"?>

<xsl:stylesheet version="1.0"

xmlns:xsl="http://www.w3.org/1999/XSL/Transform"

xmlns:fo="http://www.w3.org/1999/XSL/Format">

<xsl:template match="recette">

<xsl:processing-instruction name="cocoon-format">type="text/xslfo"</xsl:processing-instruction>

<fo:root xmlns:fo="http://www.w3.org/1999/XSL/Format">

Page layout

BODY

BEFORE

AFTER

START

END

Page bottom margin

Page top margin

Page

Page

left

right

margin

margin

Architecture de la racine FO

Sous la racine fo:root il y a toujours: un fo:layout-master-set qui définit un ou plusieurs page layout définis avec

fo:simple-page-master des déclarations à option fo:declarations une séquence d’un ou plusieurs fo:page-sequences qui contiennent du texte

(littéralement ou fournis par XSLT) et des instructions de formatage.

Squelette XSL-FO de base<xsl:template match="page"> <fo:root>

<fo:layout-master-set>

<!-- Definition of a single master page. It is simple (no headers etc.) --><fo:simple-page-master master-name="first" >

<!-- required element body --><fo:region-body/></fo:simple-page-master></fo:layout-master-set>

<!-- Definition of a page sequence --><fo:page-sequence master-name="first"> <fo:flow flow-name="xsl-region-body" font-size="14pt" line-height="14pt">

<xsl:apply-templates/> </fo:flow></fo:page-sequence>

</fo:root></xsl:template>

Pagination<fo:layout-master-set>

<fo:simple-page-master master-name="first" page-height="29.7cm" page-width="21cm" margin-top="1cm" margin-bottom="2cm" margin-left="2.5cm" margin-right="2.5cm"> <fo:region-body margin-top="1cm"/> <fo:region-before extent="1cm"/> <fo:region-after extent="1.5cm"/> </fo:simple-page-master>

<fo:simple-page-master master-name="right" page-height="29.7cm" page-width="21cm" margin-top="1cm" margin-bottom="2cm" margin-left="2.5cm" margin-right="2.5cm"> <fo:region-body margin-top="1cm"/> <fo:region-before extent="1cm"/> <fo:region-after extent="1.5cm"/> </fo:simple-page-master>

Pagination<fo:simple-page-master master-name="left" page-height="29.7cm" page-width="21cm" margin-top="1cm" margin-bottom="2cm" margin-left="2.5cm" margin-right="2.5cm"> <fo:region-body margin-top="1cm"/> <fo:region-before extent="1cm"/> <fo:region-after extent="1.5cm"/> </fo:simple-page-master>

<fo:page-sequence-master master-name="run"><fo:repeatable-page-master-alternatives maximum-repeats="no-limit" ><fo:conditional-page-master-reference master-reference="left" odd-or-even="even" /><fo:conditional-page-master-reference master-reference="right" odd-or-even="odd" /><fo:conditional-page-master-reference master-reference="title"/>

</fo:repeatable-page-master-alternatives> </fo:page-sequence-master> </fo:layout-master-set> <!-- end: defines page layout -->

Pagination<!-- actual layout -->

<fo:page-sequence master-reference="run" initial-page-number="1">

<fo:static-content flow-name="xsl-region-before"> <fo:block text-align="end" font-size="10pt" font-family="sans-serif" line-height="11pt" color="lightslategray" >

<xsl:value-of select="titre"/> - <fo:page-number/> </fo:block> </fo:static-content>

<fo:flow flow-name="xsl-region-body" font-size="12pt" line-height="11pt">

<xsl:apply-templates/> </fo:flow> </fo:page-sequence>

</fo:root> </xsl:template>

Les listes Mécanisme puissant: listes ordinaires, notes en bas de page, simples tables, etc.

fo:list-block

fo:list-item

fo:list-item-label fo:list-item-body

fo:list-block: contient la liste et contient quelques définitions pour la géométrie fo:list-item: enfants de fo:list-block, c.a.d. des items qui contiennent un label et

un body (voir ci-dessous) fo: fo:list-item-label: contient le contenu du label (typiquement un fo:block avec

un nombre, un caractère dingbat, etc.) The fo:list-item-body contient le corps d’un item, un ou plusieurs fo:block

Une simple « bullet-list »<xsl:template match="ingredients">

<fo:block color="navy" font-size="12pt" text-align="justify" space-before.optimum="15pt" background-color="lavender">Ingrédients :</fo:block><xsl:apply-templates select="ingredient" /></xsl:template><xsl:template match="ingredient"><fo:list-block space-before.optimum="4pt"><fo:list-item space-before.optimum="4pt"><fo:list-item-label end-indent="label-end()"><fo:block>·</fo:block></fo:list-item-label><fo:list-item-body start-indent="body-start()"><fo:block text-align="justify" font-size="10pt"> <xsl:value-of select="." /></fo:block></fo:list-item-body></fo:list-item></fo:list-block>

</xsl:template>

Résultat : http://tecfa.unige.ch/staf/staf-g/glaus/staf2x/ex3/recette/liste.pdf

Les tables ressemblent un peu aux tables HTML

fo:table-and-caption

fo:table-caption fo:table

fo:table-column fo:table-header fo:table-body fo:table-footer

fo:table-row fo:table-row fo:table-row

fo:table-cell fo:table-cell fo:table-cell

fo:table-and-caption: fo:table-caption: La caption d’une table fo:table: la table proprement dite. Elle contien header et footer à option et un body. fo:table-column: permet de specifier notamment la longeur d’une colonne fo:table-header: Ligne entête, contient des lignes ou cellules fo:table-footer: Ligne "footer", contient des lignes ou cellules fo:table-body: contient des lignes ou cellules fo:table-row: contient des cellules qui contiennent des fo:blocks

Un tableau à deux colonnes<xsl:template match="gateau">

<fo:table table-layout="fixed" space-before.optimum="15pt"><fo:table-column column-number="1" column-width="5cm" /><fo:table-column column-number="2" column-width="10cm" />

<fo:table-body> <fo:table-row> <fo:table-cell column-number="1"> <fo:block space-before.optimum="12pt"> <fo:external-graphic src="{@photo}" /> </fo:block> </fo:table-cell> <fo:table-cell column-number="2"> <fo:block color="navy" font-size="16pt" text-align="center" space-

before.optimum="15pt"> <xsl:apply-templates select="type" /> </fo:block> </fo:table-cell> </fo:table-row></fo:table-body>

</fo:table></xsl:template>

Résultat : http://tecfa.unige.ch/staf/staf-g/glaus/staf2x/ex3/recette/table.pdf

Les images

L’insertion d’une image se fait avec le tag :

<fo:external-graphic src="image"/>

Insertion d’une image

<xsl:template match="gateau">

<fo:block color="navy" font-size="16pt" text-align="center" space before.optimum="15pt">

<xsl:apply-templates select="type" />

</fo:block>

<fo:block space-before.optimum="12pt">

<fo:external-graphic src="{@photo}" />

</fo:block>

</xsl:template>

Résultat : http://tecfa.unige.ch/staf/staf-g/glaus/staf2x/ex3/recette/image.pdf

Les liens

L’insertion d’un lien Internet ou d’une adresse E-mail se fait avec le tag:

<fo:basic-link external-destination="http://tecfa.unige.ch"> Autres liens possibles :

– internal-destination– indicate-destination– show-destination– destination-placement-offset– target-presentation-context– target-processing-context– target-stylesheet

Insertion d’un lien

<xsl:template match="internet">

<fo:block color="navy" font-size="12pt" text-align="justify" space-before.optimum="12pt" background-color="lavender">

Site Internet :

</fo:block>

<fo:block color="navy" font-size="12pt" text-align="justify" space-before.optimum="15pt">

<fo:basic-link external-destination="{.}">

<xsl:value-of select="." />

</fo:basic-link>

</fo:block>

</xsl:template>

Résultat : http://tecfa.unige.ch/staf/staf-g/glaus/staf2x/ex3/recette/lien.pdf

Exemple complet

Résultat final après avoir mis les différents éléments ensemble :

http://tecfa.unige.ch/staf/staf-g/glaus/staf2x/ex3/recette/recettefo.xsl

Résultat final en PDF :

http://tecfa.unige.ch/staf/staf-g/glaus/staf2x/ex3/recette/recette.pdf