Размытие серого прямоугольника хоть и очень логичный, но не самый эффективный способ создать тень. За эффективностью предлагаю обратиться к опыту игроделов и "растянуть" тень из пары пикселей в большую картинку. При наличии сглаживания (интерполяции) это способ получить довольно качественное размытие с меньшими затратами, в отличие от размытия. Проблема кроется в том, что imagecopyresampled
не делает интерполяцию при увеличении размеров, только при уменьшении. При увеличинии - только nearest neighbour, т.е. дублирование пикселей.
В PHP 5.5 появилась функция imagesetinterpolation, которая управляет тем самым размытием. По документации, её эффект заметен только на функциях imageaffine и imagerotate
. Первая возволяет делать "произвольные" аффинные преобразования, чем мы и воспользуемся.
С помощью аффинного преобразования функция imageaffine создаст нам новое изображение из старого путём перетаскивания пикселей на новые места, в соответствии с заданными линейными уравнениями. Всё пространство между пикселями в новой картинке будет заполнено с помощью метода интерполяции, который устанавливается imagesetinterpolation.
Далее немного магии.
<?php
header('Content-Type: image/png');
// Создаём фоновое изображение
$width = 480;
$height = 320;
$image = imagecreatetruecolor($width, $height);
// Создаём изображение для тени
$shadow_downscale = 40;
$shadow_upscale = 10;
$shadow_width = $width / $shadow_downscale;
$shadow_height = $height / $shadow_downscale;
$shadow_image = imagecreatetruecolor($shadow_width, $shadow_height);
imagesetinterpolation($shadow_image, IMG_BSPLINE);
// Цвета
$background = imagecolorallocate($image, 239, 239, 239);
$shadow = imagecolorallocate($image, 170, 170, 170);
// Рисуем фон
imagefilledrectangle($image, 0, 0, $width, $height, $background);
// Рисуем тень как вложенный прямоугольник на фоне
imagefilledrectangle($shadow_image, 0, 0, $shadow_width, $shadow_height, $background);
imagefilledrectangle($shadow_image, 2, 2, $shadow_width-2, $shadow_height-2, $shadow);
// Размываем тень
$rendered_shadow = imageaffine($shadow_image, array($shadow_upscale,0,0,$shadow_upscale,0,0));
$rendered_shadow_width = imagesx($rendered_shadow);
$rendered_shadow_height = imagesy($rendered_shadow);
// Накладываем поверх изображения
$xpos = 40; $ypos = 40;
imagecopyresampled($image, $rendered_shadow, $xpos, $ypos, 0, 0, $width - 2*$xpos, $height - 2*$ypos, $rendered_shadow_width, $rendered_shadow_height);
imagepng($image);
?>
Замечания по коду:
- Сила "размытия" управляется лишь отношением разметров "теневой" картинки к основной. Уменьшение в 40 раз - значит и радиус около 40.
- Из предлагаемых интерполяцией фильтров мне больше всего понравился IMG_BSPLINE, но даже он даёт некоторую "засветку" по краям. Имеет смысл в финальном этапе копирования вырезать нужный диапазон с минимумом побочных эффектов.
- imageaffine создаёт новое изображение, и его размеры определяются границами преобразований. Чем меньше коэффициенты масштабирования, тем меньше создаваемая картинка и меньше нагрузка на хостера. Так вот, необязательно делать upscale до размеров исходной картинки. Ввиду общей размытости, даже в 4 раза меньшая картинка с "тенью" даёт вменяемый результат.
- Со значениями всё равно придётся шаманить.
Результат:
