Rounded Corners for images?
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
> adding rounded corners to images).
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
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:
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:
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
There are also cool thinks that can be done with the image harrassing
blends, but this mail is too long as it is.
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
dsc at swcp.com
More information about the Use-livecode