Imaging Functions

[bn]

Hi Luisa,

a very nifty stack. I made about 35 scottish kilt patterns... How can I order the fabric ?

I see you get used to the Livecode language. Just a little trick:

Code: Select all

on mouseUp
   lock screen
   makeWeave -- Run the handler that makes the pattern.
   set the backgroundPattern of graphic "tiled" to the ID of image "blank" -- Display the pattern as the background of the rectangle graphic.
   unlock screen
end mouseUp

the lock screen / unlock screen will increase the speed of the Make Weave. Fewer screen updates = faster execution.

Kind regards

Bernd

[Luisa Klose]

Thanks for the tip, Bernd. I used it right away. After I posted the stack, I noticed that it didn't work the way it does in PixelToolbox. After lots of debugging, I traced it to two things: mistakes I made changing the names of variables, and the fact that in LiveCode, one can't start a rectangle outside of the image bounds. I had to test for the condition and draw those reversed.

I'm attaching the new version.

By the way, I tried to "Share This Stack..." and was not able to sign up for an account. I assume that I have to buy the license first.

[Luisa Klose]

Hi guys,

Is there a way in LiveCode to copy an image into a variable, do the imaging operations (including drag) on the variable, and replace the original image with the one in the variable?

I see that Bernd's Make Gradient example does that somewhat, but what about if I want to do a drag operation instead of a get/set pixel operation?

Director Lingo has the "duplicate()" function:

Description: This function creates and returns a copy of the given imageObject. The new image is completely independent of the original, and isn’t linked to any cast member.

If you plan to make a lot of changes to an image, it’s better to make a copy that’s independent of a cast member.

LiveCode's "clone" command seems to be for making actual copies.

Thanks,

Luisa Klose

[bn]

Hi Luisa,

I don't get what exactly it is your are trying to do. Could you give an example. What is the drag part? Do you want to drag the cloned image around?

Kind regards

Bernd

[Luisa Klose]

Heya, Bernd,

I'm attaching an example. In it, I scripted a handler that allows the user to interactively draw horizontal gradients, using the rectangle tool (and the drag command).

When you look at the handler, keep in mind that in Director Lingo, the "drag" commands ("fill" in Lingo lingo) are done on a virtual copy of the image, for speed. The real image is updated only once per repeat loop.

The performance of the LiveCode adaptation is better than I thought it would be, but not fast enough for a lot of applications.

Warm regards,

Luisa

Edit to add: Thinking about it, I think that I can make the gradient tool using your method (without the hsv conversions), after all, I just have to calculate one row and repeat it for the height of the shape. Probably with much better performance. I'll post the result later. Thankx.

[bn]

Hi Luisa,

I made a little change to your stack and it seems smoother now. You queried the mouseV at different times in your repeat loops. I now only take one mouseV at the beginning of the main repeat loop and use that.

see the comments in the script. I marked them with "####--------------BN"

But I think the way to would be similar to the gradient stack I posted.

Kind regards

Bernd

Draw Gradients_BN.livecode.zip

(2.8 KiB) Downloaded 236 times

[Luisa Klose]

It got rid of the jaggies, and the performance is better! Wow. I would have never guessed that that was the cause of the jagged edges. Thank you again, Bernd.

Warm regards,

Luisa

Edit to add: The original Lingo script does use a variable constructed at the beginning of the repeat loop. But I simplified it a little too much

[Luisa Klose]

Hi, Bernd,
I rewrote the handler in my draw gradients stack that puts a gradient on the whole image. Instead of using the drag command, it converts a row of pixel values through the numToChar function, and writes the imageData of the new image. It's pretty fast.

Now, doing it on a dynamically resizing rectangle inside of an image is a more difficult proposition, but I think it's possible. It may end up being fast enough for most applications.

Warm regards,

Luisa

[bn]

Hi Luisa,

very nice, you are catching up on Livecode very fast. Especially working with imagedata is putting many people of.

I did a version of the gradient image using imageData constructed on the fly. I do that with a temporary image which is merged with a baseImage via snapshot. That is easier than to stuff the gradient image imageData into the imageData of the baseImage. Which of cours is always an option. I also wanted to show the use of snapshots. With this you could also use graphic objects and do a snapshot to get a unified image.

Oh, now you can drag the gradient to the left of the starting point too.

See the comments in the code of the white "baseImage"

By the way your gradient stack showed me how to do the gradient using RGB values only, thank you.

Please test stack thouroughly, I had some crashes during development and don't know if it was me or something Livecode did not like. I have a faint recollection of people complaining about crashes when grouping/ungrouping on the fly. If you see crashes with this stack I could change it to an imageData only version, without grouping/snapshot. I use snapshots a lot so they are unlikely to be the cause.

It is always a good idea during development to save your stacks, just to be shure. I even do incremental backups (if I don't forget...). Not that Livecode crashes very often on me, but once in a while I get it to crash and without having saved your stacks you do a lot of retyping...

Kind regards

Bernd

paintGradient.livecode.zip

(19.58 KiB) Downloaded 247 times

[Luisa Klose]

Very interesting approach, Bernd, and the performance is great. I will have to spend a little time studying your example.

The more I see of what is possible with LiveCode, the more impressed I am.

Hey Klaus, perhaps the graphics engine doesn't need a rewrite!

I'm glad I started this thread.

Thanks, folks,

Luisa

Edit to add: Bernd, your stack worked well without any crashes. While playing around yesterday, I wrote something that sent LiveCode into a crashing frenzy as soon as I moved the pointer over the stack, so I couldn't even edit the script. My solution was to open the property inspector (while keeping the pointer away from the stack) and open the image's script through it. Whew...

Oops, forgot to tell you, Bernd, that the HSV conversion approach produces an interesting effect, but not really a gradient between the two values.

[bn]

Luisa,

I added an undo function (last action only), transparency setting and an optional dropshadow. Not that I would suggest you add it to your stack, it is mainly to show how such things can be done by script. And if you explore the options of Livecode and combine them into your project I am shure you will find out interesting ways to use them.

But Yes, the graphics engine does need an overhaul. Sooner or later the graphics engine is just too slow for certain projects, even with very efficient scripting. But again, below that threshhold there are a lot of possibilities, sometimes it just needs a workaround/clever scripting that makes things possible.

Have a look at Scott Rossi's site
http://www.tactilemedia.com/index.html? ... rials.html
He does wonderfully designed objects in livcode, here are some techniques for images/animation as tutorials.

Kind regards

Bernd

paintGradient_2.livecode.zip

(82.34 KiB) Downloaded 267 times

[Luisa Klose]

It's awesome, Bernd. The addition of transparency and shadows make it a truly unique and lovely digital tool. I don't know if it shows, but I'm super inspired. Bookmarked Scott Rossi's site. Thank you.

Warm regards,

Luisa

[bn]

Hi Luisa,

thank you, glad you like it. I was fascinated by these 'silly gradient rectangles' with transparency and dropshadow too. It gives the image a lot of depth with rectangles partially overlapping each other etc.

BTW in playing around there were no crashes, so the stack is probably OK.

Kind regards

Bernd

[Luisa Klose]

Heya, Bernd, the only problem I had with the stack was when I tried to see what the "cRestore" of the base image was. It doesn't crash LiveCode, but it does make it hang momentarily.

When I do the second version of PixelToolbox, the gradient tool will have transparency and drop shadow options thanks to you. And it gets me thinking about other possible options.

Right now I'm working on a problem that has me stumped. I'm going to give it another shot tonight so that maybe I can come here tomorrow with something neat to show instead of asking for help.

Kind regards,

Luisa

[bn]

Hi Luisa,

I tried to see what the "cRestore" of the base image was. It doesn't crash LiveCode, but it does make it hang momentarily.

cRestore is a custom property of the card. The imagedata of the baseImage is stored in cRestore before the baseImage is changed. That way you can go back to the previous version by setting the imageData of the baseImage to the content of cRestore.

If you look at cRestore in the inspector it might take a moment before it shows up in the field for the content of the custom property. That would not worry me much. It is just a bunch of binary data and not really useful for human reading.

Looking forward to what you come up with.

Kind regards

Bernd