Graphic effects - Feather Edges of Rects

Terry Judd terry.judd at unimelb.edu.au
Thu Feb 4 04:15:07 EST 2016


OK - given that an image is involved (I think I missed that bit) and
assuming you are feathering to a solid background colour, the best result
that I got was overlaying two identically sized transparent graphics with
a one or two pixel white border and an outer glow. The second graphic has
different parameters to the first and is needed to remove the hint of an
edge of the image that shows though the first graphic’s glow.

Terry...

On 4/02/2016 4:52 pm, "use-livecode on behalf of Howard Bornstein"
<use-livecode-bounces at lists.runrev.com on behalf of
bornstein at designeq.com> wrote:

>On Wed, Feb 3, 2016 at 9:45 PM, Terry Judd <terry.judd at unimelb.edu.au>
>wrote:
>
>> OK, what about thisŠ
>>
>> Transparent (non opaque) graphic object with a 1 pixel linesize. Apply
>>an
>> outer glow - this will display equally on either side of the border.
>>Then
>> alter the border colour to match the glow where it adjoins the border.
>>The
>> border Œdisappears¹ but it may or may not simulate the effect you are
>> looking for.
>>
>
>This is exactly what I did and it works pretty well. Unfortunately, while
>it works fine for creating a feathered rectangle (or oval), it doesn't
>really work for feathering an image, because you don't want the glow to be
>on the inside of the image.
>
>>
>> Terry...
>>
>> On 4/02/2016 3:44 pm, "use-livecode on behalf of Scott Rossi"
>> <use-livecode-bounces at lists.runrev.com on behalf of
>> scott at tactilemedia.com> wrote:
>>
>> >The way one *should* be able to do this is using the innerGlow effect.
>> >However, by itself, using the basic setting is not strong enough, and
>>the
>> >spread effect is backwards (increases outward, rather than inward --
>>bug)
>> >so that's useless.
>> >
>> >You can achieve a feather effect using multiple objects stacked on top
>>of
>> >each other, but then you have to ask is that worth doing.  If you have
>>to
>> >do anything with the set of objects, such as move it around or scale
>>it,
>> >then the effect is probably too much trouble, especially on mobile.
>> >
>> >You can create a feather effect by grouping the source image with a
>>mask
>> >image that contains a painted rectangular inner glow effect.  If you
>>set
>> >the centerRect of the mask image to appropriate dimensions (the radius
>>of
>> >glow at each corner of the image), you can resize the group and keep
>>the
>> >glow effect intact with no loss of quality.
>> >
>> >FYI, you can create a transparent graphic with innerGlow using an ink
>> >effect.  For example, set the backColor of the graphic to black, apply
>>a
>> >white innerGlow (255 opacity), and set the ink of the graphic to
>> >blendScreen.  This will make all black in the graphic transparent while
>> >keeping the white intact.  But again, the innerGlow is fairly weak.
>> >
>> >Regards,
>> >
>> >Scott Rossi
>> >Creative Director
>> >Tactile Media, UX/UI Design
>> >
>> >
>> >
>> >
>> >On 2/3/16, 7:38 PM, "use-livecode on behalf of Howard Bornstein"
>> ><use-livecode-bounces at lists.runrev.com on behalf of
>> >bornstein at designeq.com> wrote:
>> >
>> >>Yes this is true and understood. However, I've been working with
>> >>Brahmanathswami to find a solution for a transparent object because,
>>as
>> >>he
>> >>says, "Any inner glow or outer glow leaves a sharp edge on the object
>>no
>> >>matter what we do." (with an opaque object)
>> >>
>> >>He was looking for a way to feather images within LC and an opaque
>> >>graphic
>> >>object won't do that (as far as I can tell).
>> >>
>> >>On Wed, Feb 3, 2016 at 5:19 PM, Terry Judd <terry.judd at unimelb.edu.au>
>> >>wrote:
>> >>
>> >>> Hi Howard - the outerglow (and innerglow) of an object display fine
>>for
>> >>>me
>> >>> on both a field and an (and this bit is important) *opaque* graphic
>> >>>object
>> >>> when their borderWidth and lineSize properties are respectively set
>>to
>> >>>0.
>> >>>
>> >>> Terry...
>> >>>
>> >>> On 4/02/2016 11:26 am, "use-livecode on behalf of Howard Bornstein"
>> >>> <use-livecode-bounces at lists.runrev.com on behalf of
>> >>> bornstein at designeq.com> wrote:
>> >>>
>> >>> >As did I. What happened when you set the linesize to 0?
>> >>> >
>> >>> >On Mon, Feb 1, 2016 at 12:42 PM, Devin Asay <devin_asay at byu.edu>
>> >>>wrote:
>> >>> >
>> >>> >>
>> >>> >> > On Feb 1, 2016, at 11:53 AM, Howard Bornstein
>> >>><bornstein at designeq.com
>> >>> >
>> >>> >> wrote:
>> >>> >> >
>> >>> >> > If you set the line size to 0, the outer glow disappears.
>> >>> >>
>> >>> >> For what kind of object? I tested it on a graphic object.
>> >>> >>
>> >>> >> Devin
>> >>> >>
>> >>> >> Devin Asay
>> >>> >> Office of Digital Humanities
>> >>> >> Brigham Young University
>> >>> >>
>> >>> >>
>> >>> >> _______________________________________________
>> >>> >> use-livecode mailing list
>> >>> >> use-livecode at lists.runrev.com
>> >>> >> Please visit this url to subscribe, unsubscribe and manage your
>> >>> >> subscription preferences:
>> >>> >> http://lists.runrev.com/mailman/listinfo/use-livecode
>> >>> >>
>> >>> >
>> >>> >
>> >>> >
>> >>> >--
>> >>> >Regards,
>> >>> >
>> >>> >Howard Bornstein
>> >>> >-----------------------
>> >>> >www.designeq.com
>> >>> >_______________________________________________
>> >>> >use-livecode mailing list
>> >>> >use-livecode at lists.runrev.com
>> >>> >Please visit this url to subscribe, unsubscribe and manage your
>> >>> >subscription preferences:
>> >>> >http://lists.runrev.com/mailman/listinfo/use-livecode
>> >>>
>> >>>
>> >>> _______________________________________________
>> >>> use-livecode mailing list
>> >>> use-livecode at lists.runrev.com
>> >>> Please visit this url to subscribe, unsubscribe and manage your
>> >>> subscription preferences:
>> >>> http://lists.runrev.com/mailman/listinfo/use-livecode
>> >>>
>> >>
>> >>
>> >>
>> >>--
>> >>Regards,
>> >>
>> >>Howard Bornstein
>> >>-----------------------
>> >>www.designeq.com
>> >>_______________________________________________
>> >>use-livecode mailing list
>> >>use-livecode at lists.runrev.com
>> >>Please visit this url to subscribe, unsubscribe and manage your
>> >>subscription preferences:
>> >>http://lists.runrev.com/mailman/listinfo/use-livecode
>> >
>> >
>> >
>> >_______________________________________________
>> >use-livecode mailing list
>> >use-livecode at lists.runrev.com
>> >Please visit this url to subscribe, unsubscribe and manage your
>> >subscription preferences:
>> >http://lists.runrev.com/mailman/listinfo/use-livecode
>>
>>
>> _______________________________________________
>> use-livecode mailing list
>> use-livecode at lists.runrev.com
>> Please visit this url to subscribe, unsubscribe and manage your
>> subscription preferences:
>> http://lists.runrev.com/mailman/listinfo/use-livecode
>>
>
>
>
>-- 
>Regards,
>
>Howard Bornstein
>-----------------------
>www.designeq.com
>_______________________________________________
>use-livecode mailing list
>use-livecode at lists.runrev.com
>Please visit this url to subscribe, unsubscribe and manage your
>subscription preferences:
>http://lists.runrev.com/mailman/listinfo/use-livecode



More information about the use-livecode mailing list