Kann ich eine hybride native / HTML5-App für das Ubuntu Phone entwickeln?

Kann ich eine Hybrid-App entwickeln, die in Verbindung mit der nativen API und HTML5 in Ubuntu verwendet wurde?

Ich weiß, dass es möglich ist, entweder eine native App oder eine HTML5-App zu entwickeln.

Ich möchte jedoch wissen, wie man eine native App mit einer HTML5-Benutzeroberfläche (Hybrid) in Ubuntu Phone entwickelt.

application-development ubuntu-touch html5 ubuntu-sdk user1793335
quelle

Wenn Sie sich auf mehr als nur die QML-basierte Benutzeroberfläche beziehen, auf die Salems Antwort eingegangen ist, gibt es Hooks in nativen Code über Apache Cordova. Ich studiere immer noch Cordova, daher habe ich keine vollständige Antwort für Sie, aber dort ist Quelle zum Lesen / Herunterladen hier: git-wip-us.apache.org/repos/asf?p=cordova-ubuntu.git;a=tree

OYRM

Antworten:

Ich bin nicht sicher, was Sie mit "Hybrid" meinen (eine C ++ - App, die eine Webanwendung anzeigt? App-Code zwischen C ++ / QML / Javascript verteilen?), Aber Sie können die WebView-Komponente verwenden, um eine Webseite / Webapp in einer XML-Anwendung anzuzeigen . Dies sollte auch auf Ubuntu Phone funktionieren.

Nehmen Sie diese einfache Anwendung, die aus "app.qml", "app.html" und "app.js" besteht (ja, ich weiß, diese "Anwendung" ist ziemlich lahm ...). Dies wurde nur mit getestet. qmlviewerWenn Sie also versuchen, es über eine IDE auszuführen, müssen Sie wahrscheinlich etwas in Bezug auf die verwendeten relativen Pfade ändern.

app.qml

import QtQuick 1.0
import QtWebKit 1.0

Rectangle {
        width: 800
        height: 600
        WebView {
                url: "app.html"
                anchors.fill: parent
                preferredWidth: 800
                preferredHeight: 600
                smooth: false
                settings.developerExtrasEnabled : true 
                settings.javascriptEnabled: true
        }
}

app.html

<!doctype html>
<html lang="en">
<head>
        <meta charset="UTF-8">
        <title>Hi</title>
        <style>
        body {
                margin: 20px;
        }
        </style>
</head>
<body>
        <a href="#" id="test_me">Click me!</a>
</body>
<script src="app.js"></script>
</html>

app.js.

var x = document.getElementById("test_me");
x.onclick = function(){
        console.log("Hi there");
        new_elem = document.createElement("h2");
        new_elem.textContent = "Hi there!";
        document.getElementsByTagName("body")[0].appendChild(new_elem);
};

Ich hoffe es hilft.

Salem
quelle