Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

General Questions

General questions about getting started with SilverStripe that don't fit in any of the categories above.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Aligning a Cropped Image


Go to End
Reply

9 Posts   2649 Views

Avatar
vincent_vega

31 March 2011 at 3:15pm Community Member, 14 Posts

This might have been covered already but i can't find it, so sorry in advance if it has.

Basically i want a cropped image to display from top left instead of the centre

heres the code i'm using, it works fine (top left) if the original image is no more than 467px high, any higher, it starts to centre it

<a href="$Link">$Photo.CroppedImage(305,200)</a>

Cheers

Avatar
vincent_vega

4 April 2011 at 2:11pm Community Member, 14 Posts

Any ideas out there?

Avatar
Carbon Crayon

4 April 2011 at 10:40pm Community Member, 598 Posts

Hi Vincent_Vega,

I had a quick look in the GD class and there is a function crop($top, $left, $width, $height) which looks like it might be what you are looking for.

have a look at this tutorial that shows you how to take full advantage of all the functions in the GD class by decorating Image with your own functions:

http://www.ssbits.com/tutorials/2010/rotating-and-greyscaling-images-using-gd-and-decorators/

Let me know how you get on :)

Aram

www.SSbits.com - Your one stop SilverStripe learning resource.

Avatar
vincent_vega

5 April 2011 at 5:39pm Community Member, 14 Posts

Cheers Aram for your response,

I'm actually creating a Portfolio based on your tutorial "DataObjects as Pages - Part 1", I knew there would be an easy solution out there, so i'll give it a crack :)

thanks again mate

Avatar
anotherasterix

27 April 2011 at 4:03am Community Member, 2 Posts

Great, just had the same problem. My portfolio images got cropped the wrong way... Trying to extend the BetterImage class now with a CropedFromTopImage.

What would we do without Aram and his tutorials and forum posts? Already helped me so much this weekend! Thanks.

Avatar
Carbon Crayon

27 April 2011 at 4:10am Community Member, 598 Posts

Hehe thanks anotherasterix, always glad to know I have been able to help :)

Aram

www.SSbits.com - Your one stop SilverStripe learning resource.

Avatar
anotherasterix

27 April 2011 at 4:55am (Last edited: 27 April 2011 4:57am), Community Member, 2 Posts

if it's of use for anybody, I extended the BetterImage class [url=http://www.ssbits.com/tutorials/2011/improving-image-quality-by-preventing-correctly-sized-images-being-resized/]SSBits Image Tutorial[/url] with a CroppedFromTopImage function. Thought I'd share it.

So far it centers the cropped image, if you want it to crop from top left adjust the function generateCroppedFromTopImage() (from line 65) according to the comment.

Just a quick hack, I guess it could be done more nicely. Always open to suggestions.

Jonas

Edit: Server fails, when I try to attach the file, so here are the two functions I changed/added:

public function getFormattedImage($format, $arg1 = null, $arg2 = null) {
if($this->ID && $this->Filename && Director::fileExists($this->Filename)) {
$size = getimagesize(Director::baseFolder() . '/' . $this->getField('Filename'));
$preserveOriginal = false;
switch(strtolower($format)){
case 'croppedimage':
$preserveOriginal = ($arg1 == $size[0] && $arg2 == $size[1]);
break;
case 'croppedfromtopimage':
$preserveOriginal = ($arg1 == $size[0] && $arg2 == $size[1]);
break;
}

if($preserveOriginal){
return $this;
} else {
return parent::getFormattedImage($format, $arg1, $arg2);
}
}
}

/**
    * Generate a resized copy of this image with the given width & height. Cropped from top-center
    * Use in templates with $CroppedFromTopImage.
    */
   function generateCroppedFromTopImage($gd, $width, $height) {
      if(is_numeric($gd) || !$gd){
         USER_ERROR("Image::generateFormattedImage - generateCroppedFromTopImage is being called by legacy code or gd is not set.",E_USER_WARNING);
      }else{
         
         if($gd->getWidth / $gd->getHeight >= $width/$height){
            $gd = $gd->resizeByHeight($height);
            $left = ($gd->getWidth - $width)/2; //center cropped image.
            // if you want to cut from top left or right make $left = 0 or $gd->getWidth - $width respectively
         }else{
            $gd = $gd->resizeByWidth($width);   
            $left = 0;
         }
         return $gd->crop(0, $left, $width, $height);
      }
   }

Avatar
Schaper Software

27 January 2012 at 2:38am Community Member, 3 Posts

Just implemented anotherasterix's solution.
There are some little PHP bugs inside the function generateCroppedFromTopImage:

Instead of

$gd->getWidth and $gd->getHeight

it has to be

$gd->getWidth() and $gd->getHeight()

Now everything works fine, Thank you very much;)

Hendrik

Go to Top