QPrinter preview not respecting html



  • Hi all.

    For some reason i'm unable to get my tables to use the full width of the preview widget, and thus, unable to print using the papar full width. What's funny is that the same html code seen on a browser doesn what it's supposed to.
    Here are the two outputs:

    • from application
      0_1530029208201_printer-problem-application.png

    • from web browser
      0_1530029215765_printer-problem-browser.png

    The printer is setup in the following way

    QPrinter printer(QPrinter::ScreenResolution);
    printer.setPaperSize(QPrinter::A4);
    printer.setFullPage(true);
    

    What i'm trying to achieve is what's shown in the browser. Any clues?


  • Qt Champions 2017

    Hi
    Might be the html.
    Do you print using QTextDocument ?
    Have you tried viewing the html in the widget and see if that looks same ?



  • @mrjj said in QPrinter preview not using full width:

    Hi
    Might be the html.

    Yeah, that's why i exported the generated html to file and viewed it in the browser. Browser shows how I want it to be

    Do you print using QTextDocument ?

    Yup

    Have you tried viewing the html in the widget and see if that looks same ?

    Only the QPrintPreviewDialog. Isn't it the same?



  • @nwoki
    Since it's almost certainly the HTML, what does that look like for the table you're trying to print?



  • @JonB sure. Here you go. This is the generated table html (it was all a mess, i just formatted it so it wouldn't hurt your eyes). The html uses the following css that's defined in the <head> section as follows:

    <html>
        <head>
            <style>
                table.data {
                    width: 50%;
                }
                table.registers {
                    width: 100%;
                    border: 1px solid black;
                }
                th {
                    background: #bebebe;
                }
                td.center {
                    text-align: center;
                }
                td.section {
                    font-weight: bold;
                }
            </style>
        </head>
        <body>
    
    <table class=registers>                      
        <tr>                      
            <th style=text-align:left;>DESCRIPTION</th>                      
            <th>UM</th>                      
            <th>MIN</th>                      
            <th>MAX</th>                      
            <th>VALUE</th>                  
        </tr>
        <tr>                                     
            <td>FCR - P gain</td>                                     
            <td class=center></td>                                     
            <td class=center>0</td>                                     
            <td class=center>60000</td>                                     
            <td class=center>0</td>                                 
        </tr>
        <tr>                                     
            <td>FCR - I gain</td>                                     
            <td class=center></td>                                     
            <td class=center>0</td>                                     
            <td class=center>60000</td>                                     
            <td class=center>0</td>                                 
        </tr>
        <tr>                                     
            <td>AVR - P gain</td>                                     
            <td class=center></td>                                     
            <td class=center>0</td>                                     
            <td class=center>60000</td>                                     
            <td class=center>0</td>                                 
        </tr>
        <tr>                                     
            <td>AVR - I gain</td>                                     
            <td class=center></td>                                     
            <td class=center>0</td>                                     
            <td class=center>60000</td>                                     
            <td class=center>0</td>                                 
        </tr>
        <tr>                                     
            <td>AVR - D gain</td>                                     
            <td class=center></td>                                     
            <td class=center>0</td>                                     
            <td class=center>60000</td>                                     
            <td class=center>0</td>                                 
        </tr>
        <tr>                                     
            <td>AVR - TD constant time (AVR)</td>                                     
            <td class=center>s</td>                                     
            <td class=center>1</td>                                     
            <td class=center>1000</td>                                     
            <td class=center>0</td>                                 
        </tr>
        <tr>                                     
            <td>PF - P gain</td>                                     
            <td class=center></td>                                     
            <td class=center>0</td>                                     
            <td class=center>60000</td>                                     
            <td class=center>0</td>                                 
        </tr>
        <tr>                                     
            <td>PF - I gain</td>                                     
            <td class=center></td>                                     
            <td class=center>0</td>                                     
            <td class=center>60000</td>                                     
            <td class=center>0</td>                                 
        </tr>
        <tr>                                     
            <td>VAR - P gain</td>                                     
            <td class=center></td>                                     
            <td class=center>0</td>                                     
            <td class=center>60000</td>                                     
            <td class=center>0</td>                                 
        </tr>
        <tr>                                     
            <td>VAR - I gain</td>                                     
            <td class=center></td>                                     
            <td class=center>0</td>                                     
            <td class=center>60000</td>                                     
            <td class=center>0</td>                         
        </tr>
        <tr>                                     
            <td>TF constant time (PF/VAR)</td>                                     
            <td class=center>s</td>                                     
            <td class=center>1</td>                                     
            <td class=center>600</td>                                     
            <td class=center>0</td>                                 
        </tr>
    </table>
    


  • @nwoki
    Some thoughts, for you to play with:

    • The first thing I'd try is giving that a width: 100%; explicitly, and same for any containers it is inside. Any difference?
    • Just in case: quotes around the class attribute value: class="registers".
    • Make sure your style is indeed being acted on the preview, e.g. put in some color or border so that you can check it's having an effect.
    • Set an explicit pixel width on the table/columns. Make sure that works, then work backward from there.

  • Moderators

    @nwoki Did you try to click on the top right button in the preview dialog?



  • @JonB adding the following line solved most of my layout problems

    <meta name="qrichtext" content="1">
    

    Line which i didn't find explained as a requisite in the qt docs. Here is the html file in full (generated from my code). If you check it on the mozilla html validator you will see that the html is correct according to standards. So why can't the QTextEdit widget (which then prints to the printer for the QPrinterPreviewDialog) correctly format the html file as seen on any web browser (you can check the desired effect by opening the file in your browser). ?

    https://drive.google.com/open?id=1n3juS2TWD-u_crwNolACdto2gFdgaNus



  • this is what the new layout looks like (whilst all is well on a web page)
    0_1530103860314_newtextviewlayout.png



  • @nwoki

    So why can't the QTextEdit widget (which then prints to the printer for the QPrinterPreviewDialog) correctly format the html file as seen on any web browser

    What makes you think that the "preview widget" should be identical to "any web browser"? It isn't a web browser. It's its own code. (For example, it's not the same as using the Chromium engine in a QWebEnginePage, which I would expect to be identical. When I use QTextDocument, I use its toHtml() method and pass that to QWebEnginePage for previewing/printing.) I suspect there will always be differences between previewing off a QTextDocument directly compared against using a web engine?



  • @JonB said in QPrinter preview not respecting html:

    @nwoki

    So why can't the QTextEdit widget (which then prints to the printer for the QPrinterPreviewDialog) correctly format the html file as seen on any web browser

    What makes you think that the "preview widget" should be identical to "any web browser"? It isn't a web browser. It's its own code. (For example, it's not the same as using the Chromium engine in a QWebEnginePage, which I would expect to be identical. When I use QTextDocument, I use its toHtml() method and pass that to QWebEnginePage for previewing/printing.) I suspect there will always be differences between previewing off a QTextDocument directly compared against using a web engine?

    Thought that it could interpret the html code as there was the function setHtml. But, as you stated, the QWebEngineView is the way to go for this sort of thing. Passing through the QWebEnginePage for the preview before printing is the way to go. Problem seems solved as now the html is correctly interpreted and saved to pdf/printed.

    Thank you very much



  • @nwoki
    I actually think/assume that HTML is not the way QTextDocument stores things. I think it stores the content "internally": toHtml() generates an HTML representation on demand, setHtml() does a one-time parse to internal format, and you can't have arbitrary, non-QTextDocument elements in the input. I also think/assume that printing is done directly, not via HTML.

    I didn't realize you'd go off and do it via QWebEnginePage route, but well done! I do it that way for historical reasons: I started using a QTextDocument only after I had a working QWebEngineView with HTML preview & PDF printing already coded, so I thought I'd leverage that when I wanted to export/print from the QTextDocument. I didn't think there would be much difference in final output.


  • Qt Champions 2017

    Hi
    One key thing to remember is that the RICH text support in
    QTextDocument is NOT fullblown html.
    Its more like a modern version of RTF.
    http://doc.qt.io/qt-5/richtext-html-subset.html

    So its not promised or expected it to render like a full blown browser.


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.