Jump to content


  • Content Count

  • Joined

  • Last visited

About johncl

  • Rank

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. Remember that its always possible to use a transparent div on top of the Pixi powered canvas where you can use plain html/css for your UX stuff and you can all the CSS shenanigans to animate it as well.
  2. Ok, yes I seem to recall struggling with this in Phaser as well. Oh well. I guess I need to create some sort of script that takes a spritesheet PNG and adds those pixels around each tile expanding the image as well as I prefer to work on a full sheet of images instead of individual frames. Although I guess this depends a bit on the next version of Aseprite which should support tilemaps as well. Will be interesting to see how they go about defining which tiles are part of the sets you draw with and if they assume individual tiles selection from a sheet somehow. EDIT: I just made a conversi
  3. Is this really the suggested fix for this issue? It seems such an obvious problem when tiling sprites. How do you all fix this in the graphics workflow so its more automatic if anything? I am using Aseprite which does have an "extrude" function to do this on individual frames of an animation but its mainly plain tileset sheets that require this extruded padding so it seems the artist would then have to draw the tiles as individual frames which is generally not how they work from what I have seen (except when making seamless patterns). Any hints is welcome.
  4. Ah thanks. Thats brilliant and I guess I should have figured that one out since I actually ask for a Blob there. Never crossed my mind that I could specify something else. Is there a good resource for Pixijs, the manual/wiki doesn't have very good examples imo. Took me quite some time to figure out how to have same sprite sheet on several sprites but still control their individual rectangles. Most of the examples are pretty hung up on the built in json tilemap feature but I want to have my own custom one if I can as I want more control over each tiles layering and effects.
  5. Hi, so I am using Pixijs to load images and other assets but I also want it to load my own proprietary map format as a standard byte array. PIXI.loader .add(TILEMAP_DATA, { xhrType: PIXI.loaders.Resource.XHR_RESPONSE_TYPE.BLOB }) .load(this.setup.bind(this)); So I have figured out you can "load" any data with the loader but it doesnt seem to actually load the data? When I check the resource data structure its just a plain Blob structure that I then have to load using this: var data = PIXI.loader.resources[tilemap].data; let fil
  6. Thanks for the reply. Yes I see that the animation system in Phaser is built for a richer purpose besides the one I had in mind. It is certainly good that they can be shared between instances of each toon "type". Once I had added the code to generate variations for each type it worked fine for now. I guess I'd need to have a lot of types to worry about the space it requires which isn't much anyway. I guess I am just very easily hung up on optimizing both memory usage and complexity from the old days.
  7. Reading through the source code for AnimationManager and Animation - I see its almost there but no quite. I was fooled by this one: sprite.anims.play('up', true, 5); Thinking that perhaps the index there at the end was the offset that would be added to all animation frames on playback, but no such luck - it only sets the start frame within the configured animation that 'up' was created with (even checking if its above, and if so setting it to 0). Actually if an animation wasn't also set up with a texture key you would have been able to set the texture on the sprite once (which you
  8. Ok, yes I guess I can build an extension and drop the whole Phaser 3 animation system. Just feels like a shortcoming that in order to play an animation it seems you do this: sprite.anims.play('up', true); You have to specify a key that is configured globally on the game.anims object. To me it looks like you have to make a separate key for each 'up' then, 'player_up', 'player_with_different_graphics_up', 'monster1_up' etc - even if they all could essentially share the same index offsets using some start index set on the sprite itself. From the Phaser 3 tutorial I linked I even got t
  9. I see that Phaser 3 now uses shared animations on the game/scene object itself, but I am stumped at how you can actually reuse these for several sprites that have the same index offsets relative to each other? For example, with this I am using a spritesheet where the toon sprite is at index 128, 3 frames each direction (offset 16 sprites down). But the method takes the sprite sheet name as well as an explicit start and end. Considering each of these get their own name, I cant really see how they can be reused for another sprite where I want to just offset the animation to another part o
  10. Although I am a bit torn whether to use a class that inherits Sprite or use the component pattern which I see some advocate. Maybe I am just more used to inheritance as I see the code becomes a bit more terse with the other pattern since you store the sprite in a variable and have to remember to access that whenever you actually want to modify/read something from the phaser sprite itself. What do you feel is the better approach? For example I want my player to react to controls, but that either means to pass the controls object into the update method or create the controls within the player ob
  11. Remember to call super.preUpdate() as well or your animations wont play. - Just had a serious debugging session here to figure out why only the first frame showed.
  12. Thanks for the help on this one. This stumped me as well as I'd like to split up my code in several files and extending sprites seems to be a good way to make it more modular. Why havent they added a generic .add( x ) function to game that just looks at the type and knows that its a sprite? the this.add.existing( x ) looks rather cryptic?
  13. This is a pretty complicated topic due to the fact that there are so many different resolutions and even aspect ratios to consider. Also depending on art style one would have to be careful so your graphics doesnt get too fuzzy/blurred if you opt for old school pixel style and scale it up for e.g. tablet use. Pixel style graphics needs a certain amount of sharpness to make them look decent. It also depends heavily on what kind of game it is since some can have varying play area as you would scroll around it anyway so on some devices you could see more than others (or more up/down compared to le
  14. Just a quick one, is there any way to adjust the tween object so it moves to another point when it reaches the goal? It seems like just calling the "to" function again does nothing. Atm I am calling game.add.tween again for every time but it feels a bit like it could be not as efficient as it should?
  15. Thank you mattstyles and Tom Atom for the nice discussion. My experience with javascript is mainly a lot of jQuery code so both Typescript and more complex javascript understanding (which has recently surfaced) is limited. Coming from a C# and Java world the way one work with member variables generally works nice as a container and where the understanding of "this" is pretty well defined. Not so with JS - which has now started to dawn on me. There are lots of pages trying to explain this and I am sure its all very good once I get the hang of it with some experience. I agree with mattstyle
  • Create New...