第一種 url 格式只是取得路徑的問題。
第二種 base64 格式可以透過
base64_encode(file_get_contents($path)); 就簡單的達成。第三種 sprite 格式則使用 Imagick 去處理，會比較快樂。
接著以下就是如何達成的程式片段：
<?php
/*把目錄改變到當前文件下*/
chdir(dirname(__FILE__));
/*Sprite 圖與圖的間距*/
$spriteGap = 30;
/*=[ 取得圖檔資訊 ]=*/
$maxWidth = 0;
$maxHeight = 0;
$nextTop = 0;
$imageList = array();
foreach ( glob('icons/*.{png,jpg,gif}',GLOB_BRACE) as $path )
{
$image = new Imagick($path);
$name = pathinfo($path,PATHINFO_FILENAME);
if(isset($imageList[$name])){
throw new Exception("圖片名稱重複 [ $name ]");
}
$info = array(
'{top}' => $nextTop,
'{image}' => $image,
'{width}' => $image->getImageWidth(),
'{height}' => $image->getImageHeight(),
'{name}' => $name,
'{path}' => $path,
'{isAnimate}' => false
);
$header = '';
switch($image->getImageFormat()){
case "PNG":
$header = 'data:image/png;base64,'; break;
case "JPEG":
$header = 'data:image/jpeg;base64,'; break;
case "GIF":
$header = 'data:image/gif;base64,'; break;
default: break;
}
$info['{uri}'] = $header.base64_encode(file_get_contents($path));
$maxWidth = max($maxWidth, $info['{width}']);
$maxHeight = max($maxHeight, $info['{height}']);
/*檢查圖片是否為動畫*/
$frameNum = 0;
foreach($image->deconstructImages() as $i) {
$frameNum++;
if ($frameNum > 1) {
$info['{isAnimate}'] = true;
break;
}
}
if(!$info['{isAnimate}']){
$nextTop += $info['{height}'] + $spriteGap;
}
$imageList[$name] = $info;
}
/*=[ 製作 CSS Sprite 圖檔 ]=*/
$spriteImage = new Imagick();
$spriteImage->newImage($maxWidth, $nextTop, new ImagickPixel());
$spriteImage->setImageFormat('png');
$spriteImage->paintTransparentImage(new ImagickPixel(), 0.0, 0);
foreach ($imageList as $name => $info)
{
if($info['{isAnimate}']){ continue; } /* 忽略 GIF 動畫 */
/* 複製 Icon 圖檔到 Sprite */
$spriteImage->compositeImage(
$info['{image}'],
$info['{image}']->getImageCompose(),
0,
$info['{top}']
);
$info['{image}']->destroy();
unset($imageList[$name]['{image}']);
}
$spriteImage->writeImage('icons.sprite.png');
$spriteImage->destroy();
$spriteImage = null;
下載完整程式： php_make_icons_css.zip
