Info Zone

One of the project I baby sit lately is The Kamusi Project; an online swahili dictionary. One feature we needed on the website was a slide show [ which we use to have before when the project was hosted at yale ] so we can play a slide show of the images submitted by users. I had to quickly hack something up. The initial implementation went quiet good and we were quiet happy with it considering all the fancy fade in and fade out of the images and as well being able to link an image to it actual word.

One problem that hit us was pixelated images because I was forcing all the images to a particular fixed size[ i can be dumb sometimes ] which quiet didn’t fit well with the size I gave. To fix the problem, I needed to figure out a way to resize the image proportionally. At this juncture, I’m going to share how to resize an image and maintian it proportionality.

To achieve that, you need to know the aspect ratio  of the image, muliply it by the width you want to resize the image to and that gives you the height you need to resize the image to. The algorithm below explains everything.

1. Get the original width and height of the image.
2. Set new width if original width is not going to be used.
3. Divide orignal height by the new width or the original width [ if new width wasn't set ] to get the aspect ratio.
4. Multiply  aspect ratio by the  new width or original width [ if new width wasn't set ] to get the new height needed to resize the image to.
5. Now set the image size to the new width or original width [ if new width wasn't set ] and the new height.

Simple huh!. Yes few research got me this.