Qt 6.11 is out! See what's new in the release
blog
QTextDocument html print preview looks strange
-
Hy I have a html file and want to print it via QTextDocument.
The html code see below:
If i open the file in chrome the tables are among each other.
But in the qt print preview the tables overlaps each other.Can you help me?
<!DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" type="text/css" href="file:///C:/temp/EBO/style.css"> <!--<link rel="stylesheet" type="text/css" href="file:///C:/projects/svn/stdStatistics/data/stdStatistics/stdStatistics.css">--> </head> <body> <table width="83%" style="margin-top:30px;"> <tr> <th align="right" style="font-size: 11pt;color: grey;">Verkehrs- und Betriebszentrale</th> </tr> </table> <div style="border-bottom: 3px solid black;margin-top: 30px;"> <p style="font-size: 13pt;">Meldung besonderer Vorkommninsse<hr></p> </div> <div style="margin-top: 30px;"> </div> <table border="1" border-color="red" cellspacing="0" width="100%" style="border: 1px solid;"> <tr> <th align="left">Tunnel</th> <th align="left">Allach</th> </tr> <tr> <th align="left">Fahrtrichtung</th> <th align="left">Salzburg</th> </tr> <tr> <th align="left">Ereignisart</th> <th align="left">Unfall</th> </tr> <tr> <th align="left">Detailtext</th> <th align="left">EreignisNr. 9</th> </tr> <tr> <th align="left">Aktiv</th> <th align="left">19.01.2017 09:10 - 19.01.2017 09:50</th> </tr> <tr> <th align="left">Meldungen</th> <th></th> </tr> <tr> <th align="left">Benutzer</th> <th align="left">aaaaaaaa</th> </tr> </table> <div style="align:center;float:center; width:100%;"> <p align="center" style="font-size:12pt;align:center;float:center; width:100%;" >Anweisnungen</p> <div style="margin-top: 20px;"> </div> <table border="1" width="48%" cellspacing="0" style="float:left; border: 1px solid;"> <tr > <th style="border: 1px solid black;"> Anweisungstext 1 </th> </tr> </table> <table border="1" width="48%" cellspacing="0" style="float:right; margin-bottom:20px; "> <tr> <th align="left" colspan="2" border="1"> Erledigt </th> </tr> <tr> <th align="left" style="border: 1px solid black;"> am </th> <th align="left" style="border: 1px solid black;"> 19.01.2017 09:11:00 </th> </tr> <tr> <th align="left" colspan="2" border="1"> Text aus Dropdownfeld </th> </tr> <!--<tr border="0"> <th> </th> </tr> <tr> <th colspan="2" > Text aus Dropdownfeld </th> </tr>--> </table> <table border="1" cellspacing="0" width="100%" style="width:100%; float:right; margin-bottom:20px;"> <tr> <th align="left" colspan="2">Kommentare</th> </tr> <tr> <th align="left"> 01 </th> <th align="left"> Nur anzeigen wenn es Kommentare gibt </th> </tr> <tr> <th align="left"> 02 </th> <th> Nur anzeigen wenn es Kommentare gibt </th> </tr> </table> <table border="1" width="48%" cellspacing="0" style="float:left; border: 1px solid;"> <tr > <th style="border: 1px solid black;"> Anweisungstext 1 </th> </tr> </table> <table border="1" width="48%" cellspacing="0" style="float:right; margin-bottom:20px; "> <tr> <th align="left" colspan="2" border="1"> Erledigt </th> </tr> <tr> <th align="left" style="border: 1px solid black;"> am </th> <th align="left" style="border: 1px solid black;"> 19.01.2017 09:11:00 </th> </tr> <tr> <th align="left" colspan="2" border="1"> Text aus Dropdownfeld </th> </tr> <!--<tr border="0"> <th> </th> </tr> <tr> <th colspan="2" > Text aus Dropdownfeld </th> </tr>--> </table> <table border="1" cellspacing="0" width="100%" style="width:100%; float:right; margin-bottom:20px;"> <tr> <th align="left" colspan="2">Kommentare</th> </tr> <tr> <th align="left"> 01 </th> <th align="left"> Nur anzeigen wenn es Kommentare gibt </th> </tr> <tr> <th align="left"> 02 </th> <th> Nur anzeigen wenn es Kommentare gibt </th> </tr> </table> <!--<div> <div style="float:left; width:50%;"> <table border="1" cellspacing="0" style=" width:100%;" > <tr> <th> Anweisungstext 1 </th> </tr> </table> </div> <div style="float:right; width:50%;" > <table border="1" cellspacing="0" style=" width:100%;"> <tr> <th colspan="2"> Erledigt </th> </tr> <tr> <th> am </th> <th> 19.01.2017 09:13:00 </th> </tr> </table> <table border="1" cellspacing="0" style=" width:100%;"> <tr> <th> Text aus Dropdownfeld </th> </tr> </table> </div> <table border="1" cellspacing="0" width="100%"> <tr> <th colspan="2">Kommentare</th> </tr> <tr> <th> 01 </th> <th> Nur anzeigen wenn es Kommentare gibt </th> </tr> <tr> <th> 02 </th> <th> Nur anzeigen wenn es Kommentare gibt </th> </tr> </table> </div>--!> </body> </html> -
QTextDocument do not support all HTML features - only limited HTML subset, so you can do one of following:
- Try to intuitively optimize your HTML code for QTextDocument: layout page elements using tables instead of divs, etc.
- Print HTML with QWebView::print method (QtWebKit module)
- Print HTML with QWebEnginePage::print method (QtWebEngine module) - only for Qt 5.8
Unfortunately, QtWebKit module was removed in Qt 5.6 and QWebEnginePage::print method was added only in Qt 5.8, so par.1 and par.2 cannot simply be used in Qt 5.6 & 5.7