Hi Ben, Back from vacation, I couldn't resist trying "for real" the tips I sent you.
So here is a sample tested app that does what you need, in pure mxml: The file "Koala.jpg" is a sample 200x200 jpeg. The image is not draggable of course, but it's correctly masked (0.3 red colorized) outside of the central white area. Try it and let me know. <?xml version="1.0"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" backgroundColor="gray" > <s:Rect id="areaRect" left="100" top="100" right="100" bottom="100"> <s:fill> <s:SolidColor color="white" alpha="1"/> </s:fill> </s:Rect> <s:Group id="offMaskGrp" left="0" top="0" bottom="0" right="0"> <s:Rect id="leftStrip" left="0" top="0" bottom="0" width="100"> <s:fill> <s:SolidColor alpha="0"/> </s:fill> </s:Rect> <s:Rect id="topStrip" left="100" top="0" right="100" height="100"> <s:fill> <s:SolidColor alpha="0"/> </s:fill> </s:Rect> <s:Rect id="rightStrip" top="0" bottom="0" right="0" width="100"> <s:fill> <s:SolidColor alpha="0"/> </s:fill> </s:Rect> <s:Rect id="bottomStrip" left="100" bottom="0" right="100" height="100"> <s:fill> <s:SolidColor alpha="0"/> </s:fill> </s:Rect> </s:Group> <s:Group id="draggable" left="50" top="50"> <s:BitmapImage source="@Embed('/embedded/Koala.jpg')" /> <s:Rect id="offRect" left="0" top="0" right="0" bottom="0" mask="{offMaskGrp}"> <s:fill> <s:SolidColor color="red" alpha="0.3"/> </s:fill> </s:Rect> </s:Group> </s:Application> Regards, Maurice -----Message d'origine----- De : Ben Smeets [mailto:[email protected]] Envoyé : mardi 27 août 2013 09:30 À : [email protected] Objet : Re: Limit Blendmode to 1 layer Tnx Maurice, Will try to come up with something working using your tips. If I do, I'll let you know. @Alex: I tried the Pbj shader as well, but it completely kills performance :( (as in, macbook lifting off into space with it's fan). Ben On 27 aug. 2013, at 09:15, Maurice Amsellem <[email protected]> wrote: > > Option 1) is not such complex math. You can use globalTolLocal and > localToGlobal to help for conversions. > > Option2) you can get both red and alpha, because the hole only acts as a > mask, and it´s the overlay rect that has the red fill with alpha. > I am in vacation, without my pc, so i can't send you any code that i have > tested until next week... > > Regards > > Maurice > > ________________________________________ > De : Ben Smeets [[email protected]] > Envoyé : lundi 26 août 2013 23:08 > À : [email protected] > Objet : Re: Limit Blendmode to 1 layer > > Tnx Maurice, > > Option 1 is something I thought about. Doable, but complex math. It's what > triggered me to find help for a different approach though. > > Option 2 is the road I'm at now. I have the hole. The challenge is, that I > would like the parts outside the "shape layer" to be red instead of alpha. So > masking (not sure) is not something that'll work. That's how I got to the > blendmodes. E.g. making the layer on top (with the hole inside) red and > blended. The only thing I'm still left with, is that that top layer will also > colorize everything below the image (the thing I only need to be colorized). > > Either way what we come up with, It already helpes knowing that my > current approach is not entirely crazy, tnx :) > > Ben > > On 26 aug. 2013, at 22:03, Maurice Amsellem <[email protected]> > wrote: > >> Ok, i think i understood: the part of the dragged image that gets off the >> square dragging area needs to be colorized. >> >> Assuming my understanding is correct, I would do it either of two ways: >> >> 1) programmatic >> >> While the image is dragged around, determine the area that is off >> bounds and draw a semi-transparent rectangle ( in updateDisplayList) >> in. That area >> >> 2) mxml >> Add an overlay rect the size and position of the dragged image, with >> alpha fill ( put them in the same s:group) Create an area that corresponds >> to the off-bounds area, ie the background rectangle with a hole >> corresponding to the square white rectangle, and use it as a mask ( mask >> property) to the overlay rectangle. That way , the overlay rectangle will >> be drawn only where the mask is ON. >> However, perfromance may be impacted when using large masks, so i definitely >> prefer the programmatic way. >> >> Hope this helps >> >> Maurice >> >> >> ________________________________________ >> De : Ben Smeets [[email protected]] >> Envoyé : lundi 26 août 2013 20:30 >> À : [email protected] >> Objet : Re: Limit Blendmode to 1 layer >> >> Sure, I'll try to explain it :) This is what I currently have: >> >> - Top layer (blendMode=x) >> - Draggable object layer (image) >> - Shape layer (square white rectangle) >> - Background layer (plain gray) >> >> The Top layer is draggable. The goal is to make every part of Draggable >> layer which is dragged outside of the shape layer below it, colorized (or >> something visual, while retaining a bit of the visual aspect, which is why I >> got to overlaying a blended layer.). Most issues have been tackled. Only >> thing left now is that by applying a blendMode, the gray background get's >> part of that blend effect (color) as well. So I through the trick would be >> to limit the blendmode to only the Dragable Object Layer. >> >> Don't mean to spam the list, if this is not exactly Flex related. Any tips >> appreciated. >> >> Ben >> >> On 26 aug. 2013, at 19:29, Maurice Amsellem <[email protected]> >> wrote: >> >>> For me, colorTrasform applies to the whole layer, no masking is possible. >>> Maybe if you can describe in more detail what you are trying to do, >>> someeone can help... >>> >>> Maurice >>> ________________________________________ >>> De : Ben Smeets [[email protected]] >>> Envoyé : lundi 26 août 2013 19:23 >>> À : [email protected] >>> Objet : Re: Limit Blendmode to 1 layer >>> >>> Didn't think of that one, nice. Extra challenge though, is that i can't >>> transform the entire layer. Just the part that the top layer is over (or is >>> that possible with colortransform as well)? >>> >>> Op 26 aug. 2013 om 17:35 heeft Maurice Amsellem >>> <[email protected]> het volgende geschreven: >>> >>>> If the purpose of the blending layer is to apply an coloring / lighting >>>> effect to the layer below, they applying a color transform to the layer >>>> below instead (colorTransform property) could be what you need. >>>> >>>> Maurice >>>> ________________________________________ >>>> De : Ben Smeets [[email protected]] >>>> Envoyé : lundi 26 août 2013 15:58 >>>> À : [email protected] >>>> Objet : Limit Blendmode to 1 layer >>>> >>>> Hi, >>>> >>>> Anybody know if it is possible to limit the effect of a Blended layer to >>>> only the layer below it (e.g.). My app has a dark background, the top >>>> layer which is blending is now blending over all layers, including the >>>> background. I am trying to let it blend over 1 specific layer below it >>>> without affecting anything else. >>>> >>>> Tnx, Ben >>>> >>> >> >> > >
