Search the Community

Hi there, I wonder if anyone can help. I have a custom graphic that I made which represents a reel on a slot / fruit machine. It contains 12 different images. Each image is 96 x 96. So you can imagine a long graphic with a new image going vertically at every 96 pixels. I need to display 3 graphics at a time and then emulate spinning of the reel. I was looking into the TileSprites which I thought should be able to get my reels spinning (or look like they are) using the tilesprites. Looking at an example @ phaserjs, its pretty straight forward, I think :-) // Create tilesprite tilesprite = game.add.tileSprite(0, 0, 800, 600, 'starfield'); Then could call method x number of times to emulate scrolling ie. tilesprite.tilePosition.y += 8; // control the speed The problem is that I would like to start each reel at a different position to start off, otherwise, you would always have the same pictures next to each other. I notice I can pass in a frame to the add.tileSprite and I can create the sprite as a atlas / spritesheet. Anyone know what I should be doing here ? Once i have them spinning I would need to stop them, this is another task I can't seem to get my head around. If I just stop them spinning then I could stop the reels NOT being centred i.e. A graphics in between the win line and the line above. Can anyone lend a hand ? I did try searching for some source code already available either free or paid but found none. I am a little lost how to proceed, I should imagine phaserjs gives me the tools to do what i need to do but just unsure where I should go next. Any help really appreciated Thanks