Search the Community

Showing results for tags 'sprites'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Website URL


Twitter


Skype


Location


Interests

Found 192 results

  1. Hi, so I'm working on a game and I'm wondering if there's an easy way to code the following. I have an animal sprite, with body, collision, gravity, animations etc all implemented and working like I want. But now I want to add a tail sprite to the animal. animal.addChild(tail) works like I want only it puts the tail in front and I can't seem to change that. So I'm wondering if there's a simple way like to do the same thing only put it behind the first sprite. I know you can do stuff with groups, maybe I have to here, but then I have to change how everything interacts with the animal don't I? P.S. it's a cat. Cheers
  2. I use tiled map editor to create maps json my game. I've done that the map is loaded and all good. Now, I've made ​​my character shoot. And I want those shots collide with the wall (and call a function to delete the shot with an animation). I can not do that from phaser to detect specific tile (tiles hard block) to treat this as a sprite tile. And put in the update () function to the group of bullets that hit my character collides with these tiles (sprites). Help please
  3. Hey, Real simple case: draggable popup window with text. var popup = this.game.add.sprite(coordinates[0], coordinates[1], this.popupSprite);popup.anchor.x = 0.5;popup.anchor.y = 0.5;var t = this.game.add.text(popup.x-110, popup.y-50, msg, this.msgStyle); popup.addChild(t);popup.inputEnabled = true;popup.input.enableDrag(false);Problem: After calling addChild, it ends up rendering the text way off to a seemingly random coordinate, sometimes even off the screen. The text does move with the popup window however. I played around with Groups to handle this, but the problem is that the text does not move with the popup window, even though they are in a group. Any suggestions on how to handle this?
  4. In short, I want to get all the sprites at a given point. Currently, I'm getting the bounds of my sprites and testing if that Rect contains that point. I'm browsing through the code to see if there is a method on "Group" or something that I might be missing that already does this. Any ideas? If not, I can probably figure out a good place for it and do a pull request.
  5. Hello all and the main guy "rich" thank you for this wonderful framework...its been smooth sailing until I hit this terrible bump and I am beyond irate and even more I have a big project due in about 3 days... I have spent the last 2 days off and on trying to figure out why in all the world I cant get a button with texture atlas or spritesheet to work and I am at my wits end...Please help!!! What I am trying to accomplish: I am creating a turn based game project, which has a lot of buttons, which change depending on button which clicked, overstate,outstate, downstate... why is there no specific doc on this it is very confusing... By the way I have looked through all the examples on : http://examples.phaser.io/ and throughout the forum to no avail The problem when I reference the atlas key and the "framenames" in the button instance like: this.allbutton = this.add.button(680, 700, 'MainGameSprite', this.buttonCallback, this, 'AllinButton_Pressed', 'AllinButton', 'AllinButton_Pressed');the whole texture/spritesheets gets output to the screen, instead of the first frame?...here are the json and jsonhash files i tried from leshy and texture packer..Maybe its the json? I have used Leshy http://www.leshylabs.com/apps/sstool/ texture packer https://www.codeandweb.com/sprite-sheet-maker leshy output : https://mega.co.nz/#!nwF3xKRC!h9aQIOUL3iwi6lGVHE1rrOCiF_uNBvJksPOlmlbn2vc texture packer output : https://mega.co.nz/#!zwN0WQ4D!4r1urUSNMR_h8R5PzojyHdvRm6vtU9pcf-_Tb9Zl1yM sample json texture packer: {"frames": {"AllinButton.png":{"frame": {"x":764,"y":63,"w":164,"h":58},"rotated": false,"trimmed": false,"spriteSourceSize": {"x":0,"y":0,"w":164,"h":58},"sourceSize": {"w":164,"h":58},"pivot": {"x":0.5,"y":0.5}},"AllinButton_Pressed.png":{"frame": {"x":930,"y":63,"w":164,"h":58},"rotated": false,"trimmed": false,"spriteSourceSize": {"x":0,"y":0,"w":164,"h":58},"sourceSize": {"w":164,"h":58},"pivot": {"x":0.5,"y":0.5}}, here is some snippet of code from me to assure you that I have (or tried at least) to do everything right : ///index.htmlBasic stateswindow.onload = function(){ //inject game object into container div var game = new Phaser.Game(1386, 786, Phaser.CANVAS, 'gameArea'); //add states to game object game.state.add('Boot', xGame.Boot); game.state.add('Preloader', xGame.Preloader); game.state.add('Lobby', xGame.Lobby); game.state.add('Game', xGame.Game); //start boot sequence game.state.start('Boot'); ///preloadxGame.Preloader = function (game){this.background = null;this.preloadBar = null;//this.ready = false;};xGame.Preloader.prototype = {preload: function (){ this.load.atlasJSONHash('MainGameSprite', 'img/Slices/TextureAtlas/testpng.png','img/Slices/TextureAtlas/testjson.json');//tried both atlas and atlasJSONHash for leshy and texture packer and spritesheet this.load.atlas('MainGameSprite', 'img/Slices/TextureAtlas/testpng.png','img/Slices/TextureAtlas/testjson.json');this.load.spritesheet('cardsActions', 'img/Slices/sprites/CardActions.png', 329, 353); }} ///gamexGame.Game = function (game) {};xGame.Game.prototype = {create: function () { // this is from me trying everything including pulling out hair...... //tried //this.gameSprite = this.add.sprite(100, 200, 'cardsActions'); //this.gameSprite.frameName = 'AllinButton'; // The numbers given in parameters are the indexes of the frames, in this order: over, out, down //tried the atlas thing this.allbutton = this.add.button(680, 700, 'MainGameSprite', this.buttonCallback, this, 'AllinButton_Pressed', 'AllinButton', 'AllinButton_Pressed'); ////tried the spritesheet frame thing, but didn't make sense since I had multiple spritesheets of varying component texture sizes this.allbutton = this.add.button(550, 500, 'cardsActions', this.actionOnClick, this, 1, 0, 2); // setting the anchor to the center this.allbutton.anchor.setTo(0.5, 0.5);}}in both cases and other test this has been my output: http://imgur.com/X0PpASg or in the case of the texture atlas it sprints the whole spritesheet!!? for example this example menu shows close to an in game activity : http://dev.phaser.io/examples/sprites/shared-sprite-textures but even the documentation on this is poor eg: function preload() { // We load a TexturePacker JSON file and image and show you how to make several unique sprites from the same file game.load.atlas('atlas', 'assets/pics/texturepacker_test.png', 'assets/pics/texturepacker_test.json');}function create() { game.stage.backgroundColor = '#404040'; chick = game.add.sprite(64, 64, 'atlas'); // You can set the frame based on the frame name (which TexturePacker usually sets to be the filename of the image itself) chick.frameName = 'budbrain_chick.png'; This works in the example but makes no sense.... i have looked into almost every example out there including : phaser/ressources/basic referenced here http://www.html5gamedevs.com/topic/2136-buttons/ from browsing this topic..So I took every precaution and advice about formats for texture atlas I removed "check rotation"as specified in this topic: http://www.html5gamedevs.com/topic/1783-basic-problems-with-animations/ Please solution needed Ideally I would like to use a texture atlas to fit this as opposed to several different spritesheets which become very obfuscated in terms of frames? what if you have multiple spriteshteets, what becomes of the frame numbers in different button instances? ie: //in loadthis.load.spritesheet('Actions', 'img/Slices/sprites/CardActions.png', 329, 353);this.load.spritesheet('setofanotheraction', 'img/Slices/sprites/CardActions.png', 329, 353);//in createbutton 1 = this.add.button(550, 500, 'Actions', this.actionOnClick, this, 1, 0, 2);button 2 = this.add.button(550, 500, 'setofanotheraction', this.actionOnClick, this, ?,?,? wtf???);So please if you can help solve the texture atlas issue, it will be much appreciated...I have no more hair left to pull, I will be watching this thread eagerly...thanks to the hero in advance.
  6. Hi, I am a programmer with little skills with the pencils, but i'm very not an animator. The game kingdom rush inspire me a lot. I want to create a game with some characters like Kingdom rush, small but cool and the movement are fluids. Can anyone help me? Thank you!
  7. I'm trying to create a bitmapdata with a single frame from a spritesheet and I'm getting nothing I'm using this, bmd = game.add.bitmapData(800, 800); bmd.add(new Phaser.Sprite(game, 50, 50, 'blocks', 3)); sprite = game.add.sprite(0,0,bmd);but its showing nothing. Am doing something wrong? I tried copypixels aswell and still got nothing, I tried adding the sprite in advance, nothing. (I'm useing phaser 2.0.6) Thanks for the help in advance.
  8. Hey. So bascially, I was wondering if there is a way to create a camara object that is tied to only a certain part of the game screen. Then controll dat part of the screen. Like a rectangle. I know there is a way to do this but ... I want to add texts and sprites in that rectangle that can be browsed around using the camara. Bascially, I want to emulate a kind of scrolling through items in the game's UI. The type of scrolling you do on mobile. I want to show a bunch of texts vertically but its a lot so it goes off the game's height therefore i wanted to do a kind of scrolling for it to still contain it within the game screen. Is this possible? If so, any help please?
  9. Hi All - I have two Sprites, a player and a shape. When the player is overlapping the shape, I want it to accerate the player sprite object (like a conveyor belt).. I'm having some issues getting this to work with the following code: var Player = function(game, x, y, frame) { Phaser.Sprite.call(this, game, x, y, 'playerMovements', 0); this.game.physics.arcade.enableBody(this); this.body.collideWorldBounds = true this.anchor.setTo(0.5, 0.5);}; var Belt = function(game, player, x, y) { var beltBMD = game.add.bitmapData(50, 400); beltBMD.ctx.fillStyle = 'red'; beltBMD.ctx.fillRect(0, 0, 50, 400); Phaser.Sprite.call(this, game, x, y, beltBMD); this.game.physics.arcade.enable(this); // Code that isn't working as intended this.game.physics.arcade.overlap(this, player, this.applyEffect, null, this); this.game.time.events.add(2000, this.destroy, this); this.game.add.existing(this); player.bringToTop()}; Belt.prototype.applyEffect = function(drop, player) { console.log(drop.body.overlapX); // 0 console.log(drop.body.overlapY); // 0 console.log(player.body.overlapX); // 0 console.log(player.body.overlapY); // 0 player.body.velocity.y += 400;}; The issue is that my applyEffect callback gets triggered, but there isn't an overlap property set on either of the two objects so I can't accelerate until the overlap properties are back to 0 because they never seem to be set in the first place. If the callback gets triggered, shouldn't an overlap be set? Open to other suggestions about how to do this, I went with the bitmap data approach because I need to be able to draw shapes w/ physics bodies which the Graphics class doesn't support. Thanks!
  10. I'm trying to convert my spritesheet animations into 1 bigger texture atlas. I want to avoid calling load Texture every click (swinging weapon). The problem is I can't find the way to provide frameData for my animation. I load 3 images to texture atlas and then I have 3 frames after export. How I can tell that there are 4 frames in 1 texture atlas sprite? I used to write like this: this.loadTexture(toolName + side, 0);Any ideas?
  11. Hi, New to Phaser, but I can't seem to get some basic functionality working. Using Arcade physics, when my sprites hop on top of each other they compress and sometimes fall through the floor. Like so: I've feel like I've tried everything but I wouldn't be surprised if I missed something obvious. Here's what I hope is the relevant code. Please forgive its poor quality. I've also attached the whole file if that helps. Thanks! function create() { // A simple background for our game game.add.sprite(0, 0, 'sky'); // The platforms group contains the ground and the 2 ledges we can jump on platforms = game.add.group(); // We will enable physics for any object that is created in this group platforms.enableBody = true; // Here we create the ground. var ground = platforms.create(0, game.world.height-64, 'ground'); // Scale it to fit the width of the game (the original sprite is 400x32 in size) ground.scale.setTo(2, 2); // This stops it from falling away when you jump on it ground.body.immovable = true; ground.body.allowGravity = false; // The player and its settings player = game.add.sprite(150, game.world.height - 150, 'dude'); player2 = game.add.sprite(300, game.world.height - 150, 'dude'); player3 = game.add.sprite(450, game.world.height - 150, 'dude'); player4 = game.add.sprite(600, game.world.height - 150, 'dude'); players = game.add.group(); players.add(player); players.add(player2); players.add(player3); players.add(player4); // We need to enable physics on the player game.physics.arcade.enable(players, Phaser.Physics.ARCADE); game.physics.arcade.OVERLAP_BIAS = 30; game.physics.arcade.TILE_BIAS = 1000; game.physics.arcade.gravity.y = 2600; players.callAll('body.collideWorldBounds', 'body', true); player.body.bounce.x = 0; player.body.bounce.y = 0; player.body.allowRotation = false; player2.body.bounce.x =0; player2.body.bounce.y =0; player2.body.allowRotation = false; player3.body.bounce.x =0; player3.body.bounce.y =0; player3.body.allowRotation = false; player4.body.bounce.x =0; player4.body.bounce.y =0; player4.body.allowRotation = false; // Our two animations, walking left and right. players.callAll('animations.add', 'animations', 'left', [0, 1, 2, 3], 10, true); players.callAll('animations.add', 'animations', 'right', [5, 6, 7, 8], 10, true); // The score scoreText = game.add.text(200, 300, '', { fontSize: '68px', fill: '#000' }); // Our controls. cursors = game.input.keyboard.createCursorKeys(); // Finally some stars to collect stars = game.add.group(); // We will enable physics for any star that is created in this group stars.enableBody = true;}function update() { // Collide the player and the stars with the platforms game.physics.arcade.collide(platforms, players); game.physics.arcade.collide(players, players); game.physics.arcade.collide(stars, platforms); // Checks to see if the player overlaps with any of the stars, if he does call the collectStar function game.physics.arcade.overlap(players, stars, collectStar, null, this); // Reset the players velocity (movement) player.body.velocity.x = 0; player2.body.velocity.x = 0; player3.body.velocity.x = 0; player4.body.velocity.x = 0; player.body.angle = 0; player2.body.angle = 0; player3.body.angle = 0; player4.body.angle = 0; }index.html
  12. Hey folks, my name is Remus and i specialize in creating pre-rendered sprites for video games.For those not familiar with pre-rendered graphics, they are basically 2d images of custom-made 3d models. I am here offering my services to anyone interested in these sort of graphics, here are some samples of my work : Notes and TermsI don't work for free or royalties/shares.Allow a minimum of one week for each commission, excluding weekends.Prices vary to accommodate the complexity of the model.I don't do trademarked characters (Zelda, Pokemon, Mario, Megaman..etc).I don't charge for the number of directions needed, can be anything from 1 to 360​. Contact PM me here, or e-mail me at valarinPath(at)yahoo.com For more samples check my Portfolio -- Remus
  13. how to know the distance of the Drag, unused PositionUP or onInputUp to differentiate a drag from a long click
  14. Hello, What I'm trying to achieve and I am sure that it can be done is the following: I have two sprite-sheets one with the entity animation and one with some explosion. Can I combine these two (not in the same image but programmatically) so that the explosion plays when the entity is killed? I thought to add them to the same group and simply animate the "explosion instance" of that group in which the entity dies, but I wanted to ask if there is a more "refined" way to do this. Also how can I sequence these animations (entity killed and then explosion plays)? Thanks for your time!
  15. Hi. I need to implement some dragging in my game. The code below works fine on Desktop and Mobile but when I turn on chrome dev tools on desktop (for testing on mobile) the drag functionality doesn't work, except for the sprite jumping around. Its convenient to be able to test in chrome dev tools, so if anyone has a clue as to why it doesn't work please let me know. Thanks! // Create paddlepaddle = game.add.sprite(game.world.centerX, game.world.height - 100, 'sprites', 'platform.png');paddle.anchor.setTo(0.5, 0.5); paddle.inputEnabled = true;paddle.input.enableDrag(false);paddle.input.allowVerticalDrag = false;
  16. there will be 2 sprites (they're just squares) and some text that constantly need to change colours. so would it be better to change the tint or use a spritesheet with the different coloured sprites?
  17. I have fixed a bug. This is how to repro it: At startup: this.sprite.loadTexture("walk.png"); // Sprite sheet 3x4 frames Some time later: this.sprite.loadTexture("dead.png"); // Single frame My game sets this.sprite.frame each update. If the object is 'dead', the frame number is 0. The BUG is: the old frameData in this.sprite.animations resets the texure to walk.png's first frame. I SOLVED this by executing this.animations.loadFrameData(null); in the "cache.isSpritesheet == false" part of Phaser.Sprite.prototype.loadTexture
  18. I'm a first time user of Phaser, been trying to make a simple point and click type game. I'm trying to keep things very modular, so I'm defining a list of levels (states) in a JSON, and then every level has its own JSON containing the objects within that level. However, I'm encountering an issue in that, when changing states, I get a black flash while the assets for the next state load (this happens whether I iterate through the JSON list or define everything manually). From what I've read, all sprites should be loaded in the preload stage, however, by doing this I'm causing that tiny but noticeable black pause. I know one way would be to simply load every asset at the start of the game, but that seems incredibly inefficient (wouldn't that fill up the memory immensely?). I would rather load a state's assets from the "parent" state. However, in my quick test (which maybe I did wrong) it seems that game.load doesn't work properly if done within the create stage? What is the best approach to doing this?
  19. I know this is probably well known, but I don't know the name for it and no amount of googling could help me find the answer. (Maybe I wasn't googling hard enough.) How do you remove the rough edges from pictures? I mean, how can I show the part of the picture I want to show and remove the whitespace, having the background overlay it.? I'm not using any spritesheets.
  20. Anny

    Connecting Sprites

    Hey guys! I have asked about this in different topics but I haven't been able to find a good way to do it. What I need is to connect sprites dragging and dropping a point of one of them (like a button) to connect it to another sprite. I have tried to do this creating lines with a bitmap and using new Phaser.line but I don't want any diagonal line and when I use bitmap I haven't been able to create multiple lines. I thought of adding a sprite with the draw of the line but that wouldn't follow the player's movement ): I wan't it to be whatever the player draws on the field that connects the two sprites (but with straigth lines, like if they were cables that connect 2 electronic pieces) I add an image to illustrate what i'm trying to do Thank you so much in advance PD: Ignore B's position haha
  21. Gio

    Free Sprite of the Week

    Our company has been doing this Free Sprite of the Week thing for a little while, so I thought I'd let you know about it, as it's probably useful to some people here. The idea is that one of the animated characters, creatures, etc. that are normally for sale, is given away for free, and there is a new one each week. It seems to be working well for now, and if people don't abuse it, we intend to keep doing this for some time. This week it's an unicorn... and everyone loves unicorns, so you should absolutely get it! If you don't love unicorns, then there's something wrong with you, really There are also other free sprites if you look in the Market area of the website, and some of them (no, all of them) are really cool The ones that aren't free are still very cheap, especially now, since it's all a new thing and literally everything is 50% off for another week or so. The characters with a + next to their names are "premium" ones, that have a much higher resolution, higher frame rate, a larger number of camera angles, and a more complete animation set. The animation sets have been made in a way that makes them suitable to any type of game, from platforming to point-n-click adventures, to isometric RPG's, etc. Just as an example of what one of these animation sets includes, most of the + characters have the following animations seen from 12 different angles (8 isometric and 4 straight-on ones): Idle, Angry_01, Angry_02, Assemble, Bow_01, Bow_02, Bow_Curtsey, Box_PickUp, Box_Pull, Box_Push, Button_Push, Celebrate_01, Celebrate_02, Climb, Crouch, Crouch_Walk, Dance, Death_Backwards, Death_Backwards_Get_Up, Death_Forward, Death_Forward_Get_Up, Door_Pull, Door_Push, Fall, Fight_Stance, Give_Item, Hang_Ledge, Hang_Ledge_Left, Hang_Ledge_Right, Hang_Wall, Hang_Wall_Left, Hang_Wall_Right, Happy_01, Happy_02, Item_Pick_Up, Jump_Up, Jump_Flip, Kick_Flying_Kick, Kick_High, Kick_Low, Kick_Mid, Kick_Spin, Land, Lever_Big_Pull, Lever_Pull, Magic_Raise, Magic_Sky, Magic_Throw, Magic_Thrust, Point_Down, Point_Forward, Point_Forward_Down, Point_Forward_Up, Point_Up, Pull_Up_Ladder, Pull_Up_Ledge, Pull_Up_Wall, Punch_High, Punch_Low, Punch_Mid, Punch_Spin, Reach_01, Reach_02, Run, Sad, Sitting_Cross_Legs, Sitting_Talking, Sitting_Down, Slide_Down, Slide_Left, Slide_Right, Smash, Standing, Standing_Fold_Arms, Standing_Hands_On_Hips, Standing_Look_About, Standing_Up, Stand_To_Climb, Stand_To_Fight, Step_Backwards, Swim, Talk, Throw, Walk, Wave, What Hopefully you'll find something useful in there. Also, if you have any requests for something that you'd like to see, or want stuff to be made exclusively for your games, this is sometimes possible, so if you want just send me a message and I'll forward it to the people that do these things (I only write code and know nothing about art and animation).
  22. Hey guys, Ive have been playing around with Phaser 1.1.3 for the past few days and currently loving its ease of use. There is, however one problem. When I draw text to the game it seems to be drawn below the zombie sprites, I assume this is because the sprite are created and drawn after the text and thus are placed on top. You can see what I mean here: My question it this, is there anyway to make the text drawn on the top and still have the zombies being drawn afterwards (due to spawning code)? Thanks, Eamon
  23. Hi! I'm trying to figure out how to detach a sprite from a Group. Currently you add it with the group as a two-step process: 1) Create the Sprite 2) Add it to the group: group.add(sprite) But if I want to detach it from the group, so I can handle it individually, I have no other option than "destroy", which removes the Sprite. Setting the parent to null doesn't work either. The objective is that when a specific condition is met, the tween that is applied to all elements in the group as a whole doesn't apply to this particular sprite. Thank you!
  24. Hello to all, my name is Denis Castellanos and I currently run a small, yet effective indie GameDev team out of the sunny state of Florida.I am here in order to expand my team, on a per project basis, when necessary. This post will touch base on an in-house 2D project that is in search of a Html5/javascript programmer that is willing to bring this project to lifet. If you are interested please feel to contact me (email provided below) and I would like to note that any/all portfolios are welcomed. Project: Vertical 2D causal game Game Design doc will be provided as well **More information will be provided upon the signing of the NDA Talent Needed: Programming An ideal candidate should posses the following qualifications: An extensive background of Html5 and JavaScript Experience with phoneGap and or programming for mobile devices Understand and know how to implement in-game advertisement that does not intrude on the flow of the game Know how to implement vertical parallax scrolling Time: This project is made to be an easy launch, yet turnaround time is important for the flow of project. Effective communication: Honesty is the best policy Experience with working with sprite sheets Drive, Determination and prideful of their work *Resume/Portfolio is a must, live demos would be greatly appreciated Estimated project length: 10 hours (Depending on skill level) This project is designed to simple and easily completed within 2-3 days at the most. *Please be willing to immediately if possible Art style: 2D Target Platform: Mobile (Both android and iOs) This will be completed via the use of phoneGap Target Language: Html5, JavaScript, Css Compensation: $100.00 USD upon the completion of the project. Compensation will be awarded Paypal. If you any questions, concerns and or interest in this project please contact me via email at: ImaginaryBeetle@yahoo.com Best regards, Denis Castellanos Follow us on twitter @ImaginaryBeetle
  25. Some people are telling me game takes over a minute to load. Which is odd because for me is takes about 5 seconds. I do have a lot of sounds. A couple of big ones, one being 773 kb, and the other at 1.49 mb. I have a lot of little sounds too. I have seven notes all at about 32kb. And I have 5 other small sounds. Could it sigificantly speed up loading time, if I used one sound sprite for the small sounds? I can't test it myself as it loads really fast anyway. My sounds folder, which contains both ogg and mp3 comes to 5.32 mb. But won't even load the oggs if it loads the mp3s, so it's almost half that. I don't see why this could possibly take someone over a minute to load. We're talking about people who don't have really slow internet. Any advice would be appreciated. I'm proud of the game and it's music and I want to show it off. I'm totally gutted that so many people aren't even getting the chance to play cause of loading issues.