• Content Count

  • Joined

  • Last visited

  1. Thanks for the replies, I already implemented bitmap fonts and they work perfectly. Thanks for the alternatives!
  2. Im having trouble rendering text that doesn't end up super pixilated. I'm finding it happens with most text, but mainly text that updates. Is there a good way to prevent text from becoming blurry? Im using fontface, would bitmap text be a better option?
  3. Thanks for replying! I've had a look into P2 physics and polygonal physics look like they could be the solution, however I'm unsure if this would work as the shape will be constantly updating. I'm still a little new to phaser, would you be able to give a little more info on how to approach this? Much appreciated!
  4. I'm drawing a line from one game pointer to another using bitmap data and it works pretty well, however I'm trying to enable a body and have it collide with another object. The bitmap line immediately takes up the entire screen, allowing no space for anything else to move. Using overlap instead of collide doesn't help either. Is there a better way to approach this, where only the drawn pixels are treated as the body? Thanks for any help! draw(){ let gameX = game.globals.SAFE_ZONE_WIDTH * 0.5 let gameY = game.globals.SAFE_ZONE_HEIGHT * 0.5 this.line = game.add.bitmapData(gameX*2 ,gameY*2); this.spriteLine = game.add.sprite(0, 0, this.line); game.physics.enable(this.spriteLine, Phaser.Physics.ARCADE);},drawLine(){ this.line.clear(); this.line.ctx.beginPath(); this.line.ctx.strokeStyle = "white"; this.line.ctx.lineCap = 'round'; this.line.ctx.moveTo(10, 10); this.line.ctx.lineTo(game.input.x , game.input.y); this.line.ctx.lineWidth = 12; this.line.dirty = true; this.line.ctx.stroke(); this.line.ctx.closePath(); this.line.render();},update(){ game.physics.arcade.collide(createBall.ball, createLine.spriteLine, this.gameFail, null, this); if (game.input.pointer1.isDown && game.input.pointer2.isDown) { createLine.drawLine(); } else { createLine.destroyLine(); }}
  5. bump! still can't seem to fix this...
  6. Do you have an example of this? And are you updated each child's x/y individually?
  7. Does anyone know a good way to ensure fonts render well? I'm finding that text is quite pixilated and I'm not sure what can be done to fix it. I'm using a custom .ttf, but find it still looks pixilated with default fonts such as Arial. It's still legible but looks pretty bad against higher res pngs. Also I'm using @font-face. Would appreciate it if anyone has any info on this!
  8. I've had this problem many times using Cocoon, and unfortunately the only way I could ever solve it was by back-tracking and testing on a trial and error basis until I found what was causing it to crash, as there's no easy way to debug (that I know of?) Mine was something completely random, I think it was to do with font properties and cocoon not liking the way it was rendering. Instead of : // Might be wrong params, only an examplescoreText = game.add.text(SAFE_ZONE_WIDTH/10, buttonY - 2, '0', 'custom', fontColour, fontSize); I had to write as: scoreText = game.add.text(SAFE_ZONE_WIDTH/10, buttonY - 2, '0'); scoreText.font = 'custom'; scoreText.fill = fontColour; scoreText.fontSize = fontSize;
  9. I was wondering if anyone knows a way I can detect if a tween is running for a certain amount of time. I've got a loading icon which needs to trigger an event if it runs for a certain length, kind of like a timeout. If anybody knows a good way to achieve this please share!
  10. Best way I fixed this was by duplicating the button, and having one the actual 'hit area' with alpha at 0. The button on top would be the visible sprite, but scaled accordingly. //menu button icon (no touch) menuButtonSmall = game.add.button(buttonX + 10, buttonY + 13, 'menuButton'); menuButtonSmall.scale.setTo(0.4,0.4); menuButtonSmall.fixedToCamera = true; menuButtonSmall.anchor.set(0.5,0.5); // menu button touch area (touch) menuOpenButton = game.add.button(buttonX + 10, buttonY + 13, 'menuButton'); menuOpenButton.fixedToCamera = true; menuOpenButton.anchor.set(0.5,0.5); menuOpenButton.alpha = 0;
  11. Does anyone know how reliable/accurate arcade collisions are? Im finding a sprite passes through a block roughly 1/50 times, and I can't recreate the error myself. I've read somewhere that phaser arcade collision isn't absolutely 100% accurate, especially at lower frame rates, could anyone confirm whether this is true? Thanks!
  12. I've only used Cocoon, which I find works really well on Canvas+. There are a handful of bugs and problems, but you can normally find the answer on these forums. I havn't used PhoneGap or crosswalk so afraid I can't help there.
  13. Finally got it working how I want! For those that want to know... I made some tiny amendments to dnassler's code from another thread (thank you!) (I'm working in portrait mode only) Set SAFE_ZONE_WIDTH/HEIGHT to whatever dimensions you want the important parts of your game in (UI etc). This is what I have at the beginning (boot/init/anywhere before new const SAFE_ZONE_WIDTH = 320;const SAFE_ZONE_HEIGHT = 568;var width = window.innerWidth * window.devicePixelRatio;var height = window.innerHeight * window.devicePixelRatio;var landWidth, landHeight; if ( height > width ) { landWidth = height; landHeight = width;} else { landWidth = width; landHeight = height;}var aspectRatioDevice = landHeight/landWidth;var aspectRatioSafeZone = SAFE_ZONE_HEIGHT / SAFE_ZONE_WIDTH;var extraWidth = 0, extraHeight = 0;if (aspectRatioSafeZone < aspectRatioDevice) { extraWidth = aspectRatioDevice * SAFE_ZONE_HEIGHT - SAFE_ZONE_WIDTH;} else { extraHeight = SAFE_ZONE_WIDTH / aspectRatioDevice - SAFE_ZONE_HEIGHT;}var game = new Phaser.Game(SAFE_ZONE_WIDTH + extraWidth, SAFE_ZONE_HEIGHT + extraHeight, Phaser.CANVAS, 'game', {preload: preload, create: create, update: update, render: render});Followed by this in Create: game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; game.scale.setShowAll(); game.scale.pageAlignHorizontally = true; game.scale.pageAlignVeritcally = true; game.scale.refresh();An important thing to remember is instead of finding the center of the window with window.InnerWidth use SAFE_ZONE_WIDTH/2, and the same for height. Hopefully this helps somebody else, I've been scouring through these forums and this is the only solution that seems to work for me (again thanks to dnlasser). The only problem I need to fix now is the pixelation from upscaling the game this way. If anybody knows any good ways to do this, please share!
  14. I've been looking at several different methods of resizing for Cocoon on this forum, but I can't get any to work the way I want! What I'm trying to achieve is a creating set 'safe' area, which is scaled proportionately on resize to fill the screen. I then want to add extra px to the canvas, filling any remaining gaps for when the safe area doesn't fit at that aspect ratio. I'm currently using a basic window.innerWidth + window.innerHeight, but everything ends up tiny on bigger screens! Am I right in thinking that you cant use the ScaleManager with cocoon? If anybody has achieved this successfully I would be very grateful for advice!
  15. Thank you so much! Looks like setting it out like: this.menuTextPLAY =, y, "TEXT");this.menuTextPLAY.font = "BPdots";this.menuTextPLAY.fontSize = 30 * pixelratio + "px";Rather than inline like I did fixed the problem. Thanks again!