Rounded Corners for images?

Dar Scott dsc at swcp.com
Tue Oct 10 15:15:06 EDT 2006


On Oct 10, 2006, at 10:55 AM, Ken Ray wrote:

>> Here is a math oriented explanation:
>
> It's about at this point that you lost me... ;-)
>
>> I hope this helps.  I have trouble explaining things.

Ah, and I thought the collage analogy would work if the math didn't.

> I'm sure you explained it perfectly for those that understand those  
> kind of
> things, but to me I think it would be beneficial to have a small  
> handful of
> examples of what you can *do* with these inks (like your suggestion  
> for
> adding rounded corners to images).

OK.

The question was on what grouping did, though.

I am new at this but have found this very powerful.  I usually do  
special composition with a group, so I'll use that as an example.  If  
the group's ink is blendSrcOver, then the special things are  
localized to the group and the result of that is layered pretty much  
as usual.

Try this as a test bed:  Put a pattern on the card.  Make a circle  
with an orange background and set the ink to blendSrcOver with the  
property inspector.  Make a rectangle with a blue background and set  
the ink to blendSrcOver for now.  Move it so it overlaps the lower  
right of the circle.  Group them and set the ink of the group to  
blendSrcOver and set its opaque to false.  Fiddle with blends.  You  
might want to make a button to export snapshot the group into an  
image.  So far, this should be boringly familiar.

Here are some images that show how the Porter-Duff composition  
operators work in SVG:

    http://www.svgopen.org/2005/papers/abstractsvgopen/porterduff.png

This is very similar to how they work in Revolution.  If you look at  
that image, you will see that the P-D names in the picture are very  
similar to the P-D names at the top of the list in the property  
inspector and they are in the same order.

The Revolution operators though are not the normal P-D operators, but  
are (generously) called "clipped-to-self Porter-Duff operators".  The  
differences can be seen here:

    http://www.svgopen.org/2005/papers/abstractsvgopen/clip-to-self.png

In my opinion this is a bug, but there are workarounds.

So, to tinker with this, try changing the ink of of the blue  
rectangle to each of the Porter-Duff operators.  You should see  
something similar to that above.

So what can you do with this?

Well, there is the usual, boring placing an object over another.

You can also crop, but because of the clip-to-self feature (bug), you  
will probably want to make sure the boundaries of the src (blue rect)  
is larger than the opaque part of what's behind it in the group.  Set  
the src to blendDstIn.  Try changing the dst to an image and the src  
to a field with a big letter.  The image is cropped by the letter.  I  
just tried this and the 3-D property was lost--weird--or is too  
subtile for my image.  And it did not do clip-to-self over a graphic  
but it did over an image, so that must depend on the object.  So I  
made some wooden letters.  I changed the ink of the field to  
blendDstOut to cut out letters in my block of wood.

Use blendSrcAtop and blendDstAtop for selective coloring.  It crops  
but also leaves the item there.  So you can stencil something smaller  
than the stencil.

The behavior of blendDst is not quite the same as invisible.  That  
is, the cursor changes and I can type into a field.

I hope to make some little products some day with some tinted domed  
glass effects over fields where I want to be able to select text.  I  
can do this with blendDstOver.  Try modifying the above letter-cutout  
example by setting the blend on the dst object.

You can do collision detection without looping over pixels.  Well,  
you do have to do something about clip-to-self, but that can be  
worked around.  I don't know if that is faster than using computing  
using preprocessed alphas, but it might be.  It allows mixed graphics  
and images and allows an object to be compared to a bunch of other  
objects.

There are also cool thinks that can be done with the image harrassing  
blends, but this mail is too long as it is.

Dar

--
**************************************
Dar Scott
Dar Scott Consulting  and  Dar's Lab
8637 Horacio Place NE
Albuquerque, NM 87111

Lab, office, home:  +1 505 299 9497
Fax:                call above first
Skype:              ask

http://www.swcp.com/dsc
dsc at swcp.com

Computer programming
**************************************





More information about the Use-livecode mailing list