PHP Alpha transparency

[k0ewl]

Geachte iedereen die dit leest,

ik ben al enkele uren bezig met het zoeken naar een oplossing voor mijn probleem.

Wat ik graag zou willen:
Voor een site van een kameraad had ik het idee om zelf een soort van fotolijst te maken waarmee je 3 afbeeldingen opent met PHP en resized en roteert en daarna op een zwarte achtergrond plaats. Daarover heen weer een .png met alpha transparecy die het frame is voor de foto's.

Voorbeeld hoe het zou moeten: http://k0ewl.dnsalias.com/axel

Het script wat ik nu gebruik om de frame.png op een willekeurig gekleurde achtergrond te plakken:

PHP:

<?
// Content type
header('Content-type: image/jpeg');

$images    = array();
$image_dir = "./images/upload/";
$per_page  = 3;

if ($handle = @opendir($image_dir))
  {
    while ( ($file = readdir ($handle)) !== false)
      {
        if (is_file ($image_dir.$file))
          {
            if (exif_imagetype ($image_dir.$file) == IMAGETYPE_JPEG)
              array_push ($images, $file);
          }
      }
    
    closedir($handle);
    sort($images);
    
    if (sizeof ($images) >= $per_page)
      {
        $final_image = imagecreatetruecolor (800, 590);

        $page = ceil (htmlspecialchars ($_GET['page']));

        if ($page < 1 || $page > floor (sizeof ($images) / $per_page) - 1)
          $page = 1;

        $degrees  = array (15, 330, 5);
        $position = array (array (41, 36), array(363, 50), array(198, 279));

        for ($i = 0; $i < $per_page; $i++)
          {
            $image_src  = $image_dir.$images[($page * $per_page) - $per_page + $i];
            $image_dst  = './images/temp/'.$i.'.png';

            resize_image ($image_src, $image_dst, 320, 240);

            $rotated = imagecreatefrompng ($image_dst);
            $rotated = imagerotate ($rotated, $degrees[$i], 0);
            $black   = imagecolorallocate($rotated, 0x00, 0x00, 0x00);

            imagecolortransparent ($rotated, $black);

            $size[0] = imagesx ($rotated);
            $size[1] = imagesy ($rotated);

            imagecopymerge ($final_image, $rotated, $position[$i][0], $position[$i][1], 0, 0, $size[0], $size[1], 100);
            
            imagedestroy ($rotated);
          }
          
        $frame = './images/frame.png';
        $frame = imagecreatefrompng ($frame);

        imagecopymerge ($final_image, $frame, 0, 0, 0, 0, 800, 590, 100);

        imagejpeg ($final_image);
        imagedestroy ($final_image);
      }
  }

function resize_image($image_src, $image_dst, $width, $height) {
    $org_size   = getimagesize($image_src);
    $org_width  = $org_size[0];
    $org_height = $org_size[1];

    $extension = strtolower (substr ($image_src, -3));
    
    if ($extension == "jpg")
      {
        if (exif_imagetype ($image_src) == IMAGETYPE_JPEG)
          {     
            $org_id = imagecreatefromjpeg ($image_src);

            if ($org_width < $org_height)
              {
                imagerotate ($image_src, 90, 0);
                $org_size   = getimagesize($image_src);
                $org_width  = $org_size[0];
                $org_height = $org_size[1];
              }

            $tgt_width  = $width;
            $procent    = $width / $org_width;
            $tgt_height = $org_height * $procent;

            $tgt_id      = imagecreatetruecolor ($tgt_width, $tgt_height);
            $tgt_picture = imagecopyresampled ($tgt_id, $org_id, 0, 0, 0, 0, $tgt_width, $tgt_height, $org_width, $org_height);

            imagepng($tgt_id, $image_dst, 75);
          }
      }
    
    imagedestroy ($org_id);
}
?>

Output van het roteren:
http://www.b2ontwerp.nl/axel/

Output van het script:
http://www.b2ontwerp.nl/axel/blend.php

Het probleem:
De afbeelding wil gewoon niet mergen met de goede alpha transparency.

Wie weet wat er fout gaat, alsjeblieft, meld het even.

[ Voor 56% gewijzigd door k0ewl op 06-01-2007 18:48 ]

[NMe]

Je hebt voor 100% transparantie toch geen alpha channel nodig? Waarom werk je niet met transparante gifjes?

[k0ewl]

Ik heb inderdaad geen 100% transparantie nodig, maar als ik met 1 kleur doe, krijg je van die lelijke randen erlangs. Ik wilde nu het frame heel iets over de foto laten vallen, zodat je mooie lijnen om de foto's krijgt.

Daarnaast zit er ook nog tape over de foto's heen op de hoeken, en dat moet natuurlijk ook mooi blijven.

[dawuss]

Volgens mij zijn de plakbandjes niet 100% transparant en daarnaast ziet het er anti-aliased natuurlijk een stuk lekkerder 'crispy' uit dan op de Gif manier

[frickY]

Volgens mij ondersteunt GD helemaal geen alpha-blending?
Ik gebruik altijd ImageMagick voor dergelijke fotobeerkingstruukjes. Buiten dat het flexibeler is, is he took nog eens vele malen geheugenvriendelijker. Alleen de aansturing is iets omslachtiger.

[frederikske]

Ik wou net het zelfde voorstellen: Als je de ImageMagic module kan installeren, kan je een hele boel krachtige image bewerkingen.

Voorbeeldjes:

[markg85]

misschien heb je ook nog iets aan anti-aliasing?
http://nl2.php.net/manual/en/function.imageantialias.php

[PrisonerOfPain]

frickY schreef op zaterdag 06 januari 2007 @ 19:28:
Volgens mij ondersteunt GD helemaal geen alpha-blending?

Doet het wel, zie imagealphablending voor meer details.

markg85 schreef op zaterdag 06 januari 2007 @ 20:12:
misschien heb je ook nog iets aan anti-aliasing?
http://nl2.php.net/manual/en/function.imageantialias.php

Alpha blending zorgt voor transparantie in verschillende gradaties. Anti-aliassing zorgt er voor dat je contouren/ lijnen er niet kartelig uit zien.

Overigens is het niet heel lastig om alpha bleding zelf te programmeren. Met een alpha map (zwart wit afbeelding welke de mate van transparantie aangeeft) en de volgende 'formule' is het goed te doen:

code:

' Toepassen voor R, G en B (alle waarden tussen 0...0xFF)
new value = background * (0xFF - alpha) + old value * alpha

[ Voor 21% gewijzigd door PrisonerOfPain op 06-01-2007 21:05 ]

[k0ewl]

Mhhh, ik krijg de vage indruk dat de PNG afbeelding gewoon niet goed is.
Lijkt erop dat wat ik exporteer juist de alpha channel is en niet de png afbeelding zelf.

Ik heb de orginele .psp file nog wel, zou iemand die voor mij willen exporteren naar een 24 bits png? Of zou iemand mij willen vertellen of de png überhaupt goed is?

PNG:
http://k0ewl.dnsalias.com/axel/images/frame.png

PSP:
http://k0ewl.dnsalias.com/axel/images/preview.psp

[dawuss]

Volgens mij is die png inderdaad niet transparant. Ik heb hier helaas geen software bij de hand om paint shop pro bestanden te openen.

[k0ewl]

Ik heb hem even geconverteerd naar psd.

http://k0ewl.dnsalias.com/axel/images/preview.psd

Wel apart btw, doe toch echt: file->export->PNG optimizer en dan alpha transparency. Vorige keren heeft het met Paint Shop Pro 9 toch echt gewerkt...

[k0ewl]

Nou het lag dus inderdaad aan het PNG bestand. Als ik hem gewoon opslaan als->png deed, dan werkt het wel.

http://www.b2ontwerp.nl/axel