gpt4 book ai didi

javascript - 如何在 ionic 中的特定页面实现移相器游戏

转载 作者:行者123 更新时间:2023-11-28 02:53:51 26 4
gpt4 key购买 nike

我正在创建一个商业应用程序,您在这个应用程序中登录,下面有五个选项卡,一旦您在其中一个选项卡中单击“创建”,我就会尝试启动一个移相器游戏,但是我对这个和他们是新手对 ionic 和移相器组合没有多大帮助。我遇到的问题是我在我的索引文件中为移相器和 ionic 创建了两个 div,但我只想在其中一个选项卡上使用移相器而不是在每个屏幕上重叠。如我的索引文件所示。

这是我的索引文件

<!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>

我希望我可以将启动游戏的代码转移到移相器页面的 Controller 中,但是我试过了,但我无法让它工作,请耐心等待我,因为我是一个初学者:)

页面 Controller

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








})

最佳答案

我喜欢 phaser.io 但我还没有使用 ionic,也许这个例子可以帮助你在点击后启动你的应用程序,因为它使用与游戏状态相同的设计

https://github.com/EnclaveGames/Monster-Wants-Candy-demo

关于javascript - 如何在 ionic 中的特定页面实现移相器游戏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38154558/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com