Search the Community

Hi Everyone, How to move a object smoothly with deltaTime? Thank you

I'm working on a game that switches through various states for the menu, main game and game-over screens. for the most part I'm happy for antialiasing to be used on my sprites and particularly my text, as forcing a crisp pixelated render on the whole game can lead to some of the text & sprites looking a little janky. I'm instantiating my game pretty simply: `MY.game = new Phaser.Game(800, 600, Phaser.AUTO, 'game');` I'm not setting any scale modes or special rendering prior to playing the game. In the Game Over state I'm loading a small pixel image I created, and adding some bitmapText to the top of the screen. I'm scaling the pixel image up by a factor of 6, and the bitmap text is set at 32px. On both of these, I set `smoothed = false`, because I wanted both the text and the sprite to appear pixel-perfect, and because I use FF by default (which uses WebGL by default), it will usually smooth out sprites unless explicitly told otherwise. It looks like this: var gameOverText = this.game.add.bitmapText(0, 0, 'FFF', 'GAME OVER', 32); gameOverText.anchor.setTo(0.5); gameOverText.x = Math.floor(this.game.width / 2); gameOverText.smoothed = false; var skull = this.game.add.sprite(0, 0, 'atlas-sprite', 'skull'); skull.scale.setTo(6); skull.anchor.setTo(0.5); skull.x = Math.floor(this.game.width / 2); skull.y = Math.floor(this.game.height / 2); skull.smoothed = false; Here's where it gets weird: if I jump straight from my BootState (which is always loaded before everything else) to my GameOver state, it works perfectly - text and sprite look nice and crisp. However, if I actually go through the game (so, go from BootState to GameState to GameOver state), it doesn't work at all - text is blurry and the sprite looks awful. I've managed to narrow it down to the point at which I start adding sprites: // this.levelData is a previously-loaded JSON map this.parallax = this.add.group(); this.levelData.parallax.clips.forEach(function(element) { var parallax = this.parallax.create(element.x, element.y, 'atlas-sprite', element.name); }, this); (it's worth noting that these loops create sprites way outside of the camera's viewport, as the game is scrolling) If I add `this.state.start('GameOverState')` and return out of the function prior to this loop, my text & sprite in the GameOver state remain perfectly pixelated; if I move `this.state.start('GameOverState')` to after that first loop (or at any point after this), it's as if all of the smoothing arguments are ignored. I've tried a LOT of different methods to try to fix this, but nothing is working. I figured it might be something to do with the world bounds, or the camera position, or the game antialiasing, but nothing seems to work. Any ideas on why this might be happening and how to get around it?

Hello all! I'm currently playing around with pixi.js and i have used to these things with normal canvas. I think this might have been asked many times, but how do i disable that image anti-aliasing from pixi.js? In normal canvas i could use context.imageSmoothingEnabled= false, but i think that this doesn't help here? - I have tried to set canvas css to image-rendering: pixelated; - i tried PIXI.settings.SCALE_MODE = PIXI.SCALE_MODES.NEAREST; but it doesn't help. - I also used antialising: disabled at the autoDetectRender -function. Anybody have any idea how to make it work? Or can you even disable it?

Hello, So we have this memory game, we are having problems about the smoothness of the images and the text that comes with it when we scaled down on higher levels (more columns and rows). So the more rows and columns the more we scaled down the sprite and they suffered on smoothing and anti aliasing so much. Any help would be appreciated. Thanks in advance.

Hello fellow BabylonJS users, I'm currently using babylon to put some product visualizations on the web, but today I ran into a problem that I didn't find to be documented anywhere. I got a poly-reduced CAD-data rip with custom vertex normals, in Blender everything looks nice and smooth, but when I export to babylon, all those data seemsto be lost. Do you have any idea how to fix this? I'll attach an image, showing the dataloss. Have a nice day, J

Hello guys! I develop a small game. Really, its size is 90x160 pixels I scale it with Phaser scaling stuff. So i get a nice retro look. But there is something which went really wrong. It is the text. If i use simple game.add.text with Arial or using a bitmapText doesen't matters. There is always some kind of anti-alias or smoothing. Is there a way to get a Text crispy with hard edges? For a better understanding i have attached a screenshot. Tom

(This following might be more or less a colleage of related, yet independent thoughts) I suppose I just want smoother transitions in my sprite movement. I'm trying to address the issue with my sprite.position changes.. which are currently just incremental. http://www.iakarra.net/demo/polymer/WiAClient/index.html where as, http://www.iakarra.net/demo/polymer/WiAClient/wiia.account.js actually contains the update function/method (and in turn calls on the 'character.step' function) that is executing on every animate call/tick on the main page. So this is really the scope I'm concentrating on. Alright, so I'm familiar with the concept of css transitions being smoother than javascript animations because they are 'hardware accelerated'. but from this article: http://css-tricks.com/myth-busting-css-animations-vs-javascript/ it becomes apparent that javascript can be hardware accelerated as well. And the speed/execution myth was really invalid and perpetuated because people were basing their comparison on jquery animations. Referencing the following: http://chimera.labs.oreilly.com/books/1234000000802/ch05.html#animating_by_programmatically_updating_p as well as the following sections in/to that reference 'tweening' and 'interpolation' I hope to add a time-based animation (movement) using this javascript hardware accelerated concept.. Is there anything within the PIXI framework that I should account for when I do this? Or has someone implemented something similar to what I'm trying to accomplish? With my mild experience with the XNA framework, I noted that it passed around a gametime tick/timer.. In another post on here, I made reference to the requestAnimation method using the window.renderAnimationFrame .. based on date.now()... though that time did not seem to be global..