Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. PHP

Работа с изображениями на PHP с использованием GD

by
Difficulty:IntermediateLength:MediumLanguages:

Russian (Pусский) translation by Anna Goorikova (you can also view the original English article)

Интернет будет довольно скучным без изображений. Тем не менее, поддержка и управление сотнями или тысячами изображений для вашего веб-сайта может быть головной болью. По мере изменения дизайна вашего сайта вам может потребоваться изменить все ваши изображения - например, преобразовать все ваши изображения в оттенки серого или изменить их размер до 50% от их первоначального размера. Вы также можете сжимать или обрезать разные изображения. Выполнение этого вручную занимает много времени и подвержено ошибкам, но с небольшим знанием программирования оно может быть автоматизировано.

В этом уроке мы узнаем о библиотеке GD (Graphic Draw) в PHP. Вы увидите, как эту библиотеку можно использовать для управления изображениями путем изменения размера, обрезки, поворота или фильтрации.

Что такое GD?

PHP может сделать гораздо больше, чем просто отправлять HTML-сообщения посетителям. Например, он имеет возможность манипулировать изображениями. Не только это, но вы также можете создавать свои собственные изображения с нуля, а затем либо сохранять их, либо подавать их пользователям.

PHP может удовлетворить практически все ваши основные потребности в управлении изображениями, используя библиотеку GD - сокращение для Graphic Draw.

Установка

Если вы работаете в Windows, вы можете включить файл php_gd2.dll в качестве расширения в php.ini. Если вы используете что-то вроде XAMPP, вы найдете файл php_gd2.dll в каталоге xampp\php\ext. Вы также можете проверить, установлена ли GD в вашей системе, с помощью функции phpinfo();. Если вы просмотрите полученный результат, вы найдете что-то похожее на следующее.

PHP XAMPP GD

Вы также можете посетить страницу требований и установки, чтобы узнать больше об установке.

Создание изображений с помощью PHP GD

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

Создание нового изображения

Функция imagecreatetruecolor() окажется полезной, если у вас нет исходного источника изображения, которое вы хотите изменять. Она принимает два целочисленных параметра: ширину и высоту. Она вернет ресурс изображения, если все пойдет по плану. Возвращаемый ресурс изображения в основном представляет собой черное изображение с заданной шириной и высотой.

Загрузка файла изображения

Если вы планируете работать с изображениями, которые уже хранятся где-то, вам пригодится использование таких функций, как imagecreatefromjpeg(), imagecreatefrompng() и imagecreatefromgif(). Они создадут ресурс изображения со всеми данными из загруженного файла изображения. Эти функции принимают единственный параметр, который указывает местоположение загружаемого изображения, как URL-адрес или путь к файлу.

Создание изображения из строки

Библиотека GD также позволяет создавать изображения из строки, используя функцию imagecreatefromstring() в PHP. Помните, что вам нужно будет использовать base64_decode() для данной строки перед imagecreatefromstring(). Функция может автоматически определять, является ли тип изображения JPG, PNG, GIF или другим поддерживаемым форматом.

Вращение, масштабирование, обрезка и переворот изображения

Некоторые общие операции, которые вы можете выполнять на ресурсе изображения, - это вращение, масштабирование, обрезка и переворот.

Вращение

Вы можете повернуть изображение, которое вы уже загрузили в скрипт, используя функцию imagerotate(). Она будет вращать изображение под заданным углом, используя центр изображения в качестве центра вращения. Угол представлен как значение с плавающей точкой, и PHP считает, что это значение угла вращения. Иногда повернутое изображение будет иметь разные размеры по сравнению с исходной версией. Это означает, что после поворота вы получите некоторую открытую область. Третий параметр функции imagerotate() может использоваться для задания цвета фона пустой области после вращения.

Масштабирование

Очень просто масштабировать изображение с помощью библиотеки GD. Вам просто нужно передать ресурс изображения, а также ширину и высоту в функцию imagescale(). Если вы опустите высоту, GD будет масштабировать изображение до указанной ширины, сохраняя соотношение сторон. Вы также можете указать режим масштабирования изображения. Его можно установить в IMG_NEAREST_NEIGHBOUR, IMG_BILINEAR_FIXED, IMG_BICUBIC и т.д. Важная вещь, которую вам нужно запомнить, это то, что эта функция возвращает новый источник масштабированного изображения вместо того, чтобы изменять исходный.

Обрезка

Вы можете обрезать любой ресурс изображения с помощью функции imagecrop() в GD. Первый параметр - исходный ресурс изображения, а второй параметр - ассоциативный массив с ключами x, y, width и height, определяющий размеры позиции окна обрезки.

Crop and Rotate Images Using PHP

Изображение бабочки выше было обрезано с использованием следующего кода:

В основном, мы сохраняем длину самой маленькой стороны в переменной $size. Затем эта переменная используется для определения границы нашего прямоугольника обрезки. Наконец, изображение уменьшено таким образом, что оно составляет всего 300 пикселей в ширину и длину. Это дает нам квадратное изображение.

Переворот изображений

Изображения можно перевернуть горизонтально, вертикально или в обоих направлениях с помощью функции imageflip(). Она принимает ресурс изображения, который вы хотите перевернуть, в качестве первого параметра, и режим переворота в качестве второго параметра. Режим переворота может быть установлен на IMG_FLIP_HORIZONTAL, IMG_FLIP_VERTICAL или IMG_FLIP_BOTH.

Верхнее левое изображение на приведенном выше рисунке является оригиналом. Верхнее правое изображение было создано с помощью IMG_FLIP_HORIZONTAL, нижнее левое изображение было создано с использованием IMG_FLIP_VERTICAL, а нижнее правое изображение - с помощью IMG_FLIP_BOTH. (Изображение вороны от Pixabay.)

Применение фильтров к изображению

GD также имеет очень полезную функцию imagefilter(), которая может применять фильтры на разных ресурсах изображений, загружаемых с использованием функций из предыдущих изображений. Эта функция может принимать различные параметры в зависимости от применяемого фильтра.

Для начала укажите ресурс изображения и имя фильтра, который вы хотите применить. Вы можете установить его на один из 12 предопределенных типов фильтров, упомянутых в документах.

  • IMG_FILTER_NEGATE: обращает (меняет как в негативе) цвета на изображении
  • IMG_FILTER_GRAYSCALE: удаляет цвет из изображения
  • IMG_FILTER_BRIGHTNESS: делает изображение ярче или темнее
  • IMG_FILTER_CONTRAST: увеличивает контрастность изображения
  • IMG_FILTER_COLORIZE: оттеняет изображение в выбранный цвет
  • IMG_FILTER_EDGEDETECT: выделяет края изображения
  • IMG_FILTER_EMBOSS: похоже на обнаружение краев, но придает каждому краю приподнятый вид
  • IMG_FILTER_GAUSSIAN_BLUR: размывает изображение с использованием метода Гаусса
  • IMG_FILTER_SELECTIVE_BLUR: размывает изображение с помощью выборочного метода
  • IMG_FILTER_MEAN_REMOVAL: эффект создания стилизованного изображения
  • IMG_FILTER_SMOOTH: сглаживает зубчатые края изображения
  • IMG_FILTER_PIXELATE: делает изображение пикселизированным

Некоторые фильтры, такие как NEGATE, GRAYSCALE, EDGE_DETECT и EMBOSS, не нуждаются в дополнительных данных. Другие фильтры, такие как BRIGHTNESS, CONTRAST и SMOOTH, могут принимать дополнительный параметр, который определяет количество яркости, контрастности или гладкости конечного изображения. Параметр PIXELATE позволяет указать два дополнительных параметра: размер блока, а также режим пикселизации. Наконец, фильтр COLORIZE принимает четыре параметра, которые определяют значения для red, green и blue компонентов, а также альфа-канала.

Изображение в левом верхнем углу является оригиналом. Верхнее правое изображение было создано с использованием фильтра COLORIZE, нижний левый был создан с использованием фильтра GRAYSCALE, а изображение в правом нижнем углу было создано с использованием фильтра BRIGHTNESS. (Это изображение бабочки было найдено в Pixabay.)

Другие полезные функции для работы с изображениями

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

Получение размеров изображения

Вы можете определить ширину и высоту ресурса изображения с помощью функций imagesx() и imagesy().

Другая функция, называемая getimagesize(), также может использоваться для получения ширины и высоты изображения вместе с его типом. Эта функция возвращает массив с элементами, определяющими ширину, высоту и формат изображения. Первые два элемента массива описывают ширину и высоту, а третий элемент содержит константу, определяющую формат файла: один из IMAGETYPE_PNG, IMAGETYPE_GIF и т.д.

Сохранение изображения

После того, как вы внесете все необходимые изменения в изображение, вы, скорее всего, захотите либо вывести его в браузер, либо сохранить его как файл. В любом случае вам придется использовать одну из функций вывода GD, таких как imagejepg(), imagepng() или imagegif(). Вы передадите свой ресурс изображения одной из этих функций вывода, и если вы хотите сохранить изображение в файл, вы также укажете имя файла. Вы также можете управлять качеством выходного изображения с помощью третьего необязательного параметра в зависимости от типа изображения.

Изменение размера всех изображений в каталоге

Давайте применим на практике полученные нами знания, чтобы сделать что-нибудь. В этом разделе мы изменим размер всех изображений JPEG в определенном каталоге на ширину 640 пикселей. Высота будет рассчитываться автоматически в зависимости от размеров исходного изображения.

Мы сохраним измененные изображения в новой папке под названием Resized. Все исходные изображения в этом случае имеют одинаковые размеры, но код будет работать правильно и с изображениями, имеющими разные размеры и пропорции.

В приведенном выше коде мы начнем с использования функции glob(), чтобы найти все изображения с расширением .jpg в каталоге под названием Nature. Файлы изображений хранятся в массиве, и мы поочередно перебираем их.

Поскольку все изображения, которые мы хотим изменить, являются JPEG, мы используем функцию imagecreatefromjpeg(), чтобы загрузить их в скрипт. Затем используется функция imagescale() для изменения размера изображения до определенной ширины - 640 пикселей в нашем случае. Мы не указали фиксированную высоту, чтобы высота была рассчитана автоматически.

К каждому из исходных файлов изображений было добавлено -1920x1080 к их имени файла, чтобы указать его размеры. Мы используем str_replace() в исходном имени файла и заменяем -1920X1080 на новый размер изображения.

Наконец, мы сохраняем измененные изображения в папке с именем Resize с новыми именами файлов. Вы также можете передать третий параметр функции imagejpeg(), чтобы установить качество сохраненного файла изображения. Если третий параметр опущен, изображения сохраняются с качеством по умолчанию 75.

Применение оттенков серого и контрастных фильтров для каждого изображения в каталоге

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

Как вы можете видеть, мы загружаем изображения из каталога Nature так же, как и в предыдущем примере. Однако на этот раз мы будем использовать функцию imagefilter() для применения фильтров на загруженном ресурсе изображения.

Обратите внимание, что imagefilter() изменяет исходное изображение и возвращает TRUE или FALSE в зависимости от успеха или провала операции. Это отличается от функции imagescale(), которую мы использовали в предыдущем разделе, которая вернула масштабированный ресурс изображения.

Еще одна важная вещь, которую следует иметь в виду, заключается в том, что контрастный фильтр принимает значения от -100 до 100. Отрицательные значения подразумевают большую контрастность, а положительные значения означают меньший контраст. Это противоположно тому, что могут ожидать некоторые люди! Значение 0 оставляет изображение неизменным.

С другой стороны, фильтр яркости имеет минимальный и максимальный пределы -255 и 255. Отрицательное значение в этом случае подразумевает минимальную яркость, а положительное значение означает максимальную яркость.

Мы получаем имя файла из пути файла, используя функцию basename(), а затем сохраняем изображение с помощью функции imagejpeg().

Заключительные мысли

Цель этого урока состояла в том, чтобы познакомить вас с библиотекой GD на PHP и узнать, как использовать все ее функции, чтобы сделать вашу жизнь проще. Вы можете использовать примеры в конце урока в качестве руководства для написания собственных скриптов работы с изображениями. Например, вы можете изменить размер изображения только в том случае, если оно больше заданного предела, определяя его ширину с помощью функции imagesx().

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

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.