Webview コンポーネントと HTML_html/css_WEB-ITnose の概要

Deviceone プラットフォームは、html5 に基づくクロスプラットフォーム開発ツールではありません。アプリを開発するときは常にネイティブ コンポーネントを使用しますが、レポート グラフなどの複雑なグラフィックスとテキストの混合 (ニュースに似た) など、特定のシナリオでは HTML5 も非常に良い選択です。 HTML。 HTML 関連のテクノロジに精通している場合は、さらに多くのシナリオでそれを使用することもできます。

これを 2 つの側面から紹介します:

Web ページの読み込み

Web ページの読み込みは、url 属性をローカル HTML (data://、source:// プロトコル) と Web に設定することで非常に簡単です。ページ (http://、https:// プロトコル)。
do_Webview は、Web ページを埋め込みブラウザで開くと考えることができます。通常、携帯電話にはデフォルトのブラウザが搭載されています。 do_Webview。
もちろん、まだ微妙な違いがあるかもしれませんが、ブラウザは比較的成熟しており、耐障害性と互換性が優れています。

var webview = ui("do_webview_id1");webview.url = "source://view/test.htm";webview.url = "http://www.baidu.com"

HTML 関連の技術は多すぎるため、ここでは紹介しませんし、deviceone プラットフォームの範囲内ではありません。

deviceone の他のコンポーネントを呼び出す

これが重要なポイントです。 do_Webview コンポーネントは、deviceone によって提供される多くのコンポーネントの 1 つであり、他のコンポーネントと対話できます。 HTML 内の js コードは、他の MM、SM、UI コンポーネントを呼び出すことができます。

これは、ui.js での deviceone API の呼び出しに似ています。唯一の違いは、deviceone 関連のすべての操作を onDeviceOneLoaded コールバック関数に配置する必要があることです。このコールバック関数は、JQuery の Ready メソッドに似ています。

SMとMMの使用方法はまったく同じですが、ページをトリガーするメッセージを通じてUIを操作することをお勧めします。たとえば、test.html は test.ui の Webview コンポーネントにロードされます。test.html が test.ui の他の UI を制御する必要がある場合、最良の方法は、test.html の JS コードにページスコープのメッセージを送信することです。 . test.ui.js、test.ui.js で他の UI コンポーネントを操作します。
SM、MM、UI を呼び出す方法を完全に示した次の例を参照できます:

//login.html<Script>    var login = document.getElementById("login");    var back = document.getElementById("back");    //所有和deviceone相关的调用都需要放在onDeviceOneLoaded回调函数里，类似JQuery的ready方法    window.onDeviceOneLoaded = function() {        // sm对象的获取和在ui.js里获取没有差别        var nf = sm("do_Notification");        var app = sm("do_App");        var page = sm("do_Page");        login.onclick = function() {            var name = document.getElementById("loginName").value;            var pwd = document.getElementById("loginPwd").value;            if (!name || !pwd) {                //调用原生的alert方法                nf.alert("用户名或密码不能为空!")            } else                loginNewPage(http, page);        }        back.onclick = function() {            //点击html的按钮返回到前一个page            app.closePage();        }        // mm对象的创建和在ui.js里没有区别        var http = mm("do_Http");        http.method = "POST";        http.on("result", function(data) {            //对ui的操作最好是通过消息发送到ui.js里去做，而不是直接在html里操作            page.fire("progressbar", "hide");            if (data.status == 200) {                app.openPage({                    source : "source://view/main.ui",                    statusBarState : "transparent"                });            }        });    }    function loginNewPage(http, page) {        http.url = "http://www.baidu.com";        http.request();        //对ui的操作最好是通过消息发送到ui.js里去做，而不是直接在html里操作        page.fire("progressbar", "show");    }</Script>

上記の例は、ローカル HTML を追加することで、deviceone の任意の API に直接アクセスできることを示しています。ローカルの読み取りおよび書き込み操作はサポートされていません。

さらに、Web ページ、つまり http:// ページを読み込むと、実際には deviceone の任意の API にアクセスできるため、セキュリティ上の問題が発生するため、 do_Webview コンポーネントは、この属性が有効である場合にそれを制御する属性を追加します。 false の場合、deviceone の他のコンポーネントを呼び出すことはできません