Aktueller Standort: Startseite> Neueste Artikel> Wie erzeugt ich komplexe Bildeffekte, indem Sie die ImageWBMP -Funktion mit der ImageCopy -Funktion kombinieren? Praktische Fallfreigabe

Wie erzeugt ich komplexe Bildeffekte, indem Sie die ImageWBMP -Funktion mit der ImageCopy -Funktion kombinieren? Praktische Fallfreigabe

gitbox 2025-09-20

In PHP war die Bildverarbeitung schon immer eine der sehr wichtigen Funktionen, insbesondere bei der Entwicklung von Website, dynamischer Bildgenerierung oder Bildbearbeitung. PHP liefert eine Vielzahl von Bildverarbeitungsfunktionen, und ImageWBMP und ImageCopy sind zwei der sehr praktischen Funktionen, die häufig zum Erstellen oder Bearbeiten von Bildern verwendet werden.

1. Einführung in die ImageWBMP -Funktion

ImageWBMP ist eine Funktion in der PHP -GD -Bibliothek zum Ausgabe von Bildern in das WBMP -Format. WBMP (drahtloses Bitmap) ist ein Bildformat mit geringer Qualität, ein Tiefenformat mit niedrigem Farben, das normalerweise in mobilen Geräten oder altmodischen Browsern verwendet wird. Die Funktion der ImageWBMP -Funktion besteht darin, GD -Image -Ressourcen in das WBMP -Format und die Ausgabe umzuwandeln.

Grammatik:

 <span><span><span class="hljs-keyword">bool</span></span><span> </span><span><span class="hljs-title function_ invoke__">imagewbmp</span></span><span>(resource </span><span><span class="hljs-variable">$image</span></span><span>, </span><span><span class="hljs-keyword">string</span></span><span> </span><span><span class="hljs-variable">$filename</span></span><span> = </span><span><span class="hljs-literal">NULL</span></span><span>, </span><span><span class="hljs-keyword">int</span></span><span> </span><span><span class="hljs-variable">$threshold</span></span><span> = </span><span><span class="hljs-number">128</span></span><span>);
</span></span>
  • $ image : Die zu ausgegebene Bildressource.

  • $ Dateiname : Der Pfad zum Speichern des Bildes. Wenn nicht bereitgestellt, wird das Bild direkt an den Browser ausgegeben.

  • $ threshold : Optionaler Parameter, setzen Sie den Schwellenwert, um festzustellen, ob das Pixel schwarz ist. Der Standardwert beträgt 128, je kleiner der Wert ist, desto dunkler das Bild.

Beispiel der Nutzung:

 <span><span><span class="hljs-meta">&lt;?php</span></span><span>
</span><span><span class="hljs-comment">// Erstellen Sie ein leeres Bild</span></span><span>
</span><span><span class="hljs-variable">$image</span></span><span> = </span><span><span class="hljs-title function_ invoke__">imagecreatetruecolor</span></span><span>(</span><span><span class="hljs-number">100</span></span><span>, </span><span><span class="hljs-number">100</span></span><span>);

</span><span><span class="hljs-comment">// Hintergrundfarbe setzen</span></span><span>
</span><span><span class="hljs-variable">$bgColor</span></span><span> = </span><span><span class="hljs-title function_ invoke__">imagecolorallocate</span></span><span>(</span><span><span class="hljs-variable">$image</span></span><span>, </span><span><span class="hljs-number">255</span></span><span>, </span><span><span class="hljs-number">255</span></span><span>, </span><span><span class="hljs-number">255</span></span><span>);
</span><span><span class="hljs-title function_ invoke__">imagefill</span></span><span>(</span><span><span class="hljs-variable">$image</span></span><span>, </span><span><span class="hljs-number">0</span></span><span>, </span><span><span class="hljs-number">0</span></span><span>, </span><span><span class="hljs-variable">$bgColor</span></span><span>);

</span><span><span class="hljs-comment">// Stellen Sie die Vordergrundfarbe ein</span></span><span>
</span><span><span class="hljs-variable">$black</span></span><span> = </span><span><span class="hljs-title function_ invoke__">imagecolorallocate</span></span><span>(</span><span><span class="hljs-variable">$image</span></span><span>, </span><span><span class="hljs-number">0</span></span><span>, </span><span><span class="hljs-number">0</span></span><span>, </span><span><span class="hljs-number">0</span></span><span>);

</span><span><span class="hljs-comment">// Zeichnen Sie ein einfaches Rechteck</span></span><span>
</span><span><span class="hljs-title function_ invoke__">imagerectangle</span></span><span>(</span><span><span class="hljs-variable">$image</span></span><span>, </span><span><span class="hljs-number">10</span></span><span>, </span><span><span class="hljs-number">10</span></span><span>, </span><span><span class="hljs-number">90</span></span><span>, </span><span><span class="hljs-number">90</span></span><span>, </span><span><span class="hljs-variable">$black</span></span><span>);

</span><span><span class="hljs-comment">// Die Ausgabe ist WBMP Format</span></span><span>
</span><span><span class="hljs-title function_ invoke__">imagewbmp</span></span><span>(</span><span><span class="hljs-variable">$image</span></span><span>);

</span><span><span class="hljs-comment">// Freier Speicher</span></span><span>
</span><span><span class="hljs-title function_ invoke__">imagedestroy</span></span><span>(</span><span><span class="hljs-variable">$image</span></span><span>);
</span><span><span class="hljs-meta">?&gt;</span></span><span>
</span></span>

2. Einführung in die ImageCopy -Funktion

Die ImageCopy -Funktion wird verwendet, um Teile eines Bildes in ein anderes zu kopieren. Dies ist sehr nützlich, um Inhalte auf einem Bild zu überlagern oder Bereiche aus einem Bild zu extrahieren und es in ein anderes zu verschmelzen.

Grammatik:

 <span><span><span class="hljs-keyword">bool</span></span><span> </span><span><span class="hljs-title function_ invoke__">imagecopy</span></span><span>(resource </span><span><span class="hljs-variable">$destination</span></span><span>, resource </span><span><span class="hljs-variable">$source</span></span><span>, </span><span><span class="hljs-keyword">int</span></span><span> </span><span><span class="hljs-variable">$dst_x</span></span><span>, </span><span><span class="hljs-keyword">int</span></span><span> </span><span><span class="hljs-variable">$dst_y</span></span><span>, </span><span><span class="hljs-keyword">int</span></span><span> </span><span><span class="hljs-variable">$src_x</span></span><span>, </span><span><span class="hljs-keyword">int</span></span><span> </span><span><span class="hljs-variable">$src_y</span></span><span>, </span><span><span class="hljs-keyword">int</span></span><span> </span><span><span class="hljs-variable">$src_w</span></span><span>, </span><span><span class="hljs-keyword">int</span></span><span> </span><span><span class="hljs-variable">$src_h</span></span><span>);
</span></span>
  • $ Ziel : Zielbildressource.

  • $ Quelle : Quellbildressource.

  • $ dst_x , $ dst_y : Die Startposition des Zielbildes.

  • $ src_x , $ src_y : Die Startposition des Quellbildes.

  • $ src_w , $ src_h : Die Breite und Höhe des Quellbildes.

Beispiel der Nutzung:

 <span><span><span class="hljs-meta">&lt;?php</span></span><span>
</span><span><span class="hljs-comment">// Erstellen Sie ein Quellbild</span></span><span>
</span><span><span class="hljs-variable">$source</span></span><span> = </span><span><span class="hljs-title function_ invoke__">imagecreatetruecolor</span></span><span>(</span><span><span class="hljs-number">100</span></span><span>, </span><span><span class="hljs-number">100</span></span><span>);
</span><span><span class="hljs-variable">$white</span></span><span> = </span><span><span class="hljs-title function_ invoke__">imagecolorallocate</span></span><span>(</span><span><span class="hljs-variable">$source</span></span><span>, </span><span><span class="hljs-number">255</span></span><span>, </span><span><span class="hljs-number">255</span></span><span>, </span><span><span class="hljs-number">255</span></span><span>);
</span><span><span class="hljs-title function_ invoke__">imagefill</span></span><span>(</span><span><span class="hljs-variable">$source</span></span><span>, </span><span><span class="hljs-number">0</span></span><span>, </span><span><span class="hljs-number">0</span></span><span>, </span><span><span class="hljs-variable">$white</span></span><span>);

</span><span><span class="hljs-comment">// Zeichnen Sie etwas auf das Quellbild</span></span><span>
</span><span><span class="hljs-variable">$black</span></span><span> = </span><span><span class="hljs-title function_ invoke__">imagecolorallocate</span></span><span>(</span><span><span class="hljs-variable">$source</span></span><span>, </span><span><span class="hljs-number">0</span></span><span>, </span><span><span class="hljs-number">0</span></span><span>, </span><span><span class="hljs-number">0</span></span><span>);
</span><span><span class="hljs-title function_ invoke__">imageline</span></span><span>(</span><span><span class="hljs-variable">$source</span></span><span>, </span><span><span class="hljs-number">10</span></span><span>, </span><span><span class="hljs-number">10</span></span><span>, </span><span><span class="hljs-number">90</span></span><span>, </span><span><span class="hljs-number">90</span></span><span>, </span><span><span class="hljs-variable">$black</span></span><span>);

</span><span><span class="hljs-comment">// Erstellen Sie ein Zielbild</span></span><span>
</span><span><span class="hljs-variable">$destination</span></span><span> = </span><span><span class="hljs-title function_ invoke__">imagecreatetruecolor</span></span><span>(</span><span><span class="hljs-number">200</span></span><span>, </span><span><span class="hljs-number">200</span></span><span>);
</span><span><span class="hljs-variable">$bgColor</span></span><span> = </span><span><span class="hljs-title function_ invoke__">imagecolorallocate</span></span><span>(</span><span><span class="hljs-variable">$destination</span></span><span>, </span><span><span class="hljs-number">255</span></span><span>, </span><span><span class="hljs-number">255</span></span><span>, </span><span><span class="hljs-number">255</span></span><span>);
</span><span><span class="hljs-title function_ invoke__">imagefill</span></span><span>(</span><span><span class="hljs-variable">$destination</span></span><span>, </span><span><span class="hljs-number">0</span></span><span>, </span><span><span class="hljs-number">0</span></span><span>, </span><span><span class="hljs-variable">$bgColor</span></span><span>);

</span><span><span class="hljs-title function_ invoke__">imagecopy</span></span><span>(</span><span><span class="hljs-variable">$destination</span></span><span>, </span><span><span class="hljs-variable">$source</span></span><span>, </span><span><span class="hljs-number">50</span></span><span>, </span><span><span class="hljs-number">50</span></span><span>, </span><span><span class="hljs-number">0</span></span><span>, </span><span><span class="hljs-number">0</span></span><span>, </span><span><span class="hljs-number">100</span></span><span>, </span><span><span class="hljs-number">100</span></span><span>);

</span><span><span class="hljs-comment">// Ausgabe Bild zum Browser</span></span><span>
</span><span><span class="hljs-title function_ invoke__">header</span></span><span>(</span><span><span class="hljs-string">'Content-Type: image/png'</span></span><span>);
</span><span><span class="hljs-title function_ invoke__">imagepng</span></span><span>(</span><span><span class="hljs-variable">$destination</span></span><span>);

</span><span><span class="hljs-comment">// Freier Speicher</span></span><span>
</span><span><span class="hljs-title function_ invoke__">imagedestroy</span></span><span>(</span><span><span class="hljs-variable">$source</span></span><span>);
</span><span><span class="hljs-title function_ invoke__">imagedestroy</span></span><span>(</span><span><span class="hljs-variable">$destination</span></span><span>);
</span><span><span class="hljs-meta">?&gt;</span></span><span>
</span></span>

3. Praktische Fälle von ImageWBMP in Kombination mit ImageCopy

In diesem Fall werden wir demonstrieren, wie Sie ImageWBMP- und ImageCopy -Funktionen kombinieren können, um einen komplexen Bildeffekt zu erzeugen: Übereinstimmung Teil eines Bildes auf einem anderen Bild und geben Sie es dem WBMP -Format aus. Angenommen, wir haben ein Hintergrundbild und möchten Teil eines Symbols oder eines anderen Bildes auf diesem Hintergrundbild überlagern und es dann im WBMP -Format mit geringer Qualität ausgeben, um das mobile Gerät anzupassen.

Fallschritte:

  1. Laden Sie das Hintergrundbild und das zu überlagerte Bild.

  2. Verwenden Sie ImageCopy , um einen Teil des Bildes zu kopieren, um auf das Hintergrundbild überlagert zu werden.

  3. Verwenden Sie ImageWBMP , um das endgültige Bild auszugeben.

Implementierungscode:

 <span><span><span class="hljs-meta">&lt;?php</span></span><span>
</span><span><span class="hljs-comment">// Hintergrundbild laden</span></span><span>
</span><span><span class="hljs-variable">$background</span></span><span> = </span><span><span class="hljs-title function_ invoke__">imagecreatefromjpeg</span></span><span>(</span><span><span class="hljs-string">'background.jpg'</span></span><span>);

</span><span><span class="hljs-comment">// Laden Sie das Bild, um überlagert zu werden</span></span><span>
</span><span><span class="hljs-variable">$overlay</span></span><span> = </span><span><span class="hljs-title function_ invoke__">imagecreatefrompng</span></span><span>(</span><span><span class="hljs-string">'overlay.png'</span></span><span>);

</span><span><span class="hljs-comment">// Holen Sie sich die Breite und Höhe des Bildes, um überlagert zu werden</span></span><span>
</span><span><span class="hljs-variable">$overlay_width</span></span><span> = </span><span><span class="hljs-title function_ invoke__">imagesx</span></span><span>(</span><span><span class="hljs-variable">$overlay</span></span><span>);
</span><span><span class="hljs-variable">$overlay_height</span></span><span> = </span><span><span class="hljs-title function_ invoke__">imagesy</span></span><span>(</span><span><span class="hljs-variable">$overlay</span></span><span>);

</span><span><span class="hljs-comment">// Wählen Sie einen Teil des Bildes aus, das überlagert werden soll</span></span><span>
</span><span><span class="hljs-variable">$src_x</span></span><span> = </span><span><span class="hljs-number">0</span></span><span>;
</span><span><span class="hljs-variable">$src_y</span></span><span> = </span><span><span class="hljs-number">0</span></span><span>;
</span><span><span class="hljs-variable">$src_w</span></span><span> = </span><span><span class="hljs-variable">$overlay_width</span></span><span>;
</span><span><span class="hljs-variable">$src_h</span></span><span> = </span><span><span class="hljs-variable">$overlay_height</span></span><span>;

</span><span><span class="hljs-comment">// Wählen Sie die Overlay -Position im Hintergrundbild aus</span></span><span>
</span><span><span class="hljs-variable">$dst_x</span></span><span> = </span><span><span class="hljs-number">50</span></span><span>;
</span><span><span class="hljs-variable">$dst_y</span></span><span> = </span><span><span class="hljs-number">50</span></span><span>;

</span><span><span class="hljs-title function_ invoke__">imagecopy</span></span><span>(</span><span><span class="hljs-variable">$background</span></span><span>, </span><span><span class="hljs-variable">$overlay</span></span><span>, </span><span><span class="hljs-variable">$dst_x</span></span><span>, </span><span><span class="hljs-variable">$dst_y</span></span><span>, </span><span><span class="hljs-variable">$src_x</span></span><span>, </span><span><span class="hljs-variable">$src_y</span></span><span>, </span><span><span class="hljs-variable">$src_w</span></span><span>, </span><span><span class="hljs-variable">$src_h</span></span><span>);

</span><span><span class="hljs-comment">// Die Ausgabe istWBMPFormat</span></span><span>
</span><span><span class="hljs-title function_ invoke__">imagewbmp</span></span><span>(</span><span><span class="hljs-variable">$background</span></span><span>);

</span><span><span class="hljs-comment">// Freier Speicher</span></span><span>
</span><span><span class="hljs-title function_ invoke__">imagedestroy</span></span><span>(</span><span><span class="hljs-variable">$background</span></span><span>);
</span><span><span class="hljs-title function_ invoke__">imagedestroy</span></span><span>(</span><span><span class="hljs-variable">$overlay</span></span><span>);
</span><span><span class="hljs-meta">?&gt;</span></span><span>
</span></span>

erklären:

  1. Die ImagecreateFromjpeg- und ImagecreateFrommpng -Funktionen werden verwendet, um JPEG -Hintergrundbilder bzw. PNG -Format -Overlay -Bilder zu laden.

  2. Verwenden Sie die ImageCopy -Funktion, um einen Teil des Overlay -Bildes (ab (0, 0) zu kopieren, wobei Breite und Höhe die Größe des Überlagerungsbildes (50, 50) des Hintergrundbildes sind.

  3. Verwenden Sie schließlich ImageWBMP , um das verarbeitete Bild in das WBMP -Format auszugeben, das für niedrige Bandbreiten oder Mobilgeräte geeignet ist.

4. Zusammenfassung

Durch die Kombination von ImageWBMP- und ImageCopy -Funktionen können wir komplexe Bildüberlagerungen erzielen und das endgültige Bild in das WBMP -Format umwandeln, das für mobile Geräte oder Umgebungen mit niedriger Bandbreite geeignet ist. Dieser Ansatz ist nützlich, wenn sie dynamisch Bilder generieren oder Benutzer personalisierten Inhalten für Benutzer bereitstellen, insbesondere bei der Entwicklung von Anwendungen, die Unterstützung für altmodische mobile Geräte oder bestimmte Bildformate erfordern.

Hoffentlich kann dieser Fall Ihnen helfen, besser zu verstehen, wie Sie diese beiden Funktionen verwenden, um komplexe Bildffekte in PHP zu erzielen.