2016-07-01 7 views
2

私はビジネスアプリケーションを作成しています。このアプリケーションではログインして、下に5つのタブがあります。一つに作成をクリックするとフェイザーゲームを開始しようとしていますしかし、私はこれに新しいですし、イオンとフェイザーの組み合わせにはあまり役に立ちません。私が抱えている問題は、私はphaserとionicのインデックスファイルに2つのdivを作成していますが、私はすべての画面上で重なっているのではなく、タブの1つに位相器が必要です。私のインデックスファイルに示されているように。ここでionierで特定のページにフェイザーゲームを実装する方法

が私のインデックスファイル

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user- scalable=no, width=device-width"> 
<title></title> 


<script src="lib/ionic/js/ionic.bundle.js"></script> 

<!-- cordova script (this will be a 404 during development) --> 
<script src="cordova.js"></script> 

<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above 
<link href="css/ionic.app.css" rel="stylesheet"> 
--> 


<link href="lib/ionic/css/ionic.css" rel="stylesheet"> 


<style type="text/css"> 
    .platform-ios .manual-ios-statusbar-padding{ 
    padding-top:20px; 
    } 
    .manual-remove-top-padding{ 
    padding-top:0px; 
    } 
    .manual-remove-top-padding .scroll{ 
    padding-top:0px !important; 
    } 
</style> 

<script src="js/app.js"></script> 
<script src="js/controllers.js"></script> 
<script src="js/routes.js"></script> 
<script src="js/services.js"></script> 
<script src="js/directives.js"></script> 


<script type="text/javascript" src="js/phaser.min.js"></script> 
<script type="text/javascript" src="js/boot.js"></script> 
<script type="text/javascript" src="js/preload.js"></script> 
<script type="text/javascript" src="js/gameover.js"></script> 
<script type="text/javascript" src="js/main.js"></script> 
<script type="text/javascript" src="js/gametitle"></script> 





<script src="lib/ionicuirouter/ionicUIRouter.js"></script> 
<script type="text/javascript"> 
(function() { 
     scaleRatio = window.devicePixelRatio/3; 

    //Create a new game instance and assign it to the 'gameArea' div 
    game = new Phaser.Game(window.innerWidth * window.devicePixelRatio, (window.innerHeight * window.devicePixelRatio) -45 * window.devicePixelRatio, Phaser.AUTO, 'gameArea'); 

    //Add all states 
    game.state.add("Boot", Boot); 
    game.state.add("Preload", Preload); 
    game.state.add("GameTitle", GameTitle); 
    game.state.add("Main", Main); 
    game.state.add("GameOver", GameOver); 

    //Start the first state 
    game.state.start("Boot"); 
})(); 
</script> 
</head> 
<body> 

<div id='gameArea'></div> 
<div id="ionicControls" ng-app="app"> 

    <ion-nav-bar class="bar bar-header bar-balanced"> 



<ion-nav-buttons> 

<ion-icon> 
<img src="img/Logo (1).png" height="auto" width="35"> 
</ion-icon> 

</ion-nav-buttons> 
     <ion-nav-back-button class="button-icon icon ion-ios-arrow- back">Back</ion-nav-back-button> 

    </ion-nav-bar> 

    <ion-nav-view> 



    </ion-nav-view> 

    </div> 


    </body> 
    </html> 

は、これは私がフェイザーゲームを開始するページです、何私が疑問に思ってすることは

をクリックしたときに起動しますので、ここでのコードを実装する方法であります私はフェイザーは、このページに

<ion-view title="Room Design" id="page10" class=" "> 
<ion-content padding="true" class="has-header"> 
<a ui-sref="tabsController.contactUs" id="roomDesign-button6" class="      


button button-balanced button-block ">Save</a> 

</ion-content> 


</ion-view> 

を開始したい私は、しかし、私はそれと私を試してみました、私はフェイザーページのコントローラにゲームを開始コードを転送することができます期待していますコントローラは、私がphaser.ioが好きしかし、私は、まだおそらくこの例をイオンすることができます使用していないページ

.controller('roomDesignCtrl', function($scope) { 








}) 

答えて

関連する問題