[webkit-qt] QML2 WebView and viewport meta tag (on Desktop)

Fri Feb 15 03:12:55 PST 2013

I just tried it on my android tablet, where it works.  It could be that the
params are interpreted differently on chrome/mobile and qml2/webview.

I'll try without min/max scale now.

br
Lars

On Fri, Feb 15, 2013 at 12:10 PM, Jocelyn Turcotte <
jocelyn.turcotte at digia.com> wrote:

> Hello Lars,
>
> This is pretty rusty stuff in my head, but doesn't maximum-scale=1 mean
> that you force a 1:1 pixel ratio of the page pixels with screen pixels?
>
> To me it feels that using anything else than "width=device-width" with
> "maximum-scale=1" means that you do not want a view that fits the screen to
> width.
>
> br,
> Jocelyn
>
>
> On Fri, Feb 15, 2013 at 11:57:37AM +0100, Lars Knudsen wrote:
> > Hi,
> >
> > I am having some trouble getting WebView to respect the viewport meta
> tag.
> >
> > I am including a test project (qt5) that should show the problem.
> >
> > In the index.html file, I have:
> >
> > <!DOCTYPE html>
> >
> > <html>
> >
> > <head>
> >
> >   <title>Demo App</title>
> >
> >   <meta name="viewport" content="width=1024, initial-scale=1,
> > maximum-scale=1, user-scalable=no">
> >
> >   <style type="text/css">
> >
> >  #block {
> >
> >      position: absolute;
> >
> >      left: 256px;
> >
> >      top: 256px;
> >
> >      width: 512px;
> >
> >      height: 512px;
> >
> >      background-color: red;
> >
> >  }
> >
> > </style>
> >
> > </head>
> >
> > <body>
> >
> > <h1>TEST</h1>
> >
> > <div id="block"></div>
> >
> > </body>
> >
> > </html>
> >
> >
> >
> > In the main.cpp, I have:
> >
> >     QtQuick2ApplicationViewer viewer;
> >
> >
> >     viewer.setResizeMode(QQuickView::SizeRootObjectToView);
> >
> >
> >
> viewer.setMainQmlFile(QStringLiteral("qml/SimpleWebAppRunner/main.qml"));
> >
> >
> >     // Select the app to load
> >
> >     QQmlProperty property((QObject*)(viewer.rootObject()), "appToLoad");
> >
> >     property.write("SimpleWebApp");
> >
> >
> >     viewer.showExpanded();
> >
> >
> > In the QML, I have:
> >
> > import QtQuick 2.0
> >
> > import QtWebKit 3.0
> >
> >
> > Rectangle {
> >
> >     id: rootPanel
> >
> >     width: 800
> >
> >     height: 600
> >
> >
> >     property string appBaseUrl: "../../apps/"
> >
> >     property string appToLoad:  ""
> >
> >
> >     WebView {
> >
> >         id: webView
> >
> >         anchors.fill: parent
> >
> >         url: ""
> >
> >         onUrlChanged: console.log("Loading " + url)
> >
> >     }
> >
> >
> >     onAppToLoadChanged: {
> >
> >         webView.url = appBaseUrl + appToLoad + "/index.html"
> >
> >     }
> >
> > }
> >
> >
> >
> > The whole web view seems to resize fine when resizing the QML window -
> but
> > content does not scale like it should (like on a mobile device) -
> > basically, scaling/zooming it <window width>/<viewport witdth=1024px>.
> >
> > Can anyone tell me what I am doing wrong? (maybe I am just blind from
> > looking at the code too long - and the answer is obvious.. please tell
> :)).
> >
> > br
> > Lars
>
>
> > _______________________________________________
> > webkit-qt mailing list
> > webkit-qt at lists.webkit.org
> > https://lists.webkit.org/mailman/listinfo/webkit-qt
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-qt/attachments/20130215/3b23d6b8/attachment.html>