1

設定チャームにAboutボタン(リンクの場合もある)を追加したい。しかし、設定チャームにコンテンツを表示したくないので、アプリケーションで About.html ページをナビゲートする必要があります。アプリ設定サンプルは役に立ちませんでした。これを達成する方法はありますか?JavaScript と HTML でこれを行う必要があります ;)

現在、以下のコードをdefault.jsに追加しました

 app.onactivated = function (eventObject) {
        if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) {
            //WinJS.UI.disableAnimations();

            WinJS.Application.onsettings = function (e) {
                e.detail.applicationcommands = {
                    "about": {
                        title: "About", href:"/html/About.html"
                        }
                }
                WinJS.UI.SettingsFlyout.populateSettings(e);
                };
...
}

html フォルダーの下に HTML ファイルを作成しました。About.html のコードは次のとおりです。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>About</title>

    <!-- WinJS references -->
    <script src="//Microsoft.WinJS.1.0/js/base.js"></script>
    <script src="//Microsoft.WinJS.1.0/js/ui.js"></script>


    <link rel="stylesheet" type="text/css" href="css/staticPages.css" />
    <script type="text/javascript" src="/js/navigator.js"></script>
    <script src="/js/jq-1.7.1.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="/js/networkInfo.js"></script>
    <script src="/js/About.js" type="text/javascript"></script>
</head>
    <body>
    <div id="siluet" class="siluet">&nbsp;</div>
    <div id="contentDetay">
        <button id="backbutton" class="win-backbutton">
        </button>
        <img id="headLogo" src="/images/head_logo.png" alt="XYZ" />
        <progress id="progressRing"></progress>
        <div id="title"><h1 id="groupNameHeader">Group Name</h1><h1 id="pageTitle">Page Title</h1><div id="sectionSelectArrow">&nbsp;</div></div>
        <div id="menuPopUp">
            <select id="menuList" multiple="multiple"></select>
        </div>

        <div id="staticContainer"></div>
        <div id="noSnapView">
            <p>İçeriği görüntüleyebilmek için ekranı büyütün</p>
        </div>
    </div>
</body>

</html>

設定チャーム バーの下にある [バージョン情報] リンクをクリックすると、/js フォルダーの下にある About.js ファイルでエラーが発生しました。

(function () {
    'use strict';

    var dataItems;
    var groupIndex;
    var sectionIndex;
    var itemIndex;

    function ready(element, options) {

        networkInfo.getInfo();
        pageTitle.style.display = "none"; // pageTitle.style is undefined

        var that = this;
        groupNameHeader.innerText = "About"; // groupNameHeader is undefined

        var aboutContent; // This content is retrieving from web service
        // staticContainer is undefined
        staticContainer.innerHTML = window.toStaticHTML(aboutContent);

    }  

     WinJS.Namespace.define("appGlobal", {
        fadeProgressRingOut: fadeProgressRingOut
    });
    WinJS.UI.Pages.define("/html/About.html", {
        ready: ready
    });

})();

ご覧のとおり、.js ファイルではすべての HTML 要素が定義されていません。しかし、私は理由を見つけることができませんでした。

4

2 に答える 2

3

JavaScriptアプリ設定のサンプルは、設定チャームにボタンを追加する方法を詳細に示しています。

開始するためのスニペットは次のとおりです。

WinJS.Application.onsettings = function (e) {
    e.detail.applicationcommands = {
        "aboutDiv": { title: "About", href: "/html/About.html" }
    };
    WinJS.UI.SettingsFlyout.populateSettings(e);
};
于 2012-09-21T13:49:00.553 に答える
2

次のようにコードを変更すると、問題が解決する場合があります。

app.onactivated = function (eventObject) {
    if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) {
        //WinJS.UI.disableAnimations();

       var settingsPane = Windows.UI.ApplicationSettings.SettingsPane.getForCurrentView();
       settingsPane.addEventListener("commandsrequested", onCommandsRequested);

    // ...

}

function onSettingsCommand(){
    nav.navigate("html/about.html");
}

function onCommandsRequested(eventArgs){
    var settingsCommand = new Windows.UI.ApplicationSettings.SettingsCommand("about", About", onSettingsCommand);
    eventArgs.request.applicationCommands.append(settingsCommand);
}
于 2012-09-24T13:12:40.840 に答える