ImageFlip（）を使用して、仮想フィッティングミラー効果を実現します

M66 2025-05-31

現代のeコマースWebサイトでは、仮想フィッティングミラー機能がますます人気が高まっています。ユーザーがより没入型のショッピングエクスペリエンスをもたらすだけでなく、変換率も向上させます。この記事では、PHPでImageFlip（）関数を使用して、主にImage Flip関数を介して左右のミラードレッシング効果をシミュレートする単純な仮想フィッティングミラー効果を実現する方法を紹介します。

1。TLUNDSIMAGEFLIP（）

PHPは、5.5.0からImageFlip（）関数を導入しました。これは、画像をフリップするために使用されます。構文は次のとおりです。

 bool imageflip(GdImage $image, int $mode)

$モードパラメーターは、次の3つの定数のいずれかになります。

IMG_FLIP_HORIZONTAL ：水平フリップ（左と左と右のミラー）
img_flip_vertical ：垂直フリップ（上下ミラー）
IMG_FLIP_BOTH ：水平フリップと垂直フリップを同時に実行します

仮想フィッティングミラーのシーンでは、最も一般的に使用されるのは水平フリップです。

2。シミュレートされたフィッティング効果の中心的なアイデア

ユーザーは自分の正面写真をアップロードします。
ユーザーは、衣服を選択します（透明な背景を持つPNG）。
ユーザーの写真に衣類層をオーバーレイします。
ImageFlip（）を使用して、ユーザーがボタンをクリックして「In-Mirror」の効果を表示できるようにします。
処理された画像は最終的に出力されます。

3。サンプルコードの実装

簡単な実装の例は次のとおりです。

 <?php
// ユーザーの写真を読み込みます
$userImage = imagecreatefromjpeg('uploads/user.jpg');

// 服を積みますPNG（透明な背景で）
$clothesImage = imagecreatefrompng('assets/clothes/shirt1.png');

// 衣類層の幅と高さを取得します
$clothesWidth = imagesx($clothesImage);
$clothesHeight = imagesy($clothesImage);

// ユーザーマップに衣服の位置を設定します（これは中央に配置されていると想定されています）
$destX = (imagesx($userImage) - $clothesWidth) / 2;
$destY = 200; // 上部までの距離 200px，必要に応じて調整できます

// 透明な処理を許可します
imagealphablending($userImage, true);
imagesavealpha($userImage, true);

// 画像をマージします
imagecopy($userImage, $clothesImage, $destX, $destY, 0, 0, $clothesWidth, $clothesHeight);

// ユーザーがミラーモードを要求する場合
if (isset($_GET['mirror']) && $_GET['mirror'] == '1') {
    imageflip($userImage, IMG_FLIP_HORIZONTAL);
}

// ブラウザに画像を出力します
header('Content-Type: image/png');
imagepng($userImage);
imagedestroy($userImage);
imagedestroy($clothesImage);
?>

4。フロントエンドページの例

以下は、上記のPHPに一致するフロントエンドページの簡単なバージョンです。

 <!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>仮想フィッティングミラー</title>
</head>
<body>
    <h2>仮想フィッティングミラー</h2>
    <img src="http://m66.net/tryon.php" id="preview" style="max-width: 100%;"><br><br>
    <button onclick="mirror()">ミラースイッチ</button>

    <script>
        let mirrored = false;
        function mirror() {
            mirrored = !mirrored;
            let img = document.getElementById('preview');
            img.src = 'http://m66.net/tryon.php?mirror=' + (mirrored ? '1' : '0') + '&t=' + new Date().getTime();
        }
    </script>
</body>
</html>

5。概要

PHPのImageFlip（）関数とシンプルな画像合成関数を組み合わせて、基本的な仮想フィッティングミラー効果を簡単に実装できます。この例は比較的簡素化されていますが、より高度な仮想ドレスアップシステムを実装するための基盤を築きました。さらに、画像を追加し、表認識ポジショニング、3Dモデリング、その他のテクノロジーを追加して、現実感を高めることができます。

この記事があなたに役立つことを願っていますので、試してみてください！

imageflip