sHAYM4N

Members
  • Content Count

    63
  • Joined

  • Last visited

About sHAYM4N

  • Rank
    Advanced Member

Contact Methods

  • Twitter
    digilocker

Recent Profile Visitors

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

  1. sHAYM4N

    Changing textures/skin in Pixi Spine

    scrap that! had another look .uvs property has changed to regionUVs, works perfectly now! updateRewardFlag(bonusAmount, flagNumber){ window.Game.flags.createFlag(bonusAmount); let meshTexture = window.Game.flags.latestFlag(); let num = this.monster.skeleton.findSlotIndex('rag1'); let slot = this.monster.skeleton.slots[num]; let attachment = slot.attachment; console.log(attachment); attachment.region.texture = meshTexture; attachment.updateUVs(); if(slot.currentMesh) { console.log(slot.currentMesh); slot.currentMesh.texture = meshTexture; slot.currentMesh.uvs = new Float32Array(attachment.regionUVs); slot.currentMesh.dirty = true; } }
  2. sHAYM4N

    Changing textures/skin in Pixi Spine

    Hi sorry to bump this, but was something I've just been trying out and haven't been able to get it to work if anyone could help? Is this the correct way still to do this. I have an animation of a character with 3 different flags waving (as meshes) and need text on those flags, so thought it would be good to try and renderTexture out dynamically with the base png and text on top, then replace. rendererObject no longer seems to be a property - but have found texture under "region". With the below the texture doesnt appear updateRewardFlag(bonusAmount){ window.Game.flags.createFlag(bonusAmount); let meshTexture = window.Game.flags.latestFlag(); let num = this.monster.skeleton.findSlotIndex('rag1'); let slot = this.monster.skeleton.slots[num]; let attachment = slot.attachment; attachment.region.texture = meshTexture; attachment.updateUVs(); if(slot.currentMesh !=null) { console.log(slot.currentMesh); slot.currentMesh.texture = meshTexture; slot.currentMesh.uvs = new Float32Array(attachment.uvs); slot.currentMesh.dirty = true; } } if I comment out as below it does appear but massively out of scale and rotated. updateRewardFlag(bonusAmount, flagNumber){ window.Game.flags.createFlag(bonusAmount); let meshTexture = window.Game.flags.latestFlag(); let num = this.monster.skeleton.findSlotIndex('rag1'); let slot = this.monster.skeleton.slots[num]; let attachment = slot.attachment; attachment.region.texture = meshTexture; attachment.updateUVs(); if(slot.currentMesh !=null) { console.log(slot.currentMesh); slot.currentMesh.texture = meshTexture; //slot.currentMesh.uvs = new Float32Array(attachment.uvs); //slot.currentMesh.dirty = true; } } Any ideas greatly appreciated!
  3. sHAYM4N

    ParticleContainer & Particle blendModes

    perfect thanks, will stick to Container for now then, and try the other approach if I see any drops
  4. sHAYM4N

    ParticleContainer & Particle blendModes

    that's awesome thanks Ivan, will take a look at trying that out once this project is done, but might have to hold on for that one as I'm a bit behind already. For the moment I can either have 1 normal container for both emitters, or use 2 particle containers for each with one set to add. For now any idea on which of the two options may give better performance?
  5. sHAYM4N

    ParticleContainer & Particle blendModes

    Brilliant thanks! Guess that's what I must have been doing previously. One thing with this effect though is I have two emitters, a fire and smoke effect, whereby only the fire needs add, so it wouldn't work in this case. So do you think it would be better to have 2 particlecontainers with just the fire particlecontainer set to add or... just use one normal container for both?
  6. Hi, I've just noticed that the ParticleContainer doesn't seem to support blendModes. I thought previously it had worked when the tint property had been set to true, but may have imagined it. This still a current limitation?
  7. sHAYM4N

    PIXI Particles and subemitters

    Have managed to get this working, but had to find some workarounds and not sure if it's a bit complex, and could be optimised further... Involved using a timer and a loop to emit manually, then track the last added fireball particles position (if I tried accessing as soon as it was emit, it would return a blank, because it seems emission rate of 0 even for one particle is not possible), so matched the delay to the emission rate and seems to work ok. I'll likely add the particles back into particle containers now to improve performance a bit too. TickerTimer is just a small util class I wrote that adds a callback function to the main app ticker with a delay (so works pretty much like setTimeout, but using the app ticker) Any further ideas greatly appreciated! import TickerTimer from "../utils/TickerTimer"; class Fireballs extends PIXI.Container{ constructor(){ super(...arguments); this.balls = []; this.trails = []; // Atlas... this.atlas = PIXI.loader.resources["./assets/fxAtlas.json"].textures; this.ballContainer = new PIXI.Container(); this.trailContainer = new PIXI.Container(); this.addChild(this.trailContainer); this.addChild(this.ballContainer); this.emitTimer = 0; this.emitRate = 6; this.fireballCount = 0; this.maxFireballs = 20; this.timer = new PIXI.ticker.Ticker(); this.timer.stop(); this.fireballs = new PIXI.particles.Emitter( this.ballContainer, [this.atlas["fireball1.psd"]], { "alpha": { list: [ {value:0, time:0}, {value:1, time:0.2}, {value:1, time:0.8}, {value:0, time:1} ], }, "scale": { list: [ {value:0, time:0}, {value:0.3, time:0.2}, {value:0.4, time:0.8}, {value:0.2, time:1} ], "minimumScaleMultiplier": 1 }, "color": { "start": "#ffffff", "end": "#ff6105" }, "speed": { "start": 800, "end": 1000, "minimumSpeedMultiplier": 1 }, "acceleration": { "x": 0, "y": this.randomRange(1000,2000) }, "maxSpeed": 1000, "startRotation": { "min": 160, "max": 380 }, "noRotation": false, "rotationSpeed": { "min": 500, "max": 2000 }, "lifetime": { "min": 1, "max": 1 }, "blendMode": "add", "frequency": 0.1, "emitterLifetime": 0.2, "maxParticles": 10, "pos": { "x": 0, "y": 0 }, "addAtBack": false, "spawnType": "point" } ); this.timer.add(this.emitLoop,this); this.timer.start(); } emitLoop(deltaTime){ this.emitTimer++; if(this.fireballCount < this.maxFireballs){ if(this.emitTimer >= this.emitRate){ this.emitTimer = 0; this.emitFireball(); } } else { this.timer.remove(this.emitLoop, this); this.emitTimer = 0; this.fireballCount = 0; } } randomRange(min, max) { return Math.floor(Math.random() * (max - min + 1) + min); } emitFireball(){ this.fireballCount++; if(this.fireballCount < this.maxFireballs){ this.fireballs.autoUpdate = true; this.fireballs.playOnce(this.fireballDestroyed.bind(this)); //this.fireballs.emit = true; let delayMe = new TickerTimer(this.timer, 0.2, this.createTrailSmoke.bind(this)); } } fireballDestroyed(ball){ this.balls.shift(); this.trails.shift(); } createTrailSmoke(){ let fireball = this.ballContainer.children[this.ballContainer.children.length-1]; // Get the last added fireball. if(fireball!=null){ let trailSmoke = this.createTrail(fireball.x, fireball.y,1); this.balls.push(fireball); this.trails.push(trailSmoke); window.Game.ticker.add(this.updateTrailSmoke, this); } } updateTrailSmoke(){ for(let i = 0; i < this.balls.length; i++){ this.trails[i].updateOwnerPos(this.balls[i].x, this.balls[i].y+20); } } createTrail(xPos, yPos, lifeSpan){ let trail = new PIXI.particles.Emitter( this.trailContainer, [this.atlas["smoke3.psd"]], { "alpha": { list: [ {value:0, time:0}, {value:1, time:0.2}, {value:0, time:1} ], }, "scale": { list: [ {value:0.2, time:0}, {value:0.1, time:0.2}, {value:0.4, time:1} ], "minimumScaleMultiplier": 1 }, "color": { list: [ {value:"#ffff5e", time:0}, {value:"#ff0000", time:0.2}, {value:"#333333", time:0.3}, {value:"#000000", time:1} ] }, "speed": { "start": 0, "end": 0, "minimumSpeedMultiplier": 1 }, "acceleration": { "x": 0, "y": 100 }, "maxSpeed": 0, "startRotation": { "min": 0, "max": 360 }, "noRotation": false, "rotationSpeed": { "min": 0, "max": 800 }, "lifetime": { "min": 0.6, "max": 0.8 }, "blendMode": "normal", "frequency": 0.008, "emitterLifetime": lifeSpan, "maxParticles": 200, "pos": { "x": xPos, "y": yPos }, "addAtBack": false, "spawnType": "point" } ); trail.autoUpdate = true; trail.playOnce(); return trail; } } export default Fireballs;
  8. sHAYM4N

    PIXI Particles and subemitters

    Aha, silly me see gravity can be simulated with the acceleration, so will try that The only other issue I can see is accessing the fireball particles x,y position but hopefully children on the particle container, should give an option there
  9. sHAYM4N

    PIXI Particles and subemitters

    Hi all, was just having a play with an effect for an explosion, and thought it would be cool to trial out some fireball style effects with some sort of simulated gravity. eg. 4 or 5 fireballs, with smoke trails behind.. Had a play but noticed that pixi particles doesn't really offer anything in terms of subemitters, unless I've missed it? So really been trying to find a workaround. I'm not so hot when it comes to the maths of any gravity, so have used gsaps 2dphysics plugin to get it working https://greensock.com/docs/Plugins/Physics2DPlugin... so each fireball itself is a sprite in a container, then onupdate with that animation, the x&y position of the fireball is sent to update the ownerposition of the trail emitter. It does work pretty well appearance wise, but performance does feel like it takes a bit of a hit, which Im guessing maybe down to the plugin. Any ideas on any more "optimal" ways in which something like this could be achieved?
  10. sHAYM4N

    Discord server?

    Hey all - was just wondering if html5gamedevs had a discord server, or if anyone had found a good one for pixi devs? Just thought it could be a nice place to float the odd question or showcase bits and pieces peeps are working on without it being topic specific?
  11. sHAYM4N

    BitmapText Pivot & Kerning

    That's brilliant thanks, lots of useful info there. Might be something I'll take a look at once the project is nearly done as I still have a few bigger targets to hit first. I've been able to target each character with children, but it's just setting the anchor that has messed up the kerning. I was thinking of trying something that used the width of each character to calculate the offset and seeing if that could be adjusted manually before it was added to the stage. Either way will update if I find a solution. Many thanks!
  12. sHAYM4N

    BitmapText Pivot & Kerning

    Sorry to bump but still not sure how best to approach this one (so have avoided it so far :D) @themoonrat any ideas?
  13. sHAYM4N

    Text V BitmapText Performance?

    Apologies, just spotted a post below asking pretty much the same question. Feel free to delete
  14. sHAYM4N

    Text V BitmapText Performance?

    Hi all Latest project I've been using a mix of bitmapfonts and pixi text (mainly bitmap fonts for the stylised displays, and pulling google fonts for the rest). One quick query. I read somewhere that changing pixi.text content on the ticker can be performance intensive and bitmap fonts would work better. I was just wondering in general if bitmap fonts are a better option overall performance wise, or if there is little in it? I have a console display I'm about to animate - e.g. terminator style headsup - it will have a series of messages in plain text that will animate through gsap and fade out. Text for this wont be stylised, but at a small size so a full glyph atlas wouldn't take up much texture space?
  15. sHAYM4N

    TexturePacker Animations Problem

    thanks Ivan looks like updating to 4.8.4 has fixed it