Для плагина Taggallery задумал вывод n изображений (случайных, лучших, ... ) в шапке сайта. Их нужно не просто вывести, а сделать из них коллаж.
В процессе знакомства с графическими функциями библиотеки php gd2 получился функционал, осуществляющий коллаж из изображений в заданной папке. Результат можете наблюдать в шапке этого блога. Плагин Taggallery пока не причем.
Все что получилось, оформил в виде компонента header_collage.
В архиве находится файл header_collage.php, который нужно разместить в каталоге components шаблона.
Скачать: header_collage.zip
Если ваш шаблон не поддерживает компоненты - можно просто подключить этот файл где нужно.
Кроме того, в архиве каталог header_collage, в котором демо-картинки.
Этот каталог нужно разместить в каталоге uploads/, не забыв при этом выставить права на каталог 777 (если загружаете картинки не встроенным загрузчиком, а по ftp или через панель хостинга).
Состав изображений uploads/header_collage/
Служебные изображения:
ramka.png - рамка.
header.jpg - основа шапки (на которую накладываются).
result.jpg - результат коллажа.
Все остальные изображения *.jpg и *.jpeg , если они не начинаются на "_", участвуют в коллаже.
Скрипт берет n случайных изображений, накладывает их на рамку, поворачивает и распределяет по изображению-основанию.
Настройки коллажа.
В самом начале файла компонента все настройки:
$par['source_dir'] = 'header_collage'; // директорий в uploads, где исходные картинки; $par['width'] = 150; // ширина элемента коллажа; $par['height'] = 113; // высота элемента коллажа; $par['pointx'] = 40; // начальная точка вывода элементов; $par['pointy'] = 30; // где будут выведены элементы по высоте; $par['angle'] = array(20,-15,25,10,20,-10,15,25,-15); // углы на которые будут повернуты элементы; $par['borderx'] = 6; // бордюр рамки за изображением по x; $par['bordery'] = 8; // бордюр рамки за изображением по y; $par['stepx'] = 150; // шаг вывода элементов; $par['count'] = 5; // кол-во элементов; $Cache_key=’’; - ключ Кеша: указать чтобы новая шапка строилась только после сброса кеша.
После настройки коллажа нужно указать значение ключа Кеша, например header_collage.
Обращаю внимание, что не рамка накладывается на изображение, а наоборот: сперва рамка уменьшается в заданные размеры, а затем картинка делается меньше рамки на бордюр.
(Кому-то может быть удобнее будет наоборот.)
Может скажете: массив углов лучше генерировать случайно - не спорю, но не всегда красиво получится.
Следующее возможное замечание: нужно делать каждое повернутое изображение в рамке png картинкой и выводить сверху основы средствами html, делая кликкабельными со ссылкой на оригинал изображения – согласен и буду благодарен, если кто-то подскажет как это реализовать(мой мозг неспособен понять поведение div-ов).
Еще где-то читал, что можно делать хитрые изображения-карты с участками-ссылками – но . . . чего только не бывает.
Функции компонента.
Функции компонента задаются прямо в файле компонента, что не совсем верно - зачем их погружать, если вычисления не проводятся. Вычисление, ведь, проводятся единожды после сброса кеша.
Приведу пояснения по функциям - вдруг кто-то захочет их модифицировать.
function rotate_img_collage
[spoiler]
function rotate_img_collage($ramka , $img , $angle , $width , $height , $borderx , $bordery)
{
$res = imagecreatetruecolor($width,$height);
$trans = imagecolorat($res,0,0);
imagecopyresized ($res,$ramka,
0,0,
0,0,
$width,$height,
imagesx($ramka),imagesy($ramka));
$trans = imagecolorat($res,0,0);
imagecolortransparent($res,$trans);
$trans = imagecolorat($res,0,0);
imagecopyresized ($res,$img,
$borderx,$bordery,
0,0,
$width-2*$borderx,$height-2*$bordery,
imagesx($img),imagesy($img));
$res = imagerotate($res, $angle ,-1);
imagealphablending($res, true);
imagesavealpha($res, true);
return $res;
}
[/spoiler]
Эта функция получает такие параметры:
$ramka - ресурс рамки;
$img - ресурс накладываемого изображения;
$angle - угол поворота;
$width - ширина !до поворота;
$height - высота !до поворота;
$borderx - зазор между рамкой и изображением по x;
$bordery - зазор - по y;
Результатом функции - ресурс наложенного на рамку и повернутого изображения.
header_collage
function header_collage($array_fn_img , $fn_ramka, $fn_header , $fn_result , $width, $height , $borderx , $bordery , $pointx , $pointy , $angle , $stepx)
{
$ramka = imagecreatefrompng($fn_ramka);
$header = imagecreatefromjpeg($fn_header);
foreach ($array_fn_img as $i=>$fn_img)
{
$img = imagecreatefromjpeg($fn_img);
$res = rotate_img_collage($ramka , $img , $angle[$i] , $width , $height , $borderx , $bordery);
imagecopy (
$header,
$res,
$pointx+$stepx*$i , $pointy,
0, 0,
imagesx($res),imagesy($res)
);
}
imagejpeg($header,$fn_result);
}
Функция получает:
$array_fn_img - массив полных путей к файлам картинок
$fn_ramka - полный путь к файлу рамки;
$fn_header - полный путь к файлу основы;
$fn_result - полный путь к тому, куда будет результат;
$width - ширина элемента с рамкой;
$height - высота элемента с рамкой;
$borderx - бордюр по x;
$bordery - бордюр по y;
$pointx - начальная точка x;
$pointy - начальная точка y;
$angle - массив углов поворота;
$stepx - шаг выводаизображений;
Функция последовательно берет из массива картинку, угол; накладывает на рамку, поворачивает, отступает на шаг от НАЧАЛА предыдущего и накладывает на основу.
Результат действия будет в файле с именем в переменной $fn_result.
Что надо бы улучшить.
1. Хотелось бы социальные кнопки вывести поверх шапки в левом верхнем углу, как в компоненте logo-inks.
2. Не знаю: стоит ли делать опции компонента в админке - влом.
3. Наклоненные в рамках изображения полноразмерные картинкиповерх шапки-основы лучше вывести средствами html, чтобы ссылки с них были lightbox, или вели на страницы картинки, формируемые плагином Taggallery.
