Page 1 of 1
Ink blend modes - any easy tutorial?
Posted: Mon Feb 16, 2015 11:30 pm
by sritcp
I see that the ink of an object defaults to srcCopy, but there seems to be a bunch of options, most of which are completely opaque

to me.
Could someone point me to an accessible tutorial or two?
Thanks,
Sri.
Re: Ink blend modes - any easy tutorial?
Posted: Tue Feb 17, 2015 12:06 am
by FourthWorld
Blend modes can be difficult to describe. Probably the best way to explore them to see which one will fit what you're looking to do is to select the object you're considering changing, open the Inspector to the Blend pane, and arrow-key your way through the list to see how each affects your object.
Did you have a particular effect in mind?
Re: Ink blend modes - any easy tutorial?
Posted: Tue Feb 17, 2015 2:39 am
by sritcp
Oh, I was watching the iOS clock lessons on the "Create It With LiveCode" series, where Kevin Miller was matching the icon background with the rest of the background by changing the ink from srcCopy to srcAnd. It wasn't clear if the original icons had alpha areas which is why you had to use srcAnd (i.e., with srcCopy you won't see even what was behind transparent areas of an image?). I know my description is not clear or complete, but the Kevin Miller Express was speeding along

, and this was what I could pick up!
It occurred to me if there was a tutorial (not necessarily in the LC world) which gave examples of each ink mode, with a few words on where they might find application, it would be a small first step in filling a huge hole in my knowledge of graphics. Given we are in the resolution independence era, use of LC graphics (limited as they are) would be a good way to pretty up the user interface. At least, that was the thinking.
Regards,
Sri.
Re: Ink blend modes - any easy tutorial?
Posted: Tue Feb 17, 2015 2:55 am
by FourthWorld
Trying out my own advice, I made a new stack and added an opaque graphic to it. I double-clicked the graphic to open the Inspector, chose the "Blending" pane in the Inspector, and selected the first line of the options in that list, with the intention of arrow keying my way down until I found something that looked like what you described.
It turns out that the first item there, blendClear, renders the area of the graphic completely clear, allowing me to see the underlying desktop.
Is that what you're looking for?
Re: Ink blend modes - any easy tutorial?
Posted: Tue Feb 17, 2015 4:55 am
by sritcp
No, that wasn't it.
When the clock icons were added to the navigation bar, there were white patches around each image (as you would expect), which stood out against the grey background (see the banding in the picture). As Kevin put it, one way is to use an image editor, add an alpha channel, and re-import the images. The other way is to go to the blend property of each image and change it from srcCopy to srcAnd. When he did that, the whites vanished and the entire background became uniformly grey (that of the background graphic rectangle). I was wondering what exactly does srcAnd do? How did it know to take the white out but leave the red image itself in? Unless I know what each blending does exactly, I wouldn't be able to employ it.
More generally, I thought it would be nice to go over a tutorial if one existed.
Regards,
Sri.
Re: Ink blend modes - any easy tutorial?
Posted: Tue Feb 17, 2015 6:56 am
by FourthWorld
The Dictionary entry for srcAnd may be of interest.
Re: Ink blend modes - any easy tutorial?
Posted: Tue Feb 17, 2015 4:02 pm
by Klaus
I've never seen a satisfying tutorial about blendmodes, simply because that is pure mathematics in the end!
Take look here:
http://en.wikipedia.org/wiki/Blend_modes
http://photoblogstop.com/photoshop/phot ... -explained
http://www.slrlounge.com/school/photoshop-blend-modes/
Good luck and have fun!

Re: Ink blend modes - any easy tutorial?
Posted: Tue Feb 17, 2015 11:41 pm
by sritcp
Thanks for the links, Klaus!
The dictionary entry under srcAnd gives this example:
backgroundComponent bitAnd objectComponent
The effect is that the lighter an object is, the more transparent it is. White parts of an object are completely transparent, and black parts are completely opaque.
For example, suppose an object's color is 45,0,255, and the color of the pixels under the object is 20,45,100. If the srcAnd transfer mode is used, the object's displayed color is 4,0,100 (the decimal equivalent).
The last two components are explained, but I simply don't understand how 45 and 20 became 4 !!!
Regards,
Sri.
Re: Ink blend modes - any easy tutorial?
Posted: Tue Feb 17, 2015 11:44 pm
by Klaus
Hi Sri.
sritcp wrote:... but I simply don't understand how 45 and 20 became 4 !!!
welcome to the club, I have also no idea!
Best
Klaus
Re: Ink blend modes - any easy tutorial?
Posted: Tue Feb 17, 2015 11:54 pm
by sritcp
Well, after tapping on my calculator a bit, I think it is a typo; it should be 40, I think, not 4.
0 is 100% opacity; 255 is 0% opacity.
45 is 82% opacity.
So, the blending is (0.82 x 45) + (0.18 x 20) = 40.5
Regards,
Sri.
Re: Ink blend modes - any easy tutorial?
Posted: Sun Apr 05, 2015 7:35 am
by Dougy
Hi Sri
If you don't have this attached example stack on Blend modes, here it is. Sorry, can't remember whose it is (big thanks to whoever it was!) - I found it very worthwhile.
Regards
Doug.
Re: Ink blend modes - any easy tutorial?
Posted: Sat Apr 18, 2015 2:56 pm
by sritcp
Thanks, Doug!
Sri