0

So I'm making an image with black background. My quest is to add white border around the image inside with 2px padding between border and the image.

  1. Uploading image
  2. Then I'm creating white border around it.
  3. Then I'm creating black background (image) with bigger width and height of the uploaded image.
  4. At the end I add the original image with border to the center of created black image.

So I'm stucked at the second point, where the white border is being created. My all code looks like this:

public function output()
{
    $this->__set_image_size();

    # setting temp image location
    $this->settings['__temp_image'] = $this->settings['__upload_dir']['temp'] . $this->temp_image_name . '.jpg';

    # generating image
    $this->__generate_background();
    $this->__load_image();
    $this->__draw_white_border();
    $this->__insert_image_to_wrapper();

    # destroy temp image data
    //imagedestroy($this->settings['__temp_image']);

    return $this->settings;
}

and the function __draw_white_border:

private function __draw_white_border()
{
    # draw white border
    $color_white = ImageColorAllocate($this->image_inside, 255, 255, 255);
    $this->__draw_border($this->image_inside, $color_white, 4);
}

private function __draw_border(&$img, &$color, $thickness)
{
    $x = ImageSX($img);
    $y = ImageSY($img);
    for ( $i = 0; $i < $thickness; $i ++ )
        ImageRectangle($img, $i, $i, $x --, $y --, $color);
}

the main question is: how to add padding between border and the image at the second point of the list or how to make gradiant border with 2px black color and 4px white color?

Arnas Pečelis
  • 1,000
  • 2
  • 12
  • 32

1 Answers1

1

Here's a very quick example that you should be able to adapt to your needs:

<?php

// get source image and dimensions.
$src = imagecreatefromstring(file_get_contents('path/to/image'));
$src_w = imagesx($src);
$src_h = imagesy($src);

// create destination image with dimensions increased from $src for borders.
$dest_w = $src_w + 12;
$dest_h = $src_h + 12;
$dest = imagecreatetruecolor($dest_w, $dest_h);

// draw white border (no need for black since new images default to that).
imagerectangle($dest, 1, 1, $dest_w - 2, $dest_h - 2, 0x00ffffff);
imagerectangle($dest, 0, 0, $dest_w - 1, $dest_h - 1, 0x00ffffff);

// copy source image into destination image.
imagecopy($dest, $src, 6, 6, 0, 0, $src_w, $src_h);

// output.
header('Content-type: image/png');
imagepng($dest);
imagedestroy($src);
imagedestroy($dest);
exit;

Input:

enter image description here

Result (note the white border isn't obvious due to the white page background):

enter image description here

In case you want to have the white border as the inner border just change the coordinates where you draw:

imagerectangle($dest, 5, 5, $dest_w - 6, $dest_h - 6, 0x00ffffff);
imagerectangle($dest, 4, 4, $dest_w - 5, $dest_h - 5, 0x00ffffff);

Result:

enter image description here

timclutton
  • 12,682
  • 3
  • 33
  • 43
  • but I want to ask you - you create the image from source. But how to start if I have loaded it before to `$this->image_inside`? my code to load: [code example](http://paste.ofcode.org/rJ86zYeVj25kjEwLhSWjwV) and I want to start from this image. And end with saving result to `$this->image_inside` – Arnas Pečelis Aug 27 '15 at 10:34
  • `$this->image_inside` is a GD resource so you could simply replace `$src` with `$this->image_inside` in my example. To save the result to `$this->image_inside` just point it to the same final image resource: `$this->image_inside = $dest;`. – timclutton Aug 27 '15 at 10:45
  • thanks again :) I see you are good with GD and I have one more easy job which is too hard for me. Maybe you wanna take it or help me to do it? Just invite me to chat or something else and I will show it. I was looking for dev for this job a long time ago, but no one have enough exp to deal with it – Arnas Pečelis Aug 27 '15 at 10:53
  • If you have a specific issue that you would like help with please post it as another question. Chances are I'll see it (and might even be able to help) but otherwise another node of the SO hive mind will likely assist soon enough. – timclutton Aug 27 '15 at 11:28
  • yes, I have specific issue [and this is the question](http://stackoverflow.com/questions/32250008/write-text-on-the-image-in-proportion) – Arnas Pečelis Aug 27 '15 at 12:56