Page 2 of 3
Re: Color to Black & White
Posted: Mon Dec 04, 2023 7:05 pm
by jacque
Cyril, thanks for the great explanation. I knew most of it but wasn't aware of the averaging methods. Very helpful. It's also clear you've been a good teacher. I had a high school teacher once who droned through his prepared lecture for an hour and never looked up once all semester. I never remembered anything he said.
Re: Color to Black & White
Posted: Mon Dec 04, 2023 8:46 pm
by Newbie4
You are welcome and thanks to you for all I have learned from your posts on this forum. It is a very good resource for learning about LiveCode and more.
We all had teachers like you described.
Its interesting. When I taught at a prestigious university, the discussion often came up as to our role there. Many of us were committed to our teaching and reaching as many students as possible. Others felt their role was to graduate only the top students in order to maintain the high reputation of the institution.
It is simpler at the high school level. Some teachers want to graduate as many students as possible, others want to maintain their standards (reputation?) and there are those who do not necessarily care, they show up every day. Luckily most of them care and do try to do their best.
Like it or not, doesn't it prepare us for real life?
Re: Color to Black & White
Posted: Mon Dec 04, 2023 9:36 pm
by bn
Cyril's explanations are very helpful in understanding what the conversion from RGB to B/W needs.
Here is a short snippet that lets you do it in Livecode without having to touch every pixel.
Make a stack with two images. The first is your color image the second will be your B/W image.
A button with this script.
Code: Select all
on mouseUp
repeat with i = 0 to 255
put i & comma & i & comma & i & return after tColorList
end repeat
delete char -1 of tColorList
export image "Original" to image "fff" as png with palette tColorList
end mouseUp
It sure beats accessing every pixel and translate it to greyscale.
Kind regards
Bernd
Re: Color to Black & White
Posted: Mon Dec 04, 2023 11:27 pm
by dunbarx
Bernd.
Nice way to assemble
"1,1,1"
"2,2,2"
"3,3,3"
...
Re: Color to Black & White
Posted: Tue Dec 05, 2023 12:01 am
by Newbie4
Bern,
It may be faster but not better. Compare the results and you will see the difference.
I have a stack to demonstrate but it is too large to load. LiveCode really generates large files. My test program with only 30 lines of code total on 3 buttons ended up 5MB. Even the zip file is too large to include as an attachment (1.5MB)
You lose a lot of brightness and detail using the Palette method.
Thanks,
Re: Color to Black & White
Posted: Tue Dec 05, 2023 12:28 am
by bn
Cyril,
Thanks for testing.
I repeated my tests using an image with more dynamic light/dark ranges and I agree that your method produces better black/white dynamic than the palette method.
Before I tested with an image that had a lower dynamic range and could not see a difference.
Kind regards
Bernd
Re: Color to Black & White
Posted: Tue Dec 05, 2023 3:57 am
by jiml
There is also TinyColor for LiveCode by Ferruslogic.
https://github.com/Ferruslogic/TinyColo ... ag/v1.0.0b
Post by andresdt » Fri Jan 21, 2022 5:08 pm
TinyColor is a popular JavaScript library. With a 4.1k star rating on GitHub.
https://github.com/bgrins/TinyColor
Image
We now have a version of this popular library for LiveCode. Written 100% in LiveCodeScript.
Jim Lambert
Re: Color to Black & White
Posted: Tue Dec 05, 2023 11:29 am
by bn
Newbie4 wrote: ↑Mon Dec 04, 2023 5:37 am
Code: Select all
repeat with tPixel = 0 to (origHeight * origWidth ) - 1
put tPixel * 4 into pixelStart
// get the color values
put charToNum (char (pixelStart + 2) of image1) into tRed
put charToNum (char (pixelStart + 3) of image1) into tGreen
put charToNum (char (pixelStart + 4) of image1) into tBlue
put ( (tRed + tGreen + tBlue) / 3 ) into tAvg
put numToChar (tAvg ) into char (pixelStart + 2) of image1 // Red
put numToChar (tAvg) into char (pixelStart + 3) of image1 // Green
put numToChar (tAvg) into char (pixelStart + 4) of image1 // Blue
end repeat;
Cyril,
please note that numToChar, charToNum, and "char" in this context has been deprecated.
We are advised to use numToByte, byteToNum, and byte in this context. This was introduced with the advent of unicode.
Your code adapted to the current recommendation:
Code: Select all
repeat with tPixel = 0 to (origHeight * origWidth ) - 1
put tPixel * 4 into pixelStart
// get the color values
put byteToNum (byte (pixelStart + 2) of image1) into tRed
put byteToNum (byte (pixelStart + 3) of image1) into tGreen
put byteToNum (byte (pixelStart + 4) of image1) into tBlue
put ( (tRed + tGreen + tBlue) / 3 ) into tAvg
put numToByte (tAvg ) into byte (pixelStart + 2) of image1 // Red
put numToByte (tAvg) into byte (pixelStart + 3) of image1 // Green
put numToByte (tAvg) into byte (pixelStart + 4) of image1 // Blue
end repeat
This version is a lot faster than the deprecated notation.
Kind regards
Bernd
Re: Color to Black & White
Posted: Tue Dec 05, 2023 1:36 pm
by stam
bn wrote: ↑Tue Dec 05, 2023 11:29 am
please note that numToChar, charToNum, and "char" in this context has been deprecated.
We are advised to use numToByte, byteToNum, and byte in this context. This was introduced with the advent of unicode.
hasn't
numToChar been replaced with
numToCodepoint and
charToNum been replaced with
codepointToNum? (I believe this change was brought in for unicode?)
Obviously if working with actual bytes neither of these should be used...
Re: Color to Black & White
Posted: Tue Dec 05, 2023 1:49 pm
by bn
stam wrote: ↑Tue Dec 05, 2023 1:36 pm
bn wrote: ↑Tue Dec 05, 2023 11:29 am
please note that numToChar, charToNum, and "char" in this context has been deprecated.
We are advised to use numToByte, byteToNum, and byte in this context. This was introduced with the advent of unicode.
hasn't
numToChar been replaced with
numToCodepoint and
charToNum been replaced with
codepointToNum?
Obviously if working with actual bytes neither of these should be used...
In the context of images one operates on actual bytes and hence
numToByte, byteToNum, and byte which are in the range of 0 to 255.
codepoint is used for unicode text and goes up to 0x10FFFF = decimal 1114111 (I looked that up...)
Kind regards
Bernd
Re: Color to Black & White
Posted: Tue Dec 05, 2023 2:40 pm
by Newbie4
Thanks Bernd, that is good to know.
LiveCode has gotten too complicated and harder. There is not enough documentation and examples. What documentation that is out there is slowly becoming incorrect and obsolete.
This forum is one of the few places to get help and I have noticed the decrease of activity over the years. I think they are putting all of their eggs in the wrong basket.
Anyway, this topic would make the start of a good chapter on manipulating images.
Re: Color to Black & White
Posted: Tue Dec 05, 2023 9:01 pm
by jiml
As Bernd noted export with palette is very quick.
And you can do wacky color palettes.
Jim Lambert
Re: Color to Black & White
Posted: Tue Dec 05, 2023 9:55 pm
by bn
Jim,
thanks for posting this stack. While the greyscale is faster using "palette" it is also not as nice as doing the math on the pixels.
Make a new button on your stack and set the script of it to
Code: Select all
on mouseUp
put the milliseconds into t1
put 1 into tImgName
put 2 into tImgName2
put the height of image tImgName into origHeight
put the width of image tImgName into origWidth
put the imageData of image tImgName into tImgData
put numToByte(0) into tNullByte -- for alphavalue which is not used but needed
repeat with tPixel = 0 to (origHeight * origWidth ) - 1
put tPixel * 4 into pixelStart
// get the color values
put byteToNum (byte (pixelStart + 2) of tImgData) into tRed
put byteToNum (byte (pixelStart + 3) of tImgData) into tGreen
put byteToNum (byte (pixelStart + 4) of tImgData) into tBlue
if the optionKey is down then
put trunc((tRed + tGreen + tBlue) / 3 ) into tAvg -- unadjusted average
else
put trunc(0.299*tRed + 0.587*tGreen + 0.114*tBlue) into tAvg -- adjusted average
end if
put tNullByte into byte(pixelStart + 1) of tImgData2
put numToByte(tAvg) into byte (pixelStart + 2) of tImgData2
put numToByte(tAvg) into byte (pixelStart + 3) of tImgData2
put numToByte(tAvg) into byte (pixelStart + 4) of tImgData2
end repeat
set the width of image tImgName2 to origWidth
set the height of image tImgName2 to origHeight
set the imageData of image tImgName2 to tImgData2
put the milliseconds - t1 && "milliseconds"
end mouseUp
if you hold down the option key it uses the sum of RGB values diveded by 3, without the option key down it uses an adjusted factor for RGB values.
-- 0.299*R + 0.587*G + 0.114*B
Especially in the yellow and green colors of the flowers you will notice the difference.
Kind regards
Bernd
Re: Color to Black & White
Posted: Tue Dec 05, 2023 10:42 pm
by Newbie4
Yes, good Jim. Thanks for the nice example
Thanks Bernd for the post. (You beat me to it)
I was going to suggest adding a 3rd image (image 3) and a button with the following code:
Code: Select all
on mouseUp
put image 1 into image 3
wait 30 ticks
put the imageData of image 1 into tImage
put (the Height of image 3 * the width of image 3)-1 into tSize
repeat with tPixel = 0 to tSize
put tPixel * 4 into pixelStart
// get the color values
put byteToNum (byte (pixelStart + 2) of tImage) into tRed
put byteToNum (byte (pixelStart + 3) of tImage) into tGreen
put byteToNum (byte (pixelStart + 4) of tImage) into tBlue
// average and replace
put ( (tRed + tGreen + tBlue) / 3 ) into tAvg
put numToByte (tAvg) into byte (pixelStart + 2) of tImage // Red
put numToByte (tAvg) into byte (pixelStart + 3) of tImage // Green
put numToByte (tAvg) into byte (pixelStart + 4) of tImage // Blue
end repeat
set the imageData of image 3 to tImage
end mouseUp
With the extra image field, you can see the difference in a side-by-side comparison. I took the size calculation out of the Repeat loop.
I like your use of the option key to see the difference weighting makes. Thanks
What is surprising is that adding this code bumped up the size of the stack from 104 K to 2.4 MB. That is a lot of LiveCode engine code to support that little code.
Re: Color to Black & White
Posted: Wed Dec 06, 2023 12:56 pm
by richmond62
What not many people hereabouts may have noticed in their attempts to outdo each other and scramble for their spot in the sunlight is that the original point about a
palette of a very few colours produces interesting graphic effects that other people are paying for by buying fancy filters for Photoshop:
-