How can I create a properly sizing QWebView?

Question

I want to make a QWebView appear expanding to the width and height so that ideally it will have no scroll bars. Some websites may have fixed widths that wont allow this, but I am not concerned with those. In any case, I cannot do as I wish because QWebView implements sizeHint as follows:

QSize QWebView::sizeHint() const
{
    return QSize(800, 600); // ####...
}

This is incorrect on a number of levels. 1. It doesnt at all take into account the size of the actual web page. 2. It doesnt take into account that the height and width are related to each other. (To prove #2 think about text in web pages that wraps to the next line.)

As a simple fix I tried to do (where QResizingWebView extends QWebView):

QSize QResizingWebView::sizeHint() const{
    return this->page()->mainFrame()->contentsSize();
}

While this is closer to the result, it also has 2 flaws. 1. It doesnt take into account the relation between the displayed width/height. 2. this->page()->mainFrame()->contentsSize() is inaccurate from what I can tell from my preliminary testing (it has returned heights larger than it should under many cases, although this may be related to #1).

Does anyone have any tips to fix this?

score 1 · Answer 1 · edited May 23 '17 at 11:48

According to this post on qtcentre.org, you should be able to correct the behavior by setting the size policy.

Update:

Without modifying the size policies at all, a QWebView in a default QHBoxLayout layout on a QWidget results in a web view that resizes properly within the QWidget at sizes greater than 800x600 (using QtCreator, C++, Windows 7, Qt 4.8.1).

Update 2:

I did some digging and found that this question relates to a previous question you posted that contains the relevant requirements :)

The following code seems to meet those requirements. The only relevant bits are that I changed the horizontal and vertical size policies of the QWebView to "expanding".

MainWindow.cpp:

#include "MainWindow.h"
#include "ui_MainWindow.h"

MainWindow::MainWindow(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
}

MainWindow::~MainWindow()
{
    delete ui;
}

MainWindow.ui:

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>MainWindow</class>
 <widget class="QWidget" name="MainWindow">
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>587</width>
    <height>442</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>MainWindow</string>
  </property>
  <layout class="QHBoxLayout" name="horizontalLayout">
   <item>
    <widget class="QLabel" name="label">
     <property name="text">
      <string>TextLabel</string>
     </property>
     <property name="alignment">
      <set>Qt::AlignLeading|Qt::AlignLeft|Qt::AlignTop</set>
     </property>
    </widget>
   </item>
   <item>
    <layout class="QVBoxLayout" name="verticalLayout">
     <item>
      <widget class="QLabel" name="label_2">
       <property name="text">
        <string>TextLabel</string>
       </property>
       <property name="alignment">
        <set>Qt::AlignLeading|Qt::AlignLeft|Qt::AlignTop</set>
       </property>
      </widget>
     </item>
     <item>
      <widget class="QWebView" name="webView">
       <property name="sizePolicy">
        <sizepolicy hsizetype="Expanding" vsizetype="Expanding">
         <horstretch>0</horstretch>
         <verstretch>0</verstretch>
        </sizepolicy>
       </property>
       <property name="url">
        <url>
         <string>http://www.google.ca/</string>
        </url>
       </property>
      </widget>
     </item>
    </layout>
   </item>
  </layout>
 </widget>
 <layoutdefault spacing="6" margin="11"/>
 <customwidgets>
  <customwidget>
   <class>QWebView</class>
   <extends>QWidget</extends>
   <header>QtWebKit/QWebView</header>
  </customwidget>
 </customwidgets>
 <resources/>
 <connections/>
</ui>

~~Update 3:~~ Update 4:

Given the URL provided in the comments. It displays as follows.

With a main window at 640x480:

enter image description here

With a main window at 1024x768:

enter image description here

I dont know why that worked for him, it really shouldnt have. (it doesnt work for me, i tried many times) — chacham15, Sep 01 '12 at 05:05
Perhaps I don't understand correctly. If I use a QWidget as a main window and put a QWebView on it within a horizontal layout, The QWebView expands to fill the main window and only displays scroll bars if the web page content forces a size that is larger than the current window. — Arnold Spence, Sep 01 '12 at 05:48
Yes, what happens is HBoxLayout asks the QWidget what size it would like to be. sizeHint is what answers that question. sizeHint says that it would like to be 800x600, regardless of what the size of the actual content is. Therefore, the QHBoxLayout will expand to that 800x600 to accomodate the sizeHint size. Then when the actual rendering is done, it turns out that the content is much larger than the sizeHint stated. Because of that, scroll bars are inserted even though the sizePolicy says to expand. — chacham15, Sep 01 '12 at 06:34
When I size my window much larger than 800x600, the QWebView expands to fill the entire window, no scroll bars displaying a 1024x768 image. — Arnold Spence, Sep 01 '12 at 08:11
Right, thats because you have just a single widget, therefore its preferred size doesnt matter. If, instead, you have multiple widgets and it needs to decide how much space to give to each, then the preferred size matters. — chacham15, Sep 01 '12 at 15:48
+1 for effort, but that is exactly the solution i currently have causing the problem. it doesnt take into account the heightForWidth issue. — chacham15, Sep 01 '12 at 18:09
I've added screen caps using that URL. Does this match what you see with your app? — Arnold Spence, Sep 01 '12 at 19:06
Ok, that's kinda funny :) I've updated my screen shots above. Does this match what you see and if so, what do you expect to see? — Arnold Spence, Sep 01 '12 at 20:55
No, you see how the QWebView has a scroll bar? I want the view to be the size of the content. The scroll bar should be on the entire window — chacham15, Sep 01 '12 at 20:57
Ok, I think I understand. That is an unusual requirement and would be very difficult to achieve since a given html page will either fill its container as fully as it can, growing vertically as needed or to specify a specific width, in which case the container (web view) will display horizontal scroll bars. My knowledge of HTML however is limited but it may be easier to achieve what you want by manipulating the DOM or somehow fetching the page from within an HTML page with top and side frames. — Arnold Spence, Sep 01 '12 at 21:10

score 1 · Accepted Answer · answered Sep 01 '12 at 21:52

1

I got it working by implementing heightForWidth in a custom widget which extended QWebView

answered Sep 01 '12 at 21:52

chacham15

13,719
26
104
207

How can I create a properly sizing QWebView?

2 Answers2