ＳＱＬの窓 イラストAC フリー素材
<< Win2K、WinXP、Win7 ３世代同時運用のは… | TOP | IE9 以降で動作する JavaScript 配列 の … >>

2012年04月13日

アプリケーションバーを追加する : Win8 Metro(JS)

 
サンプルID

JavaScript and HTML5 touch game sample

オプションの意味についてはこちらのリファレンスを参考にします


<body>
    <!-- App bar -->
    <div id="appbar" data-win-control="WinJS.UI.AppBar" aria-label="Command Bar" data-win-options="{
        commands:[
            {id:'home', label:'Menu', icon:'&#xE10F;', section: 'global', onclick: GameManager.navigateHome},
            {id:'play', label:'Game', icon:'&#xE102;', section: 'global', onclick: GameManager.navigateGame},
            {id:'rules', label:'Rules', icon:'&#xE104;', section: 'global', onclick: GameManager.navigateRules},
            {id:'scores', label:'Scores', icon:'&#xE113;', section: 'global', onclick: GameManager.navigateScores},
            {id:'credits', label:'Credits', icon:'&#xE10C;', section: 'global', onclick: GameManager.navigateCredits},
            {id:'newgame', label:'New', icon:'&#xE10E;', section: 'selection', onclick: GameManager.game.newGame},
            {id:'pause', label:'Pause', icon:'&#xE103;', section: 'selection', onclick: GameManager.game.togglePause}
        ]}"></div>
</body>


"selection"は、選択したオブジェクトのコンテキスト内で表示するように意図されているコマンド
のためのものです。"global"は、常に特定のページに表示するコマンドです。

関連する Microsoft の暫定ドキュメント

メトロスタイルのアプリ用ナビゲーションの設計

GameManager はオブジェクトでは無く、このアプリで定義されている名前空間です
( メソッドは、default.js 内で定義されているユーザーメソッドです )


    WinJS.Namespace.define("GameManager", {
        navigateHome: navigateHome,
        navigateGame: navigateGame,
        navigateRules: navigateRules,
        navigateScores: navigateScores,
        navigateCredits: navigateCredits,
        showPreferences: showPreferences,
        onBeforeShow: onBeforeShow,
        onAfterHide: onAfterHide,
        game: game,
        state: state,
        assetManager: assetManager,
        scoreHelper: scoreHelper,
        gameId: gameId,
        touchPanel: touchPanel
    });
【オワコンの最新記事】
posted by at 2012-04-13 22:19 | Comment(0) | オワコン | このブログの読者になる | 更新情報をチェックする
SQLの窓全体の検索
Custom Search
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

※ブログオーナーが承認したコメントのみ表示されます。


Powered by Seesaa