Image Rotation

Got a LiveCode personal license? Are you a beginner, hobbyist or educator that's new to LiveCode? This forum is the place to go for help getting started. Welcome!

Moderators: Klaus, FourthWorld, heatherlaine, kevinmiller

bidgeeman
Posts: 495
Joined: Wed Feb 21, 2007 7:58 am
Location: Australia

Image Rotation

Post by bidgeeman » Tue Aug 22, 2017 1:54 am

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
Attachments
AnimationB.gif
AnimationB.gif (206.15 KiB) Viewed 2086 times

dunbarx
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 6186
Joined: Wed May 06, 2009 2:28 pm
Location: New York, NY

Re: Image Rotation

Post by dunbarx » Tue Aug 22, 2017 4:02 am

I like the action.

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

Craig Newman

bidgeeman
Posts: 495
Joined: Wed Feb 21, 2007 7:58 am
Location: Australia

Re: Image Rotation

Post by bidgeeman » Tue Aug 22, 2017 4:07 am

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]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 2124
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Image Rotation

Post by [-hh] » Tue Aug 22, 2017 4:11 am

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

bidgeeman
Posts: 495
Joined: Wed Feb 21, 2007 7:58 am
Location: Australia

Re: Image Rotation

Post by bidgeeman » Tue Aug 22, 2017 4:53 am

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

bogs
Posts: 3832
Joined: Sat Feb 25, 2017 10:45 pm

Re: Image Rotation

Post by bogs » Wed Aug 23, 2017 5:09 pm

You know, it took me (more than) a few times reading this topic to understand (I think) what is going on.
bidgeeman wrote: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 63 times
Image

bidgeeman
Posts: 495
Joined: Wed Feb 21, 2007 7:58 am
Location: Australia

Re: Image Rotation

Post by bidgeeman » Thu Aug 24, 2017 12:28 am

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
Posts: 11217
Joined: Sat Apr 08, 2006 8:41 am
Location: Germany
Contact:

Re: Image Rotation

Post by Klaus » Thu Aug 24, 2017 9:43 am

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]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 2124
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Image Rotation

Post by [-hh] » Thu Aug 24, 2017 1:46 pm

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.
shiftLock happens

bogs
Posts: 3832
Joined: Sat Feb 25, 2017 10:45 pm

Re: Image Rotation

Post by bogs » Thu Aug 24, 2017 3:05 pm

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 :(
bogs wrote: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
Image, 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.
bidgeeman wrote: 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? :wink:
Image

bogs
Posts: 3832
Joined: Sat Feb 25, 2017 10:45 pm

Re: Image Rotation

Post by bogs » Thu Aug 24, 2017 3:21 pm

[-hh] wrote: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 :oops:
Image

MaxV
Posts: 1574
Joined: Tue May 28, 2013 2:20 pm
Location: Italy
Contact:

Re: Image Rotation

Post by MaxV » Thu Aug 24, 2017 5:18 pm

Setting the angle property doesn't deform the image, but it just resize the rect containing the image to avoid distortions!
Example1.png
Normal
example2.png
Rotated
the second rect is bigger to avoid of shrinking or deforming image.
Livecode Wiki: http://livecode.wikia.com
My blog: https://livecode-blogger.blogspot.com
To post code use this: http://tinyurl.com/ogp6d5w

bidgeeman
Posts: 495
Joined: Wed Feb 21, 2007 7:58 am
Location: Australia

Re: Image Rotation

Post by bidgeeman » Fri Aug 25, 2017 3:16 am

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. :oops:

Bidge

bogs
Posts: 3832
Joined: Sat Feb 25, 2017 10:45 pm

Re: Image Rotation

Post by bogs » Fri Aug 25, 2017 9:16 am

@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 :lol:

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.
Image

bidgeeman
Posts: 495
Joined: Wed Feb 21, 2007 7:58 am
Location: Australia

Re: Image Rotation

Post by bidgeeman » Wed Sep 06, 2017 7:56 am

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

Post Reply

Return to “Getting Started with LiveCode - Complete Beginners”