Bilder zusammenfügen und Transparenz erwingen

Gilles · 11. März 2010 um 11:21

Hallooo,
Da ich nun schon seit 'ner Stunde mit den Image-Funktionen am rumprobieren und imme rnoch nicht mein Ergebnis erreicht habe wollte ich mal fragen, ob wer weiß wie ich folgendes Umsetzen kann:

Ich hab 2 Bilder ohne Transparenz (PNGS). Nun will ich mir ein Hintergrundbild erstellen das sagen wir mal 50 x 100 groß ist. Das HB soll nun Transparent sein.

Dann lade ich Bild 1 (Bild von einem Kopf). Drumherum ist eine Farbe (lila), die ich als Transparenzfarbe einrichten will. Nun will ich den Kopf in das Hintergrundbild einfügen (etwas nach unten verschoben)

Ich lade Bild 2 (Bild von Haaren). Auch dieses hat die selbe Transparenzfarbe wie Bild1.

Nun werden die Haare eingefügt, als ob sie auf dem kopf sitzen.

Nun mein Problem:

Ich kriege die „Körperteile“ zwar nun reinkpoiert in das Bild, aber der Hintergrund des backgrounds ist schwarz anstatt transparent. oder Falls ich für den Background die Transparenz auf schwarz stelle, nimmt er mir alle schwarzen farben aus dem Kopf und den haaren

Hier mal der kleine Code. Vielelicht kennt jemand eine Lösung
[php]

<?php header('Content-Type: image/png'); $bg = imagecreatetruecolor(30, 60); $kopf = imagecreatefrompng("images/kopf.png"); $haare = imagecreatefrompng("images/haare.png"); // Transparenzfarbe $trans = imagecolorallocate($bg, 90,60,90); $black = imagecolorallocate($bg, 0,0,0); // Transparenzfarbe setzen imagecolortransparent($bg,$black); imagecolortransparent($haare,$trans); imagecolortransparent($kopf,$trans); imagecopymerge($bg, $kopf, 0, 5, 0, 0, 30, 30, 100); imagecopymerge($bg, $haare, 0, 0, 0, 0, 30, 30, 100); imagepng($bg); ?>

[/php]

mermshaus · 11. März 2010 um 14:16

Kann es sein, dass du in der Bildbearbeitung die 906090 in Hex gesetzt hast, nicht in RGB?

[php]<?php

$bgData = base64_decode(’
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');

$kopfData = base64_decode(’
iVBORw0KGgoAAAANSUhEUgAAAB4AAAA8CAIAAAD+Np3IAAAAAXNSR0IArs4c6QAAAAlwSFlzAAAL
EwAACxMBAJqcGAAAAAd0SU1FB9oDCw0uFYHSFqwAAAAZdEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRo
IEdJTVBXgQ4XAAABdUlEQVRYw+2X3a3DIAyFweI1mzBUR2CUjJCh2CQDcB8sWRbBxnCJVFWgPvTH
/eweH1Pw5+d07yxwr62N3uiN3uj/rNCNSFei50PbpJeiOfHO2Tl3xFjF6JmCjuPr+Q4mkxIA5945
08PykzGMF9SoGrkTveJaVeWDknYowZ1zxQFJx7kEnL7e10QH3uslhVPtMDoIXz/oXKXRPqcrgcIt
pZRSlADM/ewT1hG69Uojjlm995Nae++lrYOgklZBmsZSSpNLn847ROHqOnQcovvhzvmIEenNyCPG
83MGo5mOGDnF4kWY4A5Moz7oo1wyLkheXrmHKKVJUyctlKGvNf1FWWTh6U0OGdKaOgf0+kWtf/Gv
YEL6sMobMydVXr6eA3elBhpNYjlFWrh1G5G+yoXQNPxogmfJba0paGK4rW2U1K+I0p4cLEWN3gdM
09j8MirbPSnuK+kYevr61EFL3OeNaKUgFnpQ7jldKdKVFAvOnPmq3Vyi/wFxR+fefPemKgAAAABJ
RU5ErkJggg==
');

$haareData = base64_decode(’
iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAIAAAC0Ujn1AAAAAXNSR0IArs4c6QAAAAlwSFlzAAAL
EwAACxMBAJqcGAAAAAd0SU1FB9oDCw0rCeikvqYAAAAZdEVYdENvbW1lbnQAQ3JlYXRlZCB3aXRo
IEdJTVBXgQ4XAAAAkUlEQVRIx+2VQQ4AEQxFaXoaLuUUDmHlcpxnFpNMpEMZdFa6lOb9F6nS0UUl
U6DE6qAPmi8c7LPGk5OUwx40E9bKQMbrU8Y7ABa5jJkmO2Qxo3SHjVxCkJ9ra3xXuTttRFxHF6vQ
ERBvg3NqZXMrAOegVRuSAYvcn9YT8ds8fCmHJwAkbuMGSj2ZlMP5wA6arwvuATb5GiCExAAAAABJ
RU5ErkJggg==
');

header(‚Content-Type: image/png‘);

// imagecreatefrompng tut es auch, aber ich wollte die Bilder mitliefern
$bg = imagecreatefromstring($bgData);
$kopf = imagecreatefromstring($kopfData);
$haare = imagecreatefromstring($haareData);

// Transparenzfarbe (= #906090)
$trans = imagecolorallocate($kopf, 144, 96, 144);

// Transparenzfarbe setzen
imagecolortransparent($kopf, $trans);
imagecolortransparent($haare, $trans);

imagecopymerge($bg, $kopf, 0, 0, 0, 0, 30, 60, 100);
imagecopymerge($bg, $haare, 0, 0, 0, 0, 30, 30, 100);

imagepng($bg);[/php]

Gilles · 12. März 2010 um 07:14

lach Geiles Bild
Muss ich denn den Hintergrund zwingend mit einem background belegen, sodass ich diese farbe dann als Transparenz setze?
Denn mein vorhaben ist den bunten Background den du da hast komplett transparent zu machen. Der Hintergrund ist eigentlich nur meine Arbeitsfläche, wo alle Körperteile zusammen kommen sollen.

Man stelle sich ein Blatt Papier vor. Dort klebe ich alle körperteile zusammen und schneide dann das männchen aus
Sowas will ich erreichen ^^ Die 906090 ist in dezimal vergeben. Ich kann es ja transparent machen, jedoch, kann ich den Hintergrund nicht einfärben und diesen dann unsichtbar machen.

Nebenbei. Wie hast die Dateien base64 encodiert bekommen? Bild erstellen und dann sowas?
[php]

<?php echo base64_encode(imagepng($image)); ?>

[/php]

Vielen dank für die Hilfe

mermshaus · 12. März 2010 um 13:42

Ach so, ja. Dann färbe doch einfach den Hintergrund in der Transparenzfarbe ein und setze die dann als transparent. Alternativ könnte es vielleicht funktionieren, für $bg ein im Grafikeditor erzeugtes transparentes PNG zu laden.

[php]header(‚Content-Type: image/png‘);

// imagecreatefrompng tut es auch, aber ich wollte die Bilder mitliefern
#$bg = imagecreatefromstring($bgData);
$bg = imagecreatetruecolor(30, 60);
$kopf = imagecreatefromstring($kopfData);
$haare = imagecreatefromstring($haareData);

// Transparenzfarbe (= #906090)
$trans = imagecolorallocate($kopf, 144, 96, 144);

imagefill($bg, 0, 0, $trans);

// Transparenzfarbe setzen
imagecolortransparent($bg, $trans);
imagecolortransparent($kopf, $trans);
imagecolortransparent($haare, $trans);

imagecopymerge($bg, $kopf, 0, 0, 0, 0, 30, 60, 100);
imagecopymerge($bg, $haare, 0, 0, 0, 0, 30, 30, 100);

imagepng($bg);[/php]

Base64-Encoding:

[php]echo chunk_split(base64_encode(file_get_contents(‚bild.png‘)));[/php]

Gilles · 16. März 2010 um 10:37

Vielen vielen Dank
Manchmal kommt man selbst nicht auf die einfachsten Sachen. Und vielen Dank für die info mit dem base_64
Fühl dich gut bewertet Kann dich leider noch nicht bewerten.