charlie_says Posted November 15, 2016 Share Posted November 15, 2016 This is more of a general game dev question, rather than something specifically Phaser... I'm trying to make a rolling ball from a top down view, I had done this sort of thing in Flash, using bitmapdata and a filter effect that distorted the texture... This worked pretty well, especially with a football which was tileable - but I'm trying to do something a little different here, and it's not really working. I've attached my temp sheet, which looks fine - except it doesn't work. The problem is that at some point (usually after a partial rotation) the animation becomes incorrect. If there's not a way to "cheat" this it would appear that the spritesheet solution would require way too many variations to actually be practical. (It's probably some variation of the gimbal lock). Does anyone have any good links to how this has been done? I'm sure this isn't a new problem - but I've found very few good resources. Link to comment Share on other sites More sharing options...
rich Posted November 15, 2016 Share Posted November 15, 2016 Split the animation in to 2 images, the base ball, and the red rotating part. From the image above, the ball itself never changes, so you'd only need 1 frame. The red rotating part needs to be animated so you've all the frames for one complete revolution in 90 degrees (i.e. left to right). In-game, position the frame over the top of the ball, aligning both of them with either pivot or anchor, then rotate the red frame so it faces the direction you need the ball to move, and play the rotating animation at the same time. As the player moves the ball around, keep changing the rotation property of the red frame so it's orientated to match the direction the ball is traveling in. To go backwards, do the same, but play the animation going backwards instead of forwards. Link to comment Share on other sites More sharing options...
charlie_says Posted November 16, 2016 Author Share Posted November 16, 2016 Thanks Rich. I was skeptical about this approach, but having dropped it in, it is better than every other attempt A few questions: I presume that if you do this you only actually need the top row of the sprite sheet? Is there a way of minimising the 'lurch' as you set the rotation to the direction of travel? (I currently ease to it, but it's not ideal) Link to comment Share on other sites More sharing options...
charlie_says Posted November 16, 2016 Author Share Posted November 16, 2016 So to answer my own questions: You can use all the rows but, you stay on the row you start on. I ease to the direction of travel in relation to the speed of the ball, when it's moving quickly you don't notice it 'cheating'. I think there's possibly a few more refinements - but working this way looks pretty natural. Link to comment Share on other sites More sharing options...
Recommended Posts