Question

what will you do if you want to change the window height and width propotionately

Answer 1

How to proportionally resize an image
When the width of height of an image object is changed, the image is scaled to fill the new size of the object. If the changes to the width and height of an image are not in proportion this can lead to the image looking stretched and distorted. In this lesson I will show how images can be resized proportionately so that they retain their original appearence, though smaller or larger.

Image resizing with the pointer tool

Image resizing with the pointer tool
The pointer tool can be used to resize images proportionally. When the pointer tool is in use and an object has been selected, resize handles (the small grey squares which indicate that an object is selected) appear at the corners and edges of the object. By clicking and dragging on these handles, the object is resized by moving the edge or corner clicked on to adjust the width and/or height of the selected object.

If the Shift key is held down whilst moving the handle, then the proportions of the object will be preserved. For example, if I hold Shift and drag the bottom edge upwards to reduce the size by half, then the right edge will automatically move to the left to reduce the width of the object by the same amount.

Resizing an image by script

An image will have been resized proportionately if the aspect ratio (the ratio between the width and height of the image) is preserved, that is if:

oldwidth / oldheight = newwidth / newheight

This can also be rewritten as:

oldwidth / newwidth = oldheight / newheight

So in order to preserve the aspect ratio when scaling an image, the width and height must both be scaled by the same factor. When the height is doubled, so to must be the width.

Resize by scale factor

The following script command takes the long id of an image, and a scale factor, and applies it to the original width and height of the image:

command scaleImage pImageID, pScale

local tWidth, tHeight

put the formattedWidth of pImageID into tWidth

put the formattedHeight of pImageID into tHeight



put tWidth * pScale into tWidth

put tHeight * pScale into tHeight



lock screen

set the width of pImageID to tWidth

set the height of pImageID to tHeight

unlock screen

end scaleImage



Resize to set width or set height

You may wish to set a particular width or height on an image whilst maintaining the original proportions. In such a case you can calculate the appropriate height or width by determining the ratio between the original and the desired width/height and applying that to both.

The following script command demonstrates this for a given width:

command setWidthProportional pImageID, pWidth

local tRatio, tHeight

put (the formattedWidth of pImageID) / pWidth into tRatio

put (the formattedHeight of pImageID) / tRatio into tHeight



lock screen

set the width of pImageID to pWidth

set the height of pImageID to tHeight

unlock screen

end setWidthProportional

Note that this command can be easily modified to accept a specified height, and calculate the appropriate width:

command setHeightProportional pImageID, pHeight

local tRatio, tWidth

put (the formattedHeight of pImageID) / pHeight into tRatio

put (the formattedWidth of pImageID) / tRatio into tWidth

lock screen

set the width of pImageID to tWidth

set the height of pImageID to pHeight

unlock screen

end setHeightProportional



Resize proportionately to fit within a given width and height

You may be creating an application where you wish to display an image within a limited area smaller than the image size. In order to fit an image fully within a given area whilst still maintaining the original aspect ratio, unless the ratio of the image is the same as the new area, the image must either:

a) stretch across the full width of the area, but with a shorter height, or

b) stretch across the full height, but with a shorter width.

To determine which, we must calculate the proportional height given the new width, and also the proportional width given the new height. If the calculated side of one of these new areas is greater than allowed then we use the other new area.

The following script command takes as parameters the long id of an image, a miximum width, and a maximum height and resizes the image proportionally to fit within:

command setAreaProportional pImageID, pWidth, pHeight

local tProportionalWidth, tProportionalHeight, tRatio

put (the formattedWidth of pImageID) / pWidth into tRatio

put (the formattedHeight of pImageID) / tRatio into tProportionalHeight

put (the formattedHeight of pImageID) / pHeight into tRatio

put (the formattedWidth of pImageID) / tRatio into tProportionalWidth

if tProportionalHeight > pHeight then

lock screen

set the width of pImageID to tProportionalWidth

set the height of pImageID to pHeight

unlock screen

else

lock screen

set the width of pImageID to pWidth

set the height of pImageID to tProportionalHeight

unlock screen

end if

end setAreaProportional