GAE images.resize with fixed proportional crop

Question

I need to resize and crop to exactly 60x80px from various size and aspect ratio. Just before i put into Datastore. Anyone already got this issue resolved.

Currently i already succed to just transform it to exact height (80px) with various width which nott look so good when i try to display it on a list. e.g jcaroussel.

My db.put code is like bellow:

    if users.get_current_user():
        personal.personal_id = int(self.request.get('personal_id'))
        personal.name = self.request.get('name')
        personal.latitude = self.request.get('latitude')
        personal.info = self.request.get('info')
        photo = images.resize(self.request.get('img'), 0, 80)
        personal.photo = db.Blob(photo)
        personal.lc_id = int(self.request.get('lc_id'))
        personal.put()
        self.redirect('/admin/personal')

    else:
      self.response.out.write('I\'m sorry, you don\'t have permission to add this LP Personal Data.')

I just want to do similar result when we upload our avatar on google talk/google chat.

Anyone solved this?

Thx

Answer 1

After your resize your image down to 80 pixels in height, you would have to use the crop function as defined here. For example:

img = images.Image(self.request.get('img'))
img.resize(0, 80)
resized_img = img.execute_transforms(output_encoding=images.JPEG)
left_x = (resized_img.width - 60) / 2
resized_img.crop(left_x, 0, left_x + 60, 80)
cropped_img = resized_image.execute_transforms(output_encoding=images.JPEG)

In my example it crops to the center of the image. It assumes that the resized image is at least 60 pixels wide, but obviously you would have to add some checks to confirm this, because a user might not upload an image in the right size.

Answer 2

I used something else:

• Resize the original image to your max height (80)
• Store the resized (but complete/not cropped) image
• Display it inside a <div> that has the following CSS: width: 60px; height: 80px; overflow: hidden;

That way it will show nicely in your list, but you can still display the complete resized picture on your user's profile page (looking at you code I imagine that's what you are trying to do, right?)