Friday, May 3, 2024
2
rated 0 times [  2] [ 0]  / answers: 1 / hits: 1213  / 3 Years ago, wed, july 28, 2021, 4:52:03

I read this Question:
Can I develop a hybrid native/HTML5 app for the Ubuntu Phone?



And it has a great answer, but that is no longer supported in the Ubuntu SDK (Ubuntu 13.04), now it uses:



import QtQuick 2.0
import Ubuntu.Components 0.1
import QtWebKit 3.0


And there are some errors when trying to call the "settings" of WebView:



Cannot assign to non-existent property "settings"


Digging in the web I found some solution, sadly doesn't work for me.



import QtQuick 2.0
import Ubuntu.Components 0.1
import QtWebKit 3.0
import QtWebKit.experimental 1.0

MainView {
// objectName for functional testing purposes (autopilot-qt5)
objectName: "mainView"
// Note! applicationName needs to match the .desktop filename
applicationName: "Gastos"

width: units.gu(100)
height: units.gu(75)

Page {
id: page
title: "HTML5 App"

Flickable {
id: webViewFlickable
anchors.fill: parent

WebView {
experimental.preferences.developerExtrasEnabled: true
experimental.preferences.javascriptEnabled: true
id: webView
anchors.fill: parent
url: "html/index.html"

onTitleChanged: {
page.title = title;
}
}
}
}
}


Some Warnings are shown but it starts well.



WARNING: This project is using the experimental QML API extensions for QtWebKit and is therefore tied to a specific QtWebKit release.

WARNING: The experimental API will change from version to version, or even be removed. You have been warned!


No developer tools though. Right click doesn't work, perhaps I'm missing something? Any help will be greatly appreciated.



Thanks in advance


More From » application-development

 Answers
5

The trick is to use WebKit's remote inspector. Here's how I got it working in QtCreator 3.0:




  • Download Google Chrome if you don't already have it. (I believe Safari also works.)

  • In QtCreator, click "Projects" in the left column, then click the "Run" tab at the top.

  • Next to "Run Environment", click the "Details" drop-down.

  • Click "Add" to add a new environment variable.

  • Set a variable named QTWEBKIT_INSPECTOR_SERVER and set the value to any unused local port number, for example 9999

  • Run your project

  • Open Chrome and enter the following URL: http://127.0.0.1:9999



It may take a moment to come up. If the URL isn't working you can use a tool like Microsoft TCPView (on Windows) to make sure your process has the port open.



The trick to enabling the remote inspector in Qt comes from this post: https://lists.webkit.org/pipermail/webkit-qt/2012-April/002646.html


[#30341] Friday, July 30, 2021, 3 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
confiorc

Total Points: 42
Total Questions: 121
Total Answers: 123

Location: India
Member since Wed, Aug 26, 2020
4 Years ago
;