Blog. Just Blog

Скрипт для генерации эффектных коллажей

Версия для печати Добавить в Избранное Отправить на E-Mail | Категория: Web-мастеру и не только | Автор: ManHunter
Скрипт для генерации эффектных коллажей
Скрипт для генерации эффектных коллажей

Не секрет, что при оформлении статей мне очень нравится использовать коллажи в виде нескольких фотографий, "набросанных" одна на другую. Для этого можно использовать специальные программы или графические редакторы, но я решил пойти чуть дальше и написать скрипт на PHP, который будет генерировать такие изображения. Теперь он используется у меня на фотосайте для генерации превьюшек галерей. Вы можете без особого труда модифицировать его для своих нужд.

Для работы понадобится вспомогательная функция для совмещения изображений с альфа-каналом. Ее параметры аналогичны функции ImageCopyMerge, последний параметр - значение прозрачности для накладываемого изображения. Функция очень полезная, наверняка пригодится и в других случаях.
  1. //-----------------------------------------------------------------------
  2. // Вспомогательная функция для совмещения изображений с альфа-каналом
  3. //-----------------------------------------------------------------------
  4. function ImageCopyMergeAlpha($dst_im$watermark$dst_x$dst_y,
  5.                        $src_x$src_y$src_w$src_h$pct){
  6.     if (!isset($pct)) {
  7.         return false;
  8.     }
  9.     $pct/=100;
  10.     $w=ImageSX($watermark);
  11.     $h=ImageSY($watermark);
  12.     ImageAlphaBlending($watermarkfalse);
  13.     $minalpha=127;
  14.     for ($x=0$x<$w$x++)
  15.     for ($y=0$y<$h$y++) {
  16.         $alpha=(ImageColorAt($watermark,$x,$y)>>24) & 0xFF;
  17.         if ($alpha<$minalpha) {
  18.             $minalpha=$alpha;
  19.         }
  20.     }
  21.     for ($x=0$x<$w$x++) {
  22.         for ($y=0$y<$h$y++){
  23.             $colorxy=ImageColorAt($watermark,$x,$y);
  24.             $alpha=($colorxy>>24) & 0xFF;
  25.             if ($minalpha!==127) {
  26.                 $alpha=127+127*$pct*($alpha-127)/(127-$minalpha);
  27.             }
  28.             else {
  29.                 $alpha+=127*$pct;
  30.             }
  31.             $alphacolorxy=ImageColorAllocateAlpha($watermark,
  32.                ($colorxy>>16) & 0xFF, ($colorxy>>8) & 0xFF,
  33.                $colorxy 0xFF$alpha);
  34.             if (!ImageSetPixel($watermark,$x,$y,$alphacolorxy)) {
  35.                 return false;
  36.             }
  37.         }
  38.     }
  39.     ImageCopy($dst_im$watermark$dst_x$dst_y,
  40.                            $src_x$src_y$src_w$src_h);
  41. }
Также будут нужны два изображения - это общий фон коллажа, на который будут "набросаны" фотографии, и основа для фотографии в виде рамки с полупрозрачной тенью. У меня они фиксированных размеров, соответственно, эти параметры будут жестко прописаны в скрипте. При необходимости можете поменять их на свои.

Вспомогательные изображения
Вспомогательные изображения

Перед созданием коллажа надо поместить исходные изображения в папку \thumbs, которая должна быть рядом со скриптом генерации. Важно, чтобы соотношение сторон изображений было 4:3, иначе они будут искажаться при наложении. Количество изображений может быть любым, но желательно не менее 9. Изображения для создания коллажа будут каждый раз выбираться случайным образом.
  1. //-----------------------------------------------------------------------
  2. // Скрипт для генерации эффектных коллажей
  3. //-----------------------------------------------------------------------
  4.  
  5. // Координаты для базовой привязки элементов коллажа
  6. $places=array(
  7.     array(25,25), array(75,25), array(125,25),
  8.     array(25,85), array(75,85), array(125,85),
  9.     array(25,145), array(75,145), array(125,145)
  10. );
  11.  
  12. // Получить список исходных изображений в каталоге
  13. $img=array();
  14. $dir=opendir('thumbs');
  15. while ($tmp=readdir($dir)) {
  16.     if (substr($tmp,0,1)=='.') { continue; }
  17.     $img[]=$tmp;
  18. }
  19. // Перемешать список
  20. shuffle($img);
  21.  
  22. // Фон с заливкой белым цветом
  23. $im=ImageCreateTrueColor(256256);
  24. $white=ImageColorAllocate($im255255255);
  25. ImageFilledRectangle($im00256256$white);
  26.  
  27. // Наложить фоновый блок с тенью
  28. $background=@ImageCreateFromPng('background.png');
  29. ImageCopyMergeAlpha($im$background0000256256100);
  30. ImageDestroy($background);
  31.  
  32. // Наложить 9 случайных изображений
  33. for ($i=0$i<9$i++) {
  34.     // Количество превьюшек меньше 9
  35.     if ($i==count($img)) { break; }
  36.     // Выбрать незанятое место
  37.     while (true) {
  38.         $pos=mt_rand(0,8);
  39.         if ($places[$pos][0]!=0) { break; }
  40.     }
  41.     $dx=$places[$pos][0];
  42.     $dy=$places[$pos][1];
  43.  
  44.     // Отметить место как занятое
  45.     $places[$pos]=array(0,0);
  46.  
  47.     // Сдвиг открытки по осям
  48.     $zx=mt_rand(0,10);
  49.     $zy=mt_rand(0,10);
  50.     $px=(mt_rand(0,100)<50)?($dx+$zx):($dx-$zx);
  51.     $py=(mt_rand(0,100)<50)?($dy+$zy):($dy-$zy);
  52.  
  53.     // Наложить фон с полупрозрачной тенью
  54.     $shadow=@ImageCreateFromPng('shadow.png');
  55.     ImageCopyMergeAlpha($im$shadow$px$py001068160);
  56.     ImageDestroy($shadow);
  57.  
  58.     // Наложить изображение
  59.     $thumbnail=@ImageCreateFromJPEG('thumbs/'.$img[$i]);
  60.     ImageCopyResampled($im$thumbnail, ($px+1), ($py+1),
  61.         0010075200150);
  62.     ImageDestroy($thumbnail);
  63. }
  64.  
  65. header('Content-Type: image/png');
  66.  
  67. // Сохранить полученный коллаж в файл и вывести в браузер
  68. ImagePNG($im,'out.png');
  69. ImagePNG($im);
  70.  
  71. ImageDestroy($im);
При создании коллажа фоновое изображение делится на 9 частей, затем на каждый из участков в произвольном порядке накладывается сперва рамка с тенью, а потом в нее вписывается миниатюра случайно выбранной фотографии. При этом каждая миниатюра с рамкой случайно сдвигается по обеим координатам на несколько пикселов. В результате получаются коллажи, как на главной картинке статьи. Если расположение фотографий вас не устраивает, то достаточно обновить страницу, тут же будет создан новый коллаж. Пример работы скрипта вы можете посмотреть на демонстрационной странице.

В приложении скрипт со всеми вспомогательными изображениями и несколькими фотографиями для демонстрации создания коллажа.

Скрипт для генерации эффектных коллажейСкрипт для генерации эффектных коллажей

PHP.Collage.zip (376,124 bytes)


Поделиться ссылкой ВКонтакте Поделиться ссылкой на Facebook Поделиться ссылкой на LiveJournal Поделиться ссылкой в Мой Круг Добавить в Мой мир Добавить на ЛиРу (Liveinternet) Добавить в закладки Memori Добавить в закладки Google
Просмотров: 5820 | Комментариев: 11

Метки: PHP, графика
Внимание! Статья опубликована больше года назад, информация могла устареть!

Комментарии

Отзывы посетителей сайта о статье
ManHunter (06.10.2016 в 10:54):
Ну а ошибки я телепатией должен выяснять? Файлы должен через хрустальный шар смотреть? Если нужен нормальный ответ, то сперва надо задать нормальный вопрос.
Alex (06.10.2016 в 10:40):
Я надеялся что доктор это вы, и что сможете подсказать как адаптировать ваш код под .png. Если заменить $thumbnail=@ImageCreateFromJPEG(); на ImageCreateFromPng все равно идет ошибка
ManHunter (05.10.2016 в 20:50):
К доктору сходить, сейчас все лечат, даже .png
Alex (05.10.2016 в 19:46):
Подскажите а как быть если у меня .png
ManHunter (29.07.2015 в 20:35):
Нет слов........
Herber (29.07.2015 в 17:08):
ManHunter, я сконвертировал ваш код в c#. С php особо не дружу. Запустил в xampp ваш скрипт - прозрачный фон. Все гут. У меня же черная рамка появляется. Поэтому я спрашивал где в коде конкретно идет заливка?
ManHunter (29.07.2015 в 15:43):
Прозрачная тень и рамка задается в PNG-файле с альфа-каналом, а не в коде.
Herber (29.07.2015 в 15:11):
Добрый день. У меня почему то получаются черные границы вокруг картинок. http://joxi.ru/DmBXJzptq719AP. В каком куске кода можно посмотреть цвет границ?
ManHunter (03.02.2015 в 17:06):
Я тоже на firefox сижу, все прекрасно отображает.
привет (03.02.2015 в 17:03):
firefox  не отображает файл preview.php
... что делать?
lutskboy (17.11.2014 в 17:01):
очень классно. мне понравилось

Добавить комментарий

Заполните форму для добавления комментария
Имя*:
Текст комментария (не более 2000 символов)*:

*Все поля обязательны для заполнения.
Комментарии, содержащие рекламу, ненормативную лексику, оскорбления и т.п., а также флуд и сообщения не по теме, будут удаляться. Нарушителям может быть заблокирован доступ к сайту.
Наверх
Powered by PCL's Speckled Band Engine 0.2 RC3
© ManHunter / PCL, 2008-2017
При использовании материалов ссылка на сайт обязательна
Время генерации: 0.09 сек. / MySQL: 2 (0.004 сек.) / Память: 4.5 Mb
Наверх