web-dev-qa-db-fra.com

Avec iText, comment puis-je appliquer les CSS à mon PDF document utilisant CssResolver et CssFile?

Merci de votre aide...

Problème

Lors de la conversion d'un tag/snippet de table html (que j'ai converti en chaîne) en un document PDF ...

Je peux avec succès appliquer des styles CSS au PDF document en utilisant cette technique ...

CSSResolver cssResolver = XMLWorkerHelper.getInstance().getDefaultCssResolver(false);  
cssResolver.addCss("td {border-right: white .1px solid;}", true);

Mais, je suis sans succès appliquer css au document PDF en utilisant un fichier css existant (c'est-à-dire, en utilisant un objet CssFile), comme ceci ...

CSSResolver cssResolver = new StyleAttrCSSResolver();
InputStream csspathtest = Thread.currentThread().getContextClassLoader().getResourceAsStream("styles/itextweb.css");            
CssFile cssfiletest = XMLWorkerHelper.getCSS(csspathtest);
cssResolver.addCss(cssfiletest);             

... Je n'ai pas réussi à faire fonctionner ça, et je ne sais pas quel est le problème ... Je commence à ...

Java.io.IOException The document has no pages

Question:

Comment utiliser correctement CssFile avec CssResolver pour appliquer les styles CSS - c’est-à-dire des fichiers ".css" existants - à mon document PDF? (Qu'est-ce qui ne va pas dans la façon dont j'utilise iText pour y parvenir?)

(Encore une fois, merci pour toute aide/conseils à ce sujet)

================ CI-DESSOUS IS PLUS D'INFORMATIONS DÉTAILLÉES ==================

Java 6, JSF (Mojarra) 2.1.11, Primefaces v3.4.2, itextpdf v5.3.4, xmlworker v1.2.1

C'est la fonction "printPDF" en question ...

public void createPDF() throws DocumentException, CssResolverException
{
    FacesContext context = FacesContext.getCurrentInstance();
    ExternalContext econtext = context.getExternalContext();

    try
    {
        String htmlstring   = context.getExternalContext().getRequestParameterMap().get("testForm:htmlstring");

        InputStream is = new ByteArrayInputStream(htmlstring.getBytes());             
        ByteArrayOutputStream baos = new ByteArrayOutputStream(); 

        // step 1
        Document document = new Document();

        // step 2
        PdfWriter writer = PdfWriter.getInstance(document, baos);

        writer.setInitialLeading(12.5f);

        // step 3
        document.open();

        HtmlPipelineContext htmlContext = new HtmlPipelineContext(null);

        htmlContext.setTagFactory(Tags.getHtmlTagProcessorFactory());

        // CSS
        CSSResolver cssResolver = new StyleAttrCSSResolver();
        InputStream csspathtest = Thread.currentThread().getContextClassLoader().getResourceAsStream("styles/itextweb.css");            
        CssFile cssfiletest = XMLWorkerHelper.getCSS(csspathtest);
        cssResolver.addCss(cssfiletest);             

        Pipeline<?> pipeline =  new CssResolverPipeline(cssResolver, new HtmlPipeline(htmlContext, new PdfWriterPipeline(document, writer)));

        XMLWorker worker = new XMLWorker(pipeline, true);
        XMLParser p = new XMLParser(worker);
        p.parse(is); //new FileInputStream("results/demo2/walden.html"));

        // step     
        document.close();

        //post back...
        HttpServletResponse response = (HttpServletResponse) context.getExternalContext().getResponse();
        response.setContentType("application/pdf");
        response.setHeader("Expires", "0");
        response.setHeader("Cache-Control", "must-revalidate, post-check=0, pre-check=0");           
        response.setHeader("Content-Type", "application/pdf");
        response.setHeader("Content-disposition","attachment;filename=file.pdf");
        response.setContentLength(baos.size());
        OutputStream os = response.getOutputStream();
        baos.writeTo(os);
        os.flush();
        os.close();
        context.responseComplete();
    }
    catch (FileNotFoundException e)
    {
        e.printStackTrace();
    }
    catch (IOException e)
    {
        e.printStackTrace();
    }
    catch (DocumentException e)
    {
        e.printStackTrace();
    }
}

Ceci est la page contenant l'extrait de table html à analyser en pdf (c'est-à-dire, id = "table1") ...

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://Java.Sun.com/jsf/facelets"
      xmlns:h="http://Java.Sun.com/jsf/html"
      xmlns:f="http://Java.Sun.com/jsf/core"
      xmlns:c="http://Java.Sun.com/jsp/jstl/core"
      xmlns:p="http://primefaces.org/ui">
    <f:view contentType="text/html">
        <h:head>
            <title>test html-to-pdf with itext...</title>
            <meta charset="utf-8" />
        </h:head>
        <h:body>
            <h:form id="testForm">

                <p:panel id="queryPanel"  header="...test itext html-to-pdf conversion..." style="width:100%;">

                    <table id='table1'>
                        <thead class="dt-thd">
                            <tr id="table1-h-hdr-row">
                                <th style="width: 120px" class="dt-hhdr-c " >Last name</th>
                                <th style="width: 120px" class="dt-hhdr-c " >First Name</th>
                                <th style="width: 120px" class="dt-hhdr-c " >Middle Name</th>
                                <th style="width: 180px" class="dt-hhdr-c " >Date Of Birth</th>

                            </tr>
                        </thead>
                        <tbody>
                            <tr class="dt-r-even" onclick="uiOnRowClick('table1', 14, this)">
                                <td style="width: 120px" class="dt-c  row-selected-left" ><a class="column-link " onfocus="uiOnRowClick('table1', 14, this.parentNode.parentNode)" onclick="storeFilters()" href="#">lastnameAAA</a></td>
                                <td style="width: 120px" class="dt-c  row-selected" >firstnameAAA</td>
                                <td style="width: 120px" class="dt-c  row-selected" >A</td>
                                <td style="width: 180px" class="dt-c  row-selected" >11/27/1971</td>
                            </tr>
                            <tr class="dt-r-odd" onclick="uiOnRowClick('table1', 14, this)">
                                <td style="width: 120px" class="dt-c " ><a class="column-link " onfocus="uiOnRowClick('table1', 14, this.parentNode.parentNode)" onclick="storeFilters()" href="#">lastnameBBB</a></td>
                                <td style="width: 120px" class="dt-c " >firstnameBBB</td>
                                <td style="width: 120px" class="dt-c " >B</td>
                                <td style="width: 180px" class="dt-c " >01/15/1951</td>
                            </tr>
                            <tr class="dt-r-even" onclick="uiOnRowClick('table1', 14, this)">
                                <td style="width: 120px" class="dt-c " ><a class="column-link " onfocus="uiOnRowClick('table1', 14, this.parentNode.parentNode)" onclick="storeFilters()" href="#">lastnameCCC</a></td>
                                <td style="width: 120px" class="dt-c " >firstnameCCC</td>
                                <td style="width: 120px" class="dt-c " >C</td>
                                <td style="width: 180px" class="dt-c " >02/16/1962</td>
                            </tr>
                            <tr class="dt-r-odd" onclick="uiOnRowClick('table1', 14, this)">
                                <td style="width: 120px" class="dt-c " ><a class="column-link " onfocus="uiOnRowClick('table1', 14, this.parentNode.parentNode)" onclick="storeFilters()" href="#">lastnameDDD</a></td>
                                <td style="width: 120px" class="dt-c " >firstnameDDD</td>
                                <td style="width: 120px" class="dt-c " >D</td>
                                <td style="width: 180px" class="dt-c " >03/17/1973</td>
                            </tr>
                            <tr class="dt-r-even" onclick="uiOnRowClick('table1', 14, this)">
                                <td style="width: 120px" class="dt-c " ><a class="column-link " onfocus="uiOnRowClick('table1', 14, this.parentNode.parentNode)" onclick="storeFilters()" href="#">lastnameEEE</a></td>
                                <td style="width: 120px" class="dt-c " >firstnameEEE</td>
                                <td style="width: 120px" class="dt-c " >E</td>
                                <td style="width: 180px" class="dt-c " >04/18/1984</td>
                            </tr>
                            <tr class="dt-r-odd" onclick="uiOnRowClick('table1', 14, this)">
                                <td style="width: 120px" class="dt-c " ><a class="column-link " onfocus="uiOnRowClick('table1', 14, this.parentNode.parentNode)" onclick="storeFilters()" href="#">lastnameFFF</a></td>
                                <td style="width: 120px" class="dt-c " >firstnameFFF</td>
                                <td style="width: 120px" class="dt-c " >F</td>
                                <td style="width: 180px" class="dt-c " >05/19/1995</td>
                            </tr>
                        </tbody>
                    </table>

                    <p:commandButton
                        id="printPdf"
                        value="Print"
                        action="#{testBean.createPDF2}"
                        ajax="false"
                        onclick="printPreview(this);this.form.target='_blank'"/>

                    <h:inputHidden id="htmlstring" value="no value"/>

                </p:panel>

            </h:form>

            <h:outputStylesheet  library="styles"    name="itextweb.css"      />
            <h:outputScript      library="primefaces" name="/jquery/jquery.js" />
            <h:outputScript      library="primefaces" name="/jquery/plugins/ui/jquery-ui.custom.js" />
            <h:outputScript      library="primefaces" name="/jquery/plugins/inputmask/maskedinput.js" />
            <h:outputScript      library="js"         name="itextweb.js" />
        </h:body>
    </f:view>
</html>

Voici le javascript utilisé ...

function uiOnRowClick(a, b, c)
{
    alert("uiOnRowClick(a,b,c) function called...blah...");
}

function storeFilters()
{
    alert("storeFilters() function called...bleah...");
}

function printPreview(e)
{
    var t = document.getElementById("table1");
    var htmlstring = "<table id='table1-hdr' class='dt' style='width:2416px;position:absolute'>" + t.innerHTML + "</table>";
    document.getElementById('testForm:htmlstring').value = htmlstring;
}

Voici la feuille de style CSS pour cet exemple ...

.text1
{
    background-color: transparent !important;
    font-weight: bold;
    font-size: 2em;
    color: blue;
    text-align:center;
}

.ui-inputfield {
    background: white !important;
    height: 10px !important;
    vertical-align: middle;
    display:inline-block;
    white-space: nowrap;
}


.ui-button
{
    margin-top: .5px !important;
    vertical-align: middle !important;
    display:inline-block !important;
    white-space: nowrap !important;
    text-align: center !important;
}

.ui-message-error
{
    background: transparent !important;
    border: none !important;
    font-size: .9em !important;
    font-weight: normal !important;
    font-family: Arial, sans-serif !important;
}

.ui-message-error-icon {
    display: none;
}

.ui-messages-error
{
    background: transparent !important;
    border: none !important;
    font-size: .9em !important;
    font-weight: normal !important;
    font-family: Arial, sans-serif !important;
}

.ui-messages-error-icon {
    display: none;
}

.ui-inputfield.ui-state-error
{
    background: pink !important;
}

form *
{
box-sizing: content-box !important;
-moz-box-sizing: content-box !important;
-ms-box-sizing: content-box !important;
}


.ui-widget, .ui-widget .ui-widget
{
font-size: 90% !important;
}


.dt-thd
{

}

.table1-h-hdr-row
{

}

.dt-hhdr-c
{
    color: blue;
    background-color:  lightgray;
}

.dt-r-odd
{
    background-color: aliceblue;
}

.dt-r-even
{
    background-color:  lightskyblue;
}

.dt-c
{
    font-size: 8px;
    font-weight: normal;
}

Ci-dessous, le fichier pom.xml utilisé avec cet exemple (qui illustre les dépendances/versions/etc) ...

<project xmlns="http://maven.Apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.Apache.org/POM/4.0.0 http://maven.Apache.org/maven-v4_0_0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <groupId>aaa.bbb.ccc</groupId>
    <artifactId>itextweb-war</artifactId>
    <packaging>war</packaging>
    <version>1</version>
    <name>itextweb-war</name>
    <url>http://maven.Apache.org</url>

    <dependencies>

        <dependency>
            <groupId>javax.servlet</groupId>
            <artifactId>servlet-api</artifactId>
            <version>2.5</version>
            <scope>provided</scope>
        </dependency>

        <dependency>
            <groupId>javax.servlet</groupId>
            <artifactId>jstl</artifactId>
            <version>1.2</version>
        </dependency>

        <dependency>
            <groupId>com.Sun.faces</groupId>
            <artifactId>jsf-api</artifactId>
            <version>2.1.11</version>
        </dependency>

        <dependency>
            <groupId>com.Sun.faces</groupId>
            <artifactId>jsf-impl</artifactId>
            <version>2.1.11</version>
        </dependency>

        <dependency>
            <groupId>javax.el</groupId>
            <artifactId>el-api</artifactId>
            <version>2.2</version>
        </dependency>
        <dependency>
            <groupId>org.glassfish.web</groupId>
            <artifactId>el-impl</artifactId>
            <version>2.2</version>
        </dependency>

        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-context</artifactId>
            <version>3.1.1.RELEASE</version>
        </dependency>

        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-webmvc</artifactId>
            <version>3.1.1.RELEASE</version>
        </dependency>

        <dependency>
            <groupId>commons-lang</groupId>
            <artifactId>commons-lang</artifactId>
            <version>2.6</version>
        </dependency>

        <dependency>
            <groupId>commons-io</groupId>
            <artifactId>commons-io</artifactId>
            <version>2.4</version>
        </dependency>

        <dependency>
            <groupId>org.primefaces</groupId>
            <artifactId>primefaces</artifactId>
            <version>3.4.2</version>
        </dependency>

        <dependency>
            <groupId>org.primefaces.themes</groupId>
            <artifactId>aristo</artifactId>
            <version>1.0.1</version>
        </dependency>

        <dependency>
            <groupId>com.itextpdf</groupId>
            <artifactId>itextpdf</artifactId>
            <version>5.3.4</version>
        </dependency>

        <dependency>
            <groupId>com.itextpdf.tool</groupId>
            <artifactId>xmlworker</artifactId>
            <version>1.2.1</version>
        </dependency>

    </dependencies>
    <build>
        <plugins>
            <plugin>
                <groupId>org.Apache.maven.plugins</groupId>
                <artifactId>maven-compiler-plugin</artifactId>
                <version>2.3.2</version>
                <configuration>
                    <source>1.6</source>
                    <target>1.6</target>
                </configuration>
            </plugin>
            <plugin>
                <groupId>org.Apache.maven.plugins</groupId>
                <artifactId>maven-war-plugin</artifactId>
                <version>2.3</version>
            </plugin>

        </plugins>
        <finalName>${project.name}-${project.version}</finalName>
    </build>
</project>
9
sairn

Créé un projet à partir de votre code, testé et cela fonctionne très bien pour créer un fichier PDF à partir d'un fichier html avec CSS externe.

Voici le référentiel public: https://github.com/valentin-nasta/itext-html-css-pdf-jsf-template .

3
valentin_nasta

la soucoupe volante Nope n'est plus prise en charge. nous avons beaucoup de problèmes avec cela. pour un usage privé, c'est ok, mais pas dans le cadre d'une analyse de rentabilité.

2
user3498257

Je pense qu'un outil meilleur et plus puissant (et de plus haut niveau d'abstraction) à cette fin (générant des fichiers PDF à partir de XHTML) serait Flying Saucer, aka. xhmlrenderer.

Il fournit une prise en charge complète de CSS2 et quelques propriétés CSS3 pour le support d'impression, et vous pouvez l'étendre pour restituer tous les fichiers PDF (voir l'API ReplacementElementFactory).

Je l'ai utilisé pour le rendu de rapports dynamiques PDF (avec freemarker), avec des balises personnalisées, comme. Outil très simple et facile à comprendre.

Voir: http://code.google.com/p/flying-saucer/

Le guide d'utilisation se trouve ici: http://flyingsaucerproject.github.com/flyingsaucer/r8/guide/users-guide-R8.html

2
persicsb

Pour cssResolver, vous devez spécifier le chemin absolu du fichier .css, comme indiqué ci-dessous.

HtmlPipelineContext htmlContext = new HtmlPipelineContext(null);

htmlContext.setTagFactory(Tags.getHtmlTagProcessorFactory());

CSSResolver cssResolver = XMLWorkerHelper.getInstance().getDefaultCssResolver(false);

cssResolver.addCssFile("src\\template\\style.css",true);
Pipeline<?> pipeline = new CssResolverPipeline(cssResolver, new HtmlPipeline(htmlContext, new PdfWriterPipeline(document, writer)));

XMLWorker worker = new XMLWorker(pipeline, true);
XMLParser xmlParser = new XMLParser(worker);
0
Abhineet kamra