Cross dissolve two images

PHP programming forum. Ask questions or help people concerning PHP code. Don't understand a function? Need help implementing a class? Don't understand a class? Here is where to ask. Remember to do your homework!

Moderator: General Moderators

Post Reply
Symen77
Forum Newbie
Posts: 7
Joined: Fri Jun 09, 2006 3:47 am

Cross dissolve two images

Post by Symen77 »

Hi There,

I want to stick two images together with some overlapping space. I want this overlapping space to cross dissolve from the first to the second image.

This is the code i wrote last night:

Code: Select all

/*
* Cross dissolve transition
**************************************************/
function transition_crossdissolve($image, $image2, $dissolvespace)
{
  $w1 = imagesx($image);
  $h1 = imagesy($image);
  
  $w2 = imagesx($image2);
  $h2 = imagesy($image2);

  if ($h1 < $h2)
  {
    $newheight = $h1;
  }
  else
  {
    $newheight = $h2;
  }
  
  $newwidth = ($w1 + $w2) - $dissolvespace;

  //Create new container image
  $newimage = @imagecreatetruecolor($newwidth, $newheight) or die("Cannot Initialize new GD image stream");
 
  $frompixel = $w1 - $dissolvespace;

  //Copy image2 onto the right side of the container image
  imageCopy($newimage, $image2, $frompixel, 0, 0, 0, $w2, $h2);
  
  //Copy part of image1 minus dissolvespace onto the left side of the container image  
  imageCopy($newimage, $image, 0, 0, 0, 0, $frompixel, $h1);
  
  //Set transparency and calculate max. steps to fade
  $transparency = 99;  
  $fadesteps = $transparency / $dissolvespace;

  //copy the missing dissolvespace from image1 onto the right coordinates and fade out per line
  for ($r=0; $r<$dissolvespace; $r++) 
  {
    imageCopyMerge($newimage, $image, ($frompixel + $r), 0, $frompixel, 0, $dissolvespace, $h1, ($transparency - ($fadesteps * $r)));
  }

  return $newimage;
}


$image = transition_crossdissolve($image, $image2, 40);

header("Content-type: image/jpeg");
imagejpeg($image, "", 100);
The last step, copy part of image 1 onto the newimage and fade it out while doing so, doesn't work.

Instead of a cross dissolve it just sort of blurs the part that get's copied on top of $newimage.

Can someone explain to me what i am doing wrong?

Regards,

Symen
Symen77
Forum Newbie
Posts: 7
Joined: Fri Jun 09, 2006 3:47 am

Post by Symen77 »

I changed the code in the post above a little. The end result is getting closer to what it should be.

What still goes wrong:

Instead of a cross dissolve it just sort of blurs the part that get's copied on top of $newimage.

Example photo:

Image

Regards,

Sander
User avatar
bokehman
Forum Regular
Posts: 509
Joined: Wed May 11, 2005 2:33 am
Location: Alicante (Spain)

Post by bokehman »

Image

Code: Select all

function x_fade($image1, $image2, $overlap = 175)
{
	$h = (($h1 = imagesy($image1)) < ($h2 = imagesy($image2))) ? $h1 : $h2;
	$w = (($w1 = imagesx($image1)) + ($w2 = imagesx($image2))) - $overlap;
 
	$image = @imagecreatetruecolor($w, $h) or die('Invalid dimmensions');
       
	imagecopy($image, $image2, ($x = ($w - $w2) - 1), 0, $x2 = 0, 0, $w2, $h2);
	imagecopy($image, $image1, 0, 0, 0, 0, $w1, $h1);
       
	$pct = 0;
	$step = 100 / ($overlap + 2);
	
	while($pct < (100 - ($step * 2)))
	{
		imagecopymerge($image, $image2, $x++, 0, $x2++, 0, 1, $h2 -1, round($pct += $step));
	}
	
	return $image;
}
Last edited by bokehman on Fri Jun 09, 2006 11:57 am, edited 4 times in total.
Symen77
Forum Newbie
Posts: 7
Joined: Fri Jun 09, 2006 3:47 am

Post by Symen77 »

Hi Bokehman,

Thanks for the solution, i just found out myself as well!! :)

YAY!!

Below my working code :D

Code: Select all

function transition_crossdissolve($image, $image2, $dissolvespace)
{
  $w1 = imagesx($image);
  $h1 = imagesy($image);
  
  $w2 = imagesx($image2);
  $h2 = imagesy($image2);

  if ($h1 < $h2)
  {
    $newheight = $h1;
  }
  else
  {
    $newheight = $h2;
  }
  
  $newwidth = ($w1 + $w2) - $dissolvespace;
  $newimage = @imagecreatetruecolor($newwidth, $newheight) or die("Cannot Initialize new GD image stream");
  $frompixel = $w1 - $dissolvespace;

  imageCopy($newimage, $image2, $frompixel, 0, 0, 0, $w2, $h2);
  imageCopy($newimage, $image, 0, 0, 0, 0, $frompixel, $h1);

  $transparency = 100;  
  $fadesteps = $transparency / $dissolvespace;

  for ($r=0; $r<$dissolvespace; $r++) 
  {
    imageCopyMerge($newimage, $image, ($frompixel + $r), 0, ($frompixel+$r), 0, 1, $h1, ($transparency - ($fadesteps * $r)));
  }
  
  return $newimage;
}
Last edited by Symen77 on Fri Jun 09, 2006 8:00 am, edited 1 time in total.
User avatar
bokehman
Forum Regular
Posts: 509
Joined: Wed May 11, 2005 2:33 am
Location: Alicante (Spain)

Post by bokehman »

You are not allocating a background! What's going to happen if the images are different heights?
Symen77
Forum Newbie
Posts: 7
Joined: Fri Jun 09, 2006 3:47 am

Post by Symen77 »

bokehman wrote:You are not allocating a background! What's going to happen if the images are different heights?
That will not happen, this is only a part of the script.

The images will be resized before being passed on to this function. :wink:

Regards,

Sander
User avatar
bokehman
Forum Regular
Posts: 509
Joined: Wed May 11, 2005 2:33 am
Location: Alicante (Spain)

Post by bokehman »

Symen77 wrote:The images will be resized before being passed on to this function. :wink:
if that is the case why did you bother including this:

Code: Select all

if ($h1 < $h2)
  {
    $newheight = $h1;
  }
  else
  {
    $newheight = $h2;
  }
Symen77
Forum Newbie
Posts: 7
Joined: Fri Jun 09, 2006 3:47 am

Post by Symen77 »

Very true, is not needed anymore after the testing phase.

(I tend to solve parts of the puzzle, then stick them together to get the big picture)

So cleaned up version:

Code: Select all

function transition_crossdissolve($image, $image2, $dissolvespace)
{
  $w1 = imagesx($image);
  $h1 = imagesy($image);
  
  $w2 = imagesx($image2);
  $h2 = imagesy($image2);

  $newwidth = ($w1 + $w2) - $dissolvespace;
  $newimage = @imagecreatetruecolor($newwidth, $h1) or die("Cannot Initialize new GD image stream");

  $frompixel = $w1 - $dissolvespace;

  imageCopy($newimage, $image2, $frompixel, 0, 0, 0, $w2, $h2);
  imageCopy($newimage, $image, 0, 0, 0, 0, $frompixel, $h1);

  $transparency = 100;  
  $fadesteps = $transparency / $dissolvespace;

  for ($r=0; $r<$dissolvespace; $r++) 
  {
    imageCopyMerge($newimage, $image, ($frompixel+$r), 0, ($frompixel+$r), 0, 1, $h1, ($transparency - ($fadesteps * $r)));
  }
  
  return $newimage;
}
User avatar
bokehman
Forum Regular
Posts: 509
Joined: Wed May 11, 2005 2:33 am
Location: Alicante (Spain)

Post by bokehman »

Just a couple of other minor things: You are wasting the first step because you have the PCT set to 100 for the first step. This means if you set to overlap value "1" no overlap would be shown in the image. The other thing is the PCT argument of imagecopymerge() should be an integer, not a float.
Post Reply