Keep Image Aspect Ratio

Visuals, audio, animation. Blended, not stirred. If LiveCode is part of your rich media production toolbox, this is the forum for you.

Moderators: FourthWorld, heatherlaine, Klaus, kevinmiller, robinmiller

Post Reply
andrewferguson
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 184
Joined: Wed Apr 10, 2013 5:09 pm

Keep Image Aspect Ratio

Post by andrewferguson » Sat May 03, 2014 11:52 am

Hello,
I have a stack that uses an image object. The user is able to select an image from a list, and the image is loaded up into the image control through the fileName property.
However, when the fileName is set the the image path, the size and width of the image control change, causing it to cover up objects on the card. To solve this I locked the image control's width and height. Now when loaded, images appear stretched, as they are being set the the specified width and height.

What I want is the image to maintain its aspect ratio, without changing the size of the image control. This would mean that there would be blank spaces on the edges of the image control.

Does anyone know how to do this?

Thanks,
Andrew

Dixie
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 1336
Joined: Sun Jul 12, 2009 10:53 am
Location: Bordeaux, France

Re: Keep Image Aspect Ratio

Post by Dixie » Sat May 03, 2014 12:10 pm

Hi...

Try this... I have attached a stack with an image
Import picure and then choose an image...
Use the '+' and '-' buttons to alter the size...
Is this something that might help ?
Attachments
imageZoom.zip
(99.34 KiB) Downloaded 274 times

[-hh]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 2262
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Keep Image Aspect Ratio

Post by [-hh] » Sat May 03, 2014 8:04 pm

..........
Last edited by [-hh] on Wed Aug 13, 2014 3:03 pm, edited 1 time in total.
shiftLock happens

Dixie
Livecode Opensource Backer
Livecode Opensource Backer
Posts: 1336
Joined: Sun Jul 12, 2009 10:53 am
Location: Bordeaux, France

Re: Keep Image Aspect Ratio

Post by Dixie » Sat May 03, 2014 8:19 pm

Hermann..

If you look closely at the stack I posted, you will see that I use the same method as you do... the image is grouped... As for a fast machine needed, I'm not too sure about that as I have to slow the repeat loop down..

[-hh]
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 2262
Joined: Thu Feb 28, 2013 11:52 pm
Location: Göttingen, DE

Re: Keep Image Aspect Ratio

Post by [-hh] » Sat May 03, 2014 9:20 pm

..........
Last edited by [-hh] on Wed Aug 13, 2014 3:03 pm, edited 1 time in total.
shiftLock happens

Simon
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
Posts: 3901
Joined: Sat Mar 24, 2007 2:54 am
Location: Palo Alto

Re: Keep Image Aspect Ratio

Post by Simon » Sat May 03, 2014 10:40 pm

Hi Andrew,
I think what you are asking for is to solve when a user selects a portrait photo or landscape.

If so here is the celebrated code that Klaus came up with

Code: Select all

on mouseUp
   answer file "Please select an image"
   lock screen
   set the lockLocation of img "addImage"  to false
   set cursor to busy
   set the filename of img "addImage" to it
   resizePicture
end mouseUp

on resizePicture
   put the formattedwidth of img "addImage" into w
   put the formattedheight of img "addImage" into h
   put 240 into tW
   put 179 into tH
   put mk_makeratio(tW,tH,w,h) into new_imagesize
   put item 1 of new_imagesize into newW
   put item 2 of new_imagesize into newH
   set the width of img "addImage" to newW
   set the height of img "addImage" to newH
   set the loc of img "addImage" to 188,93
   set the lockLocation of img "addImage"  to true
   unlock screen
   set cursor to arrow
end resizePicture

function mk_makeratio tW,tH,w,h
put min (tW/w,tH/h) into tscaleFactor
return round(w * tscaleFactor) & "," & round(h * tscaleFactor)
end mk_makeratio
set your tW and tH and loc.

Simon
I used to be a newbie but then I learned how to spell teh correctly and now I'm a noob!

Post Reply

Return to “Multimedia”