Puis-je développer une application hybride native / HTML5 pour le téléphone Ubuntu?

Puis-je développer une application hybride qui a été utilisée en conjonction avec l'API native et HTML5 dans le téléphone Ubuntu?

Je sais qu'il est possible de développer une application native ou une application HTML5.

Cependant, je veux savoir développer une application native qui a une interface utilisateur HTML5 (hybride) dans Ubuntu Phone.

application-development ubuntu-touch html5 ubuntu-sdk user1793335
la source

Si vous faites référence à plus que simplement l'interface utilisateur basée sur QML, à laquelle la réponse de Salem a répondu, il existe des crochets dans le code natif via Apache Cordova J'étudie toujours Cordova, donc je n'ai pas de réponse complète pour vous, mais, là est la source à lire / télécharger ici: git-wip-us.apache.org/repos/asf?p=cordova-ubuntu.git;a=tree

OYRM

Réponses:

Je ne sais pas ce que vous entendez par "hybride" (une application C ++ qui affiche une webapp? Distribue le code de l'application entre C ++ / QML / javascript?), Mais vous pouvez utiliser le composant WebView pour afficher une page Web / webapp sur une application qml . Cela devrait également fonctionner sur Ubuntu Phone.

Prenez cette application simple composée de: "app.qml", "app.html" et "app.js" (ouais je sais, cette "application" est assez boiteuse ...). Cela n'a été testé qu'avec qmlviewer, donc si vous essayez de l'exécuter via un IDE, vous devrez probablement modifier quelque chose en ce qui concerne les chemins relatifs utilisés.

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);
};

J'espère que cela aide.

Salem
la source