Impression avec mise en page CSS sur Windows

**gael21** · 27/06/2019, 23h01

Bonsoir à tous !
Je viens vers vous après près de 4 jours de recherche sur les forums.
Je m'explique:
je veux faire une impression (pdf) sur format A4 d'un contenu comportant une image et du texte.
Enfait ce contenu n'est que pour mon test avant de pouvoir l'adapter à mon réel projet.
Le souci c'est que j'ai utilisé au début la fonction renderr(). Mais elle me
sortait juste une capture d'écran très affreuse. On m'a conseillé de passer par le html
et d'utiliser la fonction setHtml(). Je l'ai fait et le code est plus bas.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
 
    QPrinter printer(QPrinter::PrinterResolution);
    printer.setOutputFormat(QPrinter::PdfFormat);
    printer.setOrientation(QPrinter::Portrait);
    printer.setPaperSize(QPrinter::A4);
    //printer.setOutputFileName(fileName);
    printer.setOutputFormat(QPrinter::NativeFormat);
    QPrintDialog orintDialogue(&printer);
    if(orintDialogue.exec() == 1)
    {
        QTextDocument doc;
        QString html("<html><head><meta charset='utf-8' /><style>img{width:50px; height:50px;} ul{list-style-type: none;font-size:1.5em; width:22%; height:200px; float:right; margin-right:100px; margin-bottom:10px; margin-top:25px;}#p{margin-top:100px; margin-bottom:0px;} #titre_principal{color:blue; width:30%; margin-right:68%;} #logo{width:20%; height:150px; margin-bottom: 0px;} h1{font-size:2.2em; font-weight:normal; margin-left:-17px; width:20%;} h2{font-size:1.3em; font-weight:normal; margin-top:-30px; margin-bottom:50px; margin-left:30px;} header{font-family: Helvetica, Arial, serif;}</style><title>Premiers tests du CSS</title></head><body><header><nav><ul><li> Douala, le .............</li><li><div id='p'>Le Principal</li></ul></nav><div id='titre_principal'><img src='C:/Users/Gaël/Pictures/modif/logo.jpg' alt='Logo college' id='logo' /><h1>I.P.F.</h1><h2>Institut Polyvalent Fosso</h2></div></header></body></html>");
 
        Qt::convertFromPlainText(html);
        doc.setHtml(html);
        //doc.setPageSize(printer.pageRect().size()); //permet de cacher le numero de page lord de l'impression
 
        doc.print(&printer);
    }
 
    return a.exec();
}

Resultat:
J'obtiens bien un fichier pdf avec tout le contenu souhaité, sauf que la mise en forme n'est pas prise en compte. Dans mon CSS, j'utilise le positionnement absolu avec la propriété float, les bordures, et bien plus encore.

J'ai replongé dans les forums et parfois même dans la documentation de Qt, et resultat, j'ai compris que les bordures, le positionnement absolu ne sont pas pris en compte par Qt sur l'OS Windows, mais ça l'est par contre sur LINUX. Etant sur Windows, j'ai regardé du côté de la documentation et il me semble que QPrintDialog peut bien m'aider. Le souci c'est que je ne comprends pas très bien la doc malgré son excellente structuration.

S'il vous plaît aidez moi. C'est grave de mon côté, et je ne parle même pas de la pression que j'ai déjà sur mon projet réel. Je veux imprimer en pdf un contenu html, contenant une mise en forme CSS avec les bordures, le positionnement absolu et bien plus encore.

**koala01** · 28/06/2019, 03h15

Salut,

Attention! Si tu veux créer un pdf à partir d'un document HTML, tu dois respecter les règles propres au HTML en ce qui concerne le média utilisé pour la sortie; surtout si le document HTML en question doit prendre une forme différente s'il est affiché dans un navigateur de celle qu'il devrait prendre s'il sert de base à la génération d'un fichier pdf

L'idéal est alors de créer deux CSS distinctes:

l'une, qui sera utilisée au travers de la balise <link rel="stylesheet" type="text/css" href="styles.css"> pour la représentation dans un navigateur et
l'autre, qui sera utilisée au travers de la balise <link rel="stylesheet" type="text/css" href="impression.css" media="print"> dans le cadre de la génération du pdf

(tu auras compris que les noms des fichiers "style.css" et "impressions.css" sont à ta bonne convenance

)

**gael21** · 28/06/2019, 09h41

Bonjour
Merci Koala01 pour ta reponse.
Mais je ne vois pas comment le fait d'avoir 02 feuille de style parrait m'aider.
Je rappelle ici que le souci c'est le fait que certaines propriétés du CSS n'ont
aucun effet sur l'OS Windows. Alors en procédant comme tu le me proposes, quelles
propriétés du CSS je devrai utiliser pour le positionnement par exemple?
A ce propos, j'ai pensé à l'utilisation d'un autre langage pour y arriver(le Python
par exemple, même si je ne m'y connais pas).
SVP aidez moi

**koala01** · 28/06/2019, 13h11

Cela fait un temps bête que je n'ai plus joué avec les CSS, donc je ne suis sans doute plus vraiment à jour. Mais il me semble que tu pourrais t'inspirer de ce tutoriel qui me semble pas mal.

**gael21** · 29/06/2019, 02h00

Toujours pas de solution.
J'essayé de laisser tomber le positionnement (absolu, relatif et fixe) au profit des marges. en effet, je me suis dit qu'en jouant avec les marges (margin-top, margin-left,...), je pouvais reussir. Sauf que même là, la mise en forme n'est pas appliquée.
Là présentement j'ai vu dans la doc que je pouvais me servir de la classe QTextLayout pour dessiner n'importe où en me servant de la classe QTextCursor.
alors je vais me lancer dans ce sens et vous reviens dès qu'il y a du nouveau.

**gael21** · 29/06/2019, 15h33

C'est encore moi qui reviens bredouille de mes aventures avec Qt pour faire une impression en pdf. J'ai trouvé très fastidieux la méthode d'utiliser lun QTextLayout en me servant d'un QTextCursor. De plus, cette méthode n'est pas flexible. Par exemple, si je veux imprimer dans mon projet final des tonnes de tables dont le nombre de colonnes diffère, je serai obligé de faire autant de QTextLayout que j'aurai d'impression à faire...Catastroph!!!

Alors j'ai cherché du côté de QPdfWritter mais ça n'a rien donné de bon sauf si quelqu'un a réussi de son côté.

Mais ce lien https://doc.qt.io/archives/qtjambi-4...intsystem.html m'a mis sur une bonne piste. En fait il se trouve qu'en combinant QPainter, QPaintEngine et QPrintEngine, je peux réussir à faire ce que je veux. Mais pour cela, je devrai construire mon propre moteur d'impression en dérivant à la fois de QPaintEngine et QPrintEngine, et en réimplémentant la méthode void paintEvent(QPaintEvent *event). Plus bas se trouve mon Impression.cpp

Le souci c'est que je ne connais absolument pas comment faire dans mon constructeur. J'ai l'intention de faire de cette classe, la classe de toutes mes fonctions d'impression; il me faut donc configurer mon moteur d'impression dans le/les constructeur de cette classe. Par exemple parmi les valeurs de l'enum type de la classe QPaintEngine, se trouve des valeurs relatives ausystème d'exploitation. et puisque ce qui ne marche pas chez moi(sur Windows) marche sur LINUX, j'aimerai pouvoir modifier cette valeur pour voire ce qui se passe.

Mais je ne sais pas comment m'y prendre. En gros là presentement j'aimerai construire mon moteur d'impression . SOS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
#include "impression.h"
 
Impression::Impression(QString texte, QString titre, QWidget *parent)
    : QWidget(parent), m_texte(texte), m_titre(titre)
{
 
}
 
Impression::Impression(QWidget *parent) :  QWidget(parent)
{
 
}
 
void Impression::paintEvent(QPaintEvent *event)
{
    QPainter *painter = new QPainter(this);
    QTextDocument doc;
    doc.setHtml("<strong>What's wrong</strong> with <em>this code?</em>");
    QAbstractTextDocumentLayout::PaintContext context;
    doc.setPageSize(QSize(2100,2970));
    doc.documentLayout()->draw(painter, context);
 
    delete painter;
}
 
Impression::~Impression()
{
 
}

Impression avec mise en page CSS sur Windows

Vue hybride

Discussions similaires

Partager

Partager