Search the Community
Showing results for tags 'BlendMode'.
Found 15 results
-
I had made a codePen demo to show this case(and 2 screen-capture-images below) https://codepen.io/tomleader/pen/jOmNWJG There are 3 buttons(click to see the result) 1. use img: The most common way , sprite.from(imgUrl), everything is ok! 2. use buffer: a little tricky.. the process is [new a Image obj and set src=url, draw Image to another canvas, getImageData from canvas, make a texture from imgData buffer, sprite.from(texture)], and the result seems weird! 3. use dataUrl: the process is [new a Image obj and set src=url, draw Image to another canvas, canvas.toDataURL, make a texture from dataURL, sprite.from(texture)], and the result seems ok! So I think maybe the fromBuffer(imgdata) lost some pixels opacity data? OR I have some mistakes in my code? Any suggestions? Thanks ..
-
Hi, I am new to Pixi.js and I have been searching and looking for the custom blend mode usage with only WebGL in Pixi.js. I looked through the post( ) and the github PR (https://github.com/pixijs/pixi.js/pull/4049) to explore the possible to create my custom BlendMode. Here are my questions: 1. Does pixi v5 support the custom BlendMode like #4049 mentions, and it seems the version that above post uses is v4.5.3 2. I have no idea how to apply the custom BlendMode to the particle effect with reading the repo (https://github.com/pixijs/pixi-particles). I think I should make some change in ParticleUtils.ts, but I have no clue to begin. 3. I also looked the PR about more BlendMode(https://github.com/pixijs/pixi.js/pull/5391), and does this mean if I want to achieve the custom BlendMode, it can only happen in canvas2D but not in WebGL? 4. If I can not use the method: var gl = WebGLRenderingContext; var blend = new PIXI.BlendMode(gl.ZERO, gl.DST_ALPHA, gl.ONE, gl.ONE_MINUS_DST_ALPHA); sprite.blendMode = blend; then how do I construct the shader like blendFunc(gl.DST_ALPHA, gl.ONE_MINUS_DST_ALPHA) Any advices are appreciated! Thanks in advanced!
-
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?
-
How to add and use blendModes in phaser. And how to use blendModes to bitmap images. Thanks,
-
Hello, Just a quick question. I'm trying to apply blend mode to some graphics in WebGL with no or unwanted results. Here is the setup: const graphics = new PIXI.Graphics(); graphics.beginFill(0x000000, 1); graphics.drawRoundedRect(150, 260, 300, 100, 15); graphics.endFill(); graphics.blendMode = PIXI.BLEND_MODES.SCREEN; // add graphic app.stage.addChild(graphics); Using either SCREEN or ADD, the graphic disappears and using MULTIPLY looks just like normal. I assume that this has to do with how graphics works, but I'd like to know if there is a way around this. Best, Rodrigo. EDIT: Sorry I forgot to add the live sample link: https://codepen.io/rhernando/pen/bb9b55d5e813a9199f0e0e942cbc410c?editors=0010
-
Hello! I am working on a Phaser project (however, the issue is PIXI related). I was having issues with blend modes not always being set correctly when reloading my page. After a couple of days me and my colleague found that the PIXI.blendModesCanvas was being set to something like ["source-over", "lighter", "source-over", "source-over", "source-over", "source-over"] etc. I don't know if other people have ran in to this bug, but I thought I would document this here at least, and if it still exists in newer versions of Phaser/PIXI, that is what is causing it. To fix it we just set the PIXI.blendModesCanvas to a correct list when we start loading the game. We are using Phaser 2.6.2 at the moment, and the correct list is: ["source-over", "lighter", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"]
-
Hi! I'm creating a game that has a lamp sprite that you can switch on/off that uses blendMode 10 or PIXI.blendModes.SOFT_LIGHT However everytime you load the game without cache on Safari 10 the blend mode fails to show. When you refresh the page so its cached it starts working. When I console.log sprite.blendMode in the sprite's update() function it says 10 so it's applied. I use canvas only mode. -
In Babylon.js Is there a way to render animated sprites with an additive (one one) blend mode? Either that or can I use an animated sprite as a particle that uses the particle's one one blend mode? Thanks, -=T=-
-
I have a game that has a texture as an overlay(Phaser.blendModes.OVERLAY), this seems to only work on desktops. While I tested on my iPhone 6 and iPad with IOS 8.4, I just see the texture with no blend on it. I wonder if I'm doing something wrong or maybe blend modes don't work properly on devices.
-
Hello, I just finished writing a small tutorial on how to apply grayscale to an image without using WebGL, and without re-creating all your assets as black&white to show unavailable/disabled/locked modes. You can find it here: http://nightlycoding.com/index.php/2015/08/phaser-io-how-to-apply-a-grayscale-filter-tip/ If you only want the code and a quick example check out this codepen: http://codepen.io/netgfx/full/KpgLmV/ Let me know if you liked this technique!
-
How can I create a PIXI.Container with a transparent background which I can render on top of my main stage container? My goal is it to have 4 layers which contain PIXI.Sprites and PIXI.Texts: layer 1 should be rendered beneath the player layer 2 should be rendered above layer 1 layer 3 should be rendered above the player and above layer 1 and layer 2 layer 4 should be rendered above everything else for debug information In case I can cannot use multiple PIXI.Container then how else could I achieve this effect?
-
Hi, I cannot get blendMode to work with anything but ADD, OVERLAY and SCREEN. Its not down to browser as I have tested working versions that use all the other blend modes in all the browsers Im using outside of PixiJS, so could it be down the the wrong version of Pixi? I tried this here, http://codepen.io/ianmcgregor/pen/CtjeI which allows you to upload a test image and live set the blendmode, and it definitely does not work for me, other than the three mentioned. My code is just standard generate a sprite and apply the blend mode to it myObject.blendMode = PIXI.BLEND_MODES.DIFFERENCE; Am I right in thinking that Pixi can actually use all the other blend modes? the site examples seems to suggest you can - hence Im thinking my version of Pixi might be dated...
-
Hey all, When using a blendmode on a particle the blendmode will get applied to everything on the canvas, player sprites , tile map etc. is this the expected behavior? i want to have it applied only for the particle image someone knows how to do this?
-
Hello, I'm having trouble getting Phaser.blendModes.MULTIPLY to work with the Android Native Browser, instead of being transparent when full white, it displays as full white. Anyone has any ideas why is this happening or how could I fix this. Thanks. -
Hey all, Is there a way to anchor an object (Sprite, Emitter, Image, etc) to a Sprite so that they obey the commands issued to it as if they were one object? I know in theory there's a way to add a bunch of sprites to a group and to manipulate the order of the elements inside of it but I've already built a bunch of pretty advanced controls that rely on Sprite movement/position etc. so I'm trying to avoid having to refactor it. For some context, it's a hero sprite with movement & animation, and I'm trying to add a static jetpack that sits behind (z) the animation, and then an emitter that sits just under (y) the jetpack that spits out fire particles as you thrust upwards. So far I've tried: adding the jetpack as a child of the original sprite, but it's always in front as the hero animation is a texture (side note: tried setting the blendMode of the jetpack to show the texture through it but this doens't work either)updating the jetpack & emitter's x/y values onUpdate, but this leaves a lag that makes them float around and not rigidly adhereadding the hero sprite as a child of the jetpack (it allows for the jetback to appear behind the hero, but it screws up my original code as well)praying to the sky gods for good fortune and wellbeingAny better ideas?
