Search the Community
Showing results for tags 'retina pixel density'.
Found 1 result
-
I have a very simple test page: http://battleofhoth.com/test.html (below) I select a single frame from an atlas (frames are 256px wide and 128px tall) It works fine on all devices I've tried except iphone 4 & 5 (ios7) where I get a 'frame' selected of 512px wide and 256px tall I've looked for differences between my example and some correctly working examples, forum, docs, but I just can't seem to get it Sorry probably a newbie oversight Thanks <html> <head> <script src="assets/phaser.min.js"></script> <script> var spriteAreas = { 'frames': [ { 'filename': 'redbox', 'frame': { 'x': 0, 'y': 0, 'w': 256, 'h': 128 } // I expect to see a redbox ( just the top left frame of my atlas) // on iphone 5 I see 512px wide & 256px high (i.e. top 2 wide and 2 deep 'frames' of my sprite) } ] } var game = new Phaser.Game(400, 400, Phaser.CANVAS, 'test', null, true, false); var BasicGame = function (game) { }; BasicGame.Boot = function (game) { }; BasicGame.Boot.prototype = { preload: function () { game.load.atlas('hothSprites', 'assets/images/hoth.png', null, spriteAreas); game.canvas.getContext("2d").scale(window.devicePixelRatio, window.devicePixelRatio); }, create: function () { game.add.sprite(0, 0, 'hothSprites', 'redbox'); } }; game.state.add('Boot', BasicGame.Boot); game.state.start('Boot'); </script> </head> <body> <div id="test" style="border: 0"></div> </body ></html>