- → Программирование
- → PHP
- → Статьи
Превью картинки на PHP
Вам нужно создать превью картинки на PHP, но вы не знаете как это реализовать. Давайте сейчас попробуем разобраться. Итак, для написания превью нам необходимо, что бы была установлена библиотека GD на вашем PHP, но это не так страшно как звучит, так как данная библиотека функций стандартно установлена на хостингах и локальных серверах, таких как Denver и других.
Предположим у нас есть файлы:
Image1.jpg [400x500]
Image2.png [137x400]
Image3.gif [570x200]
А нам необходимо вывести красивые превью размером 200x200, и так чтобы генерировались на лету. Для этого создадим php файл с именем preview: preview.php
И поместим в него данный php код:
<?php
header("Content-type: image/jpeg");
$source=$_GET['src']; //наш исходник
$height=200; //параметр высоты превью
$width=200; //параметр ширины превью
$rgb=0xffffff; //цвет заливки несоответствия
$size = getimagesize($source);//узнаем размеры картинки (дает нам масив size)
$format = strtolower(substr($size['mime'], strpos($size['mime'], '/')+1)); //определяем тип файла
$icfunc = "imagecreatefrom" . $format; //определение функции соответственно типу файла
if (!function_exists($icfunc)) return false; //если нет такой функции прекращаем работу скрипта
$x_ratio = $width / $size[0]; //пропорция ширины будущего превью
$y_ratio = $height / $size[1]; //пропорция высоты будущего превью
$ratio = min($x_ratio, $y_ratio);
$use_x_ratio = ($x_ratio == $ratio); //соотношения ширины к высоте
$new_width = $use_x_ratio ? $width : floor($size[0] * $ratio); //ширина превью
$new_height = !$use_x_ratio ? $height : floor($size[1] * $ratio); //высота превью
$new_left = $use_x_ratio ? 0 : floor(($width - $new_width) / 2); //расхождение с заданными параметрами по ширине
$new_top = !$use_x_ratio ? 0 : floor(($height - $new_height) / 2); //расхождение с заданными параметрами по высоте
$img = imagecreatetruecolor($width,$height); //создаем вспомогательное изображение пропорциональное превью
imagefill($img, 0, 0, $rgb); //заливаем его…
$photo = $icfunc($source); //достаем наш исходник
imagecopyresampled($img, $photo, $new_left, $new_top, 0, 0, $new_width, $new_height, $size[0], $size[1]); //копируем на него нашу превью с учетом расхождений
imagejpeg($img); //выводим результат (превью картинки)
// Очищаем память после выполнения скрипта
imagedestroy($img);
imagedestroy($photo);
?>
Если вы понимаете как работает данный код генерации php превью, то вы гений! Если нет, то давайте разберёмся поэтапно:
header("Content-type: image/jpeg"); - означает, что данный файл (preview.php) будет jpg картинкой, то есть нашей php превью.
$height=200; $width=200; $rgb=0xffffff; $source=$_GET['src']; - настройки нашего скрипта, где: высота; ширина; цвет заливки пустоты в превью (0xffffff – белый, 0x000000 – черный, соответственно подбираем под свой стиль сайта); файл ресурса который передается в скрипт GET методом, например: <imgsrc=preview.php?src=image.jpg/>
Следует заметить, что можно передавать значение src также таким образом: preview.php?src=http://site.com/image.jpg если исходник вашей превью лежит на другом сайте, хостинге.
$format = strtolower(substr($size['mime'], strpos($size['mime'], '/')+1));
$icfunc = "imagecreatefrom" . $format;
if (!function_exists($icfunc)) return false;
Этими строками мы создаем название функции соответственно расширению файла исходника превью. Например, файл photo.jpg, в таком случае $icfunc будет иметь значение imagecreatefromjpg. Если же вы передадите в скрипт ресурс типа photo.blablabla, то сработает проверка if (!function_exists($icfunc)) returnfalse; и возвратит FALSE.
Далее идут вычисления размеров уменьшенной копии исходника, где $new_width и $new_height , это ширина и высота превью пропорциональная исходному изображению, но не превышающая параметров $height=200; $width=200; . Это значит, что одна из сторон будут 200 пикселей, другая пропорциональная изображению, но меньше 200. Если исходное изображение становило 400x300, то его $new_width и $new_height будут становить 200 и 150.
$new_left и $new_top - это расхождения в пикселях превью размером 200x200 и уменьшенной копии исходника. Например, размер уменьшенной копии будет 200x150, в таком случае $new_left равен 0, а $new_top равен 25. То есть нам нужно отступить на 25 пикселей сверху превью размером 200 на 200, что бы уменьшенная копия высотой в 150 была по центру. Это хорошо видно на картинке ниже.
$img = imagecreatetruecolor($width, $height); imagefill($img, 0, 0, $rgb); - создаем вспомогательное изображение $img размеры которого соответствуют параметрам нашего php превью и заливаем его цветом указанным параметром $rgb.
$photo = $icfunc($source); - открываем исходник, если имя файла будет image.jpg, то данную строку можно записать таким образом: $photo = imagecreatefromjpg(“image.jpg”); Но мы написали гораздо грамотнее, где $icfunc , если вы помните это вычисление функции по расширению исходного файла нашей превью.
imagecopyresampled($img, $photo, $new_left, $new_top, 0, 0, $new_width, $new_height, $size[0], $size[1]);
Копируем и уменьшаем исходник на "новосотворенную" превью, с учетом расхождений в размерах пропорциональной уменьшенной копии и желаемого размера картинки превью.
imagejpeg($img); - собственно публикуем (выводим) то, что получилось.
imagedestroy($img); imagedestroy($photo); - очищаем оперативную память после вывода (публикации) нашей превью.
Ура мы написали файл, который будет сходу генерировать превью картинки. Теперь давайте посмотрим, что у нас получилось. Для проверки создадим файл: pictures.html
Вот его содержимое:
<html><head><title>Sitear.ru</title>
<style>body {background:#FF0;}img {border:3px #F00 solid;}</style>
</head><body>
<img src= preview.php?src=image1.jpg'>
<img src= preview.php?src=image2.jpg'>
<img src= preview.php?src=image3.jpg'>
<img src= preview.php?src=image4.jpg'>
</body></html>
Сохраним и положим его в папку с нашим файлом preview.php и четырьмя исходниками картинок. У меня вот, что получилось:
Если поиграть со строкой imagecopyresampled($img, $photo, $new_left, $new_top, 0, 0, $new_width, $new_height, $size[0], $size[1]); и вместо $new_top поставить 0, или $new_top*2 , то можно выровнять уменьшенные копии картинок по верхней или по нижней границе превью. Вот что у меня получилось:
Таким же образом можно изменять положение копии на превью, меняя параметр $new_left аналогичным образом. Или если вас смущают данные расхождения, и вам нужны просто маленькие копии картинок пропорциональные большим изображениям, то известные строки php кода будут выглядеть таким образом:
$img = imagecreatetruecolor($new_width,$new_height); - создастся изображение пропорциональное исходному, а не 200 на 200. То есть $img будет 200 на 150, согласно выше описанному примеру.
imagecopyresampled($img, $photo, 0, 0, 0, 0, $new_width, $new_height, $size[0], $size[1]); - так будет выглядеть строка копирования и уменьшения исходной картинки.
Вот так получилось у меня. На этом наша статья завершается. Пробуйте и наслаждайтесь результатом своих трудов. Как видите создать превью картинки на php не так уж и сложно, если разобраться. Если есть лучшие варианты реализации данного php кода, просим комментировать. Если скрипт генерации превью картинок на php вам был полезен, милости просим написать спасибо в комментариях.
Дальше: RSS на PHP: Создание RSS ленты на PHP
Development — Taras Moroz