Image Rotation

[bidgeeman]

Hi.
I am using a scrollbar to rotate an image with this code:

Code: Select all

on scrollbarDrag pScrollValue
   set the angle of image "i1" of stack "ImageArea" to pScrollValue
end scrollbarDrag

I am happy with the way it works even though the image resizes itself
as it rotates around it's image container to compensate, I can live with
that. There are several solutions out there to solve the image distortion
that are all quite complicated involving snapshots etc and it struck me
why no one has thought of writing a code that resizes the image as it
rotates to compensate as it passes through certain angles? My math isn't
up to the task but i thought I should mention the idea in case anyone
thought it had some substance.

I made an animation to demonstrate.
Currently the red square is the way rotation works in LC now. In a code
that compensates, the blue square would act like the red square but in
reverse, enlarging instead of reducing in size.

Bidge

[dunbarx]

I like the action.

But you do know that setting the "angle" property does not distort an image right?

Craig Newman

[bidgeeman]

Hi Craig.
It distorts my image when rotated, or , resizes is a better terminology I guess
as it rotates the image around inside it's container the edges shrink to match
the edges of the square.

Bidge

[[-hh]]

You may have a look at Rotation Control:
viewtopic.php?p=155611#p155611

[bidgeeman]

OHG! There are some amazing stacks there
Thanks [-hh]
Bidge

[bogs]

You know, it took me (more than) a few times reading this topic to understand (I think) what is going on.

I am using a scrollbar to rotate an image...
I am happy with the way it works even though the image resizes itself
as it rotates around it's image container to compensate...

Craig is quite right when he says that setting the "angle" property does not distort an image when you are setting the angle of the image itself.

The reason your seeing distortion (again, I think) is because your putting the image into an image container, instead of just displaying the image raw on the card, and the image is 'resizing' because it is trying to stay within the bounds of that image container.

Have I got the gist of it right, bidge ?

If you look at this stack, where the image size isn't constrained, you can see what Craig is pointing out, the border resizes and not the image (beware your eyes, this is a very cruel stack).

Remove the .zip extension to open this in Lc, I just renamed it to upload the file.

ringClock.livecode.zip

(135.27 KiB) Downloaded 235 times

[bidgeeman]

Hi bogs.
Says the zip file is empty or invalid for some reason?

Yes you are exactly correct. Also I was unaware that you could import an image
without a container into LC? It auitomatically happens that way when you "Import AS Control". Is there
any other way to import an image?

Bidge

[Klaus]

You ALWAYS need an image container/object to display an image!
If you "import as control", the IDE will also create an image object.

Maybe Bogs means that setting the LOCKLOC of an image to FALSE is the way to go?

[[-hh]]

Yes Klaus, he certainly means that

And that the lockloc has to be false is why we have to do a lot for setting the angle of a referenced image that is resized in a stack:
Setting the angle of a referenced image resizes it first to it's original size.
There is a stack "Angle and Resize an Image" (by Paul Hibbert) on "Sample Stacks" to that problem.

[bogs]

I'll tackle this one first, since it seems to have caused the most problems. I will remind everyone that I have said more than once my style of writing often is not the best, and I apologize for the following confusion. My mouse is also having strange double click weirdness going on, but I'll try to correct for that

The reason your seeing distortion (again, I think) is because your putting the image into an image container, instead of just displaying the image raw on the card, and the image is 'resizing' because it is trying to stay within the bounds of that image container.

I really did word that poorly. As Klaus points out, all images need the image container, whether you create it, or you import the image as a control, the container is there. What I *think* is going on is that you are setting this option
, otherwise known (as Klaus and -hh point out), as the "lockloc", preventing the container from resizing, which prevents the image from resizing the container as it spins around.

When I said 'image raw on the card', I did indeed mean not setting the container to a fixed size, by default as far as I can tell, the container is never set to a fixed size no matter how you put the image there, it has to be set through code or properties window. I could be wrong there, though, I have also pointed out that I am a newb as well heh.

Says the zip file is empty or invalid for some reason?

I will apologize for using you as kind of a guinea pig bidge. I was attempting to prove out a theory from this thread. If it is any consolation, the theory was proven out

It says that it is not a valid zip file because the file is not a zip file, all I did was rename the livecode file with a ".zip" extension. Just above the file are the instructions to use it, but I'll write it again in a different way:
1. download the file to your computer
2. rename the file, removing the ".zip" part of the name
3. in the end, the filename should be "ringClock.livecode" (if it is easier, just copy the part between the quotes, and when renaming paste it, or alternately, rename it to whatever you want as long as the extension says .livecode).

Again, I apologize for putting you on the hamster wheel, but I really was curious as to how well it would work. Forgive me?

[bogs]

Yes Klaus, he certainly means that
And that the lockloc has to be false is why we have to do a lot for setting the angle of a referenced image that is resized in a stack:
Setting the angle of a referenced image resizes it first to it's original size.
There is a stack "Angle and Resize an Image" (by Paul Hibbert) on "Sample Stacks" to that problem.

I found this out myself the hard way, when using an image of a needle that I wanted to 'sweep' across a limited area. It wasn't the right size initially for the area, so I "resized" it in Lc, then wrote the code to make it sweep back and forth. What a MESS that looked like !

Thank you for pointing out Paul's effort, I never thought to look for an example, I just re-sized the image outside of Lc to the size I needed and went along my merry way

[MaxV]

Setting the angle property doesn't deform the image, but it just resize the rect containing the image to avoid distortions!

Normal

Rotated

the second rect is bigger to avoid of shrinking or deforming image.

[bidgeeman]

Oh bogs....I didn't realize you had put those instructions there. I overlooked them in a rush to test your stack.
I see now that if you don't constrain the image it rotates perfectly.

Bidge

[bogs]

@Max, beautiful illustration in just two pictures. Really spot on.

@bidge, no problems, I often miss things exactly the same way, and it really was something I expected to happen.
...I will add that it was faster renaming the file than zipping it, however I will just zip it from now on just to be on the safe side.
...I will also add that compression schemes are funny things, there are files I've had lots of trouble with that weren't just plain zips, like extracting mac compressed files (came across some really early in Lc/Mc history files in .sit files) when not on a mac. It can be done, but it takes some effort (for me at least).

@ayden, glad you liked it.

It is an action I am thinking of for a timer, which is my main way of experimenting with Lc code. Timers are very simple things to write the code and logic for, and give you lots of things to experiment with. When I had this idea, I have to admit I didn't expect the action to look quite like it does. I've had two reactions on people viewing the demo of it (where I made it spin REAL fast), either they stare at it so long their eyes go screwy, or it makes them want to throw up

Spinning slower seems to lessen the impact a bit, and I'm sure spinning to "real time" would lessen it further. Least I hope so, but I may wind up changing the colors and dial design as well heh heh.

[bidgeeman]

Hi again.
Going back to this thread as I have struck a problem with rotation.
Trying to import an image from a folder without using the loc so that it will rotate without distortion. problem is that when I import an image it is larger than the stack so I resize it on import. All good there but when I rotate the image with a slider it pops back to it's original size. How do you overcome this?

Thanks
Bidge