Класс работы с изображениями 

Класс работы с изображениями CodeIgniter позволяет выполнять следующие действия:

  • Изменять размеры изображения
  • Создавать эскизы
  • Обрезать изображения
  • Вращать изображения
  • Создавать водяные знаки

Поддерживаются все три основные графические библиотеки: GD/GD2, NetPBM и ImageMagick

Примечание

Создавать водяные знаки можно только с помощью GD/GD2 библиотеки. Хотя другие библиотеки также могут это делать, GD используется для расчета свойств изображения. Обрабатываться изображения будут библиотекой которой вы укажите.

Инициализация класса 

Как и большинство других классов CodeIgniter, класс изображений инициализируется в контроллере с помощью $this->load->library функции:

$this->load->library('image_lib');

Как только библиотека загружена, она готова к использованию. Объект библиотеки изображений, который вы будете использовать для вызова функций: $this->image_lib

Обработка изображения 

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

$config['image_library'] = 'gd2';
$config['source_image'] = '/path/to/image/mypic.jpg';
$config['create_thumb'] = TRUE;
$config['maintain_ratio'] = TRUE;
$config['width']         = 75;
$config['height']       = 50;

$this->load->library('image_lib', $config);

$this->image_lib->resize();

Код выше, сообщает функции image_resize искать изображение с именем mypic.jpg расположенное в source_image папке, затем создать эскизы размером 75 X 50 пикселов используя GD2 image_library. Поскольку maintain_ratio опция включена, эскиз будет создан как можно ближе к указаным width(ширине) и height(высоте) при сохранении соотношения сторон. Эскиз будет назван mypic_thumb.jpg

Примечание

Для того чтобы класс изображений мог делать указанную обработку, папка содержащая файлы изображений должны иметь разрешения на запись.

Примечание

Обработка изображений может использовать значительный объем памяти сервера для выполнения некоторых операций. Если у вас возникли ошибки нехватки памяти при обработке изображений, вы может ограничить их максимальный размер и/или изменить лимиты памяти PHP.

Методы Обработки 

Есть четыре доступные метода обработки:

  • $this->image_lib->resize()
  • $this->image_lib->crop()
  • $this->image_lib->rotate()
  • $this->image_lib->watermark()

Эти методы возвращают булево TRUE при успешной операции и FALSE если нет. Если завершить методы не удалось, вы можете получить сообщение об ошибке с помощью этой функции:

echo $this->image_lib->display_errors();

Хорошей практикой является использование функции обработки, показывающей ошибку при неудаче, например такой:

if ( ! $this->image_lib->resize())
{
        echo $this->image_lib->display_errors();
}

Примечание

При желании вы можете указать HTML формат для ошибок, указывая теги открытия/закрытия в функции как эта:

$this->image_lib->display_errors('<p>', '</p>');

Предпочтения 

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

Обратите внимание, что все настройки доступны не для каждой функции. Например, настройки ось x и y доступны только для обрезки изображений. Кроме того, предпочтения ширины и высоты не оказывают никакого влияния на обрезку. Столбец “доступность” указывает, какие функции поддерживают предпочтения.

Availability Legend:

  • R - Изменение размера изображения
  • C - Обрезка изображений
  • X - Вращение изображений
  • W - Водяные знаки
Предпочтение Значение по умолчанию Варианты Описание Доступность
image_library GD2 GD, GD2, ImageMagick, NetPBM Устанавливает библиотеку для работы с изображениями. R, C, X, W
library_path Нет Нет Устанавливает серверный путь к ImageMagick или NetPBM библиотекам. Если вы пользуетесь этими библиотеками, необходимо указать путь. R, C, X R, C, S, W
source_image Нет Нет Устанавливает источник изображения имя/путь. Путь должен быть относительный или абсолютным, не URL.  
dynamic_output FALSE TRUE/FALSE (булево) Определяет, будет ли новый файл изображения записан на диск или будет генерироваться динамически. Примечание: Если вы выберите динамический параметр, одновременно может быть показано только одно изображение, и оно не может быть позиционированно на странице. Он просто выводит поток изображения в браузере, наряду с заголовками изображений. R, C, X, W
file_permissions 0644 (число) Права доступа для файловой системы на файл образа, записываемого на диск. ВНИМАНИЕ: Использовать целое восьмеричное числовое обозначение! R, C, X, W
quality 90% 1 - 100% Устанавливает качество изображения. Чем выше качество, тем больше размер файла. R, C, X, W
new_image Нет Нет Устанавливает путь назначения для изображения имя/путь. Эта настройка используется при создании копии изображения. Путь должен быть относительный или абсолютный, не URL. R, C, X, W
width Нет Нет Устанавливает ширину изображения. R, C
height Нет Нет Устанавливает высоту изображения. R, C
create_thumb FALSE TRUE/FALSE (булево) Сообщает функции обработки изображения создавать ли эскизы. R
thumb_marker _thumb Нет Указывает индикатор эскиза. Он будет вставлен непосредственно перед расширением, например mypic.jpg превратиться в mypic_thumb.jpg R
maintain_ratio TRUE TRUE/FALSE (булево) Указывает, следует ли использовать соотношение сторон при изменении размера или использовать жесткие значения. R, C
master_dim auto auto (авто), width (ширина), height (высота) Указывает, какую ось использовать основной при изменении размера или создания эскиза. Например, пусть вы хотите изменить размер изображения до 100 X 75 пикселов. Если исходный размер изображения не позволяет совершенное изменение размера до указанных, этот параметр определяет, какая ось должна быть использована в качестве жесткого значения. Параметр “auto” устанавливает ось автоматически в зависимости от соотношения сторон (изображение выше или шире, или наоборот). R
rotation_angle Нет 90, 180, 270, vrt, hor Задает угол поворота при вращении изображений. Обратите внимание, что PHP вращает против часовой стрелки, поэтому поворот в 90 градусов направо, должен быть указан как 270. X
x_axis Нет Нет Устанавливает X координаты в пикселях для обрезки изображений. Папример, значение 30 будет обрезать изображение в 30 пикселов от левого края. C
y_axis Нет Нет Устанавливает Y координаты в пикселях для обрезки изображений. Папример, значение 30 будет обрезать изображение в 30 пикселов от верхнего края. C

Настройка параметров в файле конфигурации 

Если вы не хотите устанавливать параметры с помощью описанного выше метода, то можете положить их в конфигурационный файл. Просто создайте новый файл с названием image_lib.php и добавьте массив $config в этот файл. Затем сохраните файл в config/image_lib.php и он будет использоваться автоматически. Вам НЕ НУЖНО будет использовать $this->image_lib->initialize() метод, если вы сохраните настройки в конфигурационном файле.

Водяные знаки 

Наложение водяных знаков требует GD/GD2 библиотеку.

Два типа водяных знаков 

Существует два типа водяных знаков, которые можно использовать:

  • ТЕКСТ: Водяной знак будет создаваться с помощью текста, указанным Вами шрифтом "True Type" или через родной текстовый вывод библиотеки GD. При использовании True Type, версия GD должна быть совместима с используемой True Type (в большинстве случаев).
  • НАЛОЖЕНИЕ: Водяной знак будет создаваться путем наложения изоюражения (обычно прозрачный PNG или GIF) содержащий водяной знак.

Наложение водяных знаков на изображения 

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

$config['source_image'] = '/path/to/image/mypic.jpg';
$config['wm_text'] = 'Copyright 2006 - John Doe';
$config['wm_type'] = 'text';
$config['wm_font_path'] = './system/fonts/texb.ttf';
$config['wm_font_size'] = '16';
$config['wm_font_color'] = 'ffffff';
$config['wm_vrt_alignment'] = 'bottom';
$config['wm_hor_alignment'] = 'center';
$config['wm_padding'] = '20';

$this->image_lib->initialize($config);

$this->image_lib->watermark();

Приведенный выше пример будет использовать 16 пиксельный шрифт True Type, чтобы создать текст “Copyright 2006 - John Doe”. Водяной знак будет располагаться внизу по центру изображения, с отступом в 20 пикселов от нижней части изображения.

Примечание

Для того чтобы класс изображений мог делать любые обработки, файл изображения должен иметь права на “запись” - 777 (например).

Настройки водяных знаков 

В данной таблице приведены настройки, доступные для обоих типов водяных знаков (текст/наложение)

Предпочтение Значение по умолчанию Варианты Описание
wm_type text text, overlay Установка типа водяных знаков, которые должны использоваться.
source_image Нет Нет Устанавливает источник изображения имя/путь. Путь должен быть относительный или абсолютный, не URL.
dynamic_output FALSE TRUE/FALSE (булево) Определяет, будет ли новый графический файл записан на диск или сгенерирован динамически. Примечание: Если вы выберите динамический параметр, одновременно может быть показано только одно изображение, и оно не может быть позиционированно на странице. Он просто выводит поток изображения в браузере, наряду с заголовками изображений.
quality 90% 1 - 100% Устанавливает качество изображения. Чем выше качество, тем больше Размер файла.
wm_padding Нет Число Отступы в пикселях, которыу будут применены к водяному знаку, для размещения его от краёв изображения.
wm_vrt_alignment bottom top (верх), middle (середина), bottom (низ) Устанавливает вертикальное выравнивание для водяного знака.
wm_hor_alignment center left (лево), center(центр), right (право) Задает выравнивание по горизонтали для водяного знака.
wm_hor_offset Нет Нет Вы можете указать горизонтальное смещение (в пикселях), чтобы применить для позиционирования водяного знака. Смещение обычно перемещает водяные знаки справа, за исключением случаев, когда установлено пользовательское выравнивание “право”, тогда значение смещения будет перемещать водяной знак по направлению к левой части изображения.
wm_vrt_offset Нет Нет Вы можете указать вертикальное смещение (в пикселях), чтобы применить для позиционирования водяного знака. Смещение обычно перемещает водяной знак вниз, за исключением случаев, когда установлено пользовательское выравнивание “низ”, тогда значение смещения будет перемещать водяной знак по направлению к верхней части изображения.

Настройки текста 

В данной таблице приведены настройки, доступные для текстового типа водяных знаков.

Предпочтение Значение по умолчанию Варианты Описание
wm_text Нет Нет Текст который будет показан в качестве водяного знака. Обычно это уведомление об авторских правах.
wm_font_path Нет Нет Серверный путь к шрифту True Type, который вы хотели бы использовать. Если не использовать эту опцию, родной шрифт GD будет использован.
wm_font_size 16 Нет Размер текста. Примечание: Если Вы не используете опцию True Type, число задается с помощью ряда 1 - 5. Иначе, можете использовать любой допустимый размер в пикселах для шрифта, который вы используете.
wm_font_color ffffff Нет Цвет шрифта, указанного в hex. Доступны оба метода: полный - где длина 6 символов (т.е. 993300) и короткий - где длина 3 символа (ie, fff).
wm_shadow_color Нет Нет Цвет тени, указанного в hex. Если вы оставите это поле пустым, тени не будут использоваться. Доступны оба метода: полный - где длина 6 символов (т.е. 993300) и короткий - где длина 3 символа (ie, fff).
wm_shadow_distance 3 Нет Расстояние (в пикселях) от шрифта, где должна быть тень.

Настройки наложения 

В данной таблице приведены параметры, доступные для способа наложения водяных знаков.

Предпочтения Значение по умолчанию Варианты Описание
wm_overlay_path Нет Нет Серверный путь к изображению, которое вы хотите использовать в качестве водяного знака. Требуется только если вы используете метод наложения.
wm_opacity 50 1 - 100 Прозрачность изображения. Вы можете указать прозрачность водяного знака. Это позволяет водяному знаку не полностью скрывать детали исходного изображения под ним. Обычно используют значение 50%.
wm_x_transp 4 Число Если изображение водяного знака PNG или GIF, вы можете указать тональность изображения, чтобы сделать его “прозрачным”. Этот параметр (наряду со следующим) позволит указать тональность. Это работает путем указания “X” и “Y” координат в пикселях (измеряется от верхнего левого угла) в пределах изображения, где должна быть прозрачная область.
wm_y_transp 4 Число Наряду с предыдущей настройкой, позволяет указать координаты в пикселях для прозрачной области.

Настройки класса 

class CI_Image_lib 
initialize([$props = array()]) 
Параметры:
  • $props (массив) – Обработка предпочтений изображения
Возвращает:

TRUE при успехе, FALSE в случае недопустимых параметров

Возвращаемый тип:

булево

Инициализирует класс для обработки изображений.

resize() 
Возвращает:TRUE при успехе, FALSE в случае неудачи
Возвращаемый тип:булево

Метод изменения размера изображения позволяет изменять размеры исходного изображения, создавать копию (с или без изменения размеров) или создать миниатюру/эскиз изображения.

Для практических целей нет разницы между созданием копии и миниатюры, за исключением того, что эскиз будет обладать маркером как часть имени (т.е. mypic_thumb.jpg).

Все настройки доступные для этого метода, кроме этих трех: rotation_angle, x_axis и y_axis, перечислены в таблице предпочтения.

Создание эскизов

Метод изменения размеров создает файл эскиза (и сохраняет оригинал) если установить эту настройку в TRUE:

$config['create_thumb'] = TRUE;

Это одиночное предпочтение определяет будет ли создан эскиз или нет.

Создание копии

Этот метод изменения размера создаст копию файла изображения (и сохранит оригинал) если вы зададите путь и/или новое имя файла с использованием этого предочтения:

$config['new_image'] = '/path/to/new_image.jpg';

Примечания касающиеся этого предпочтения:

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

Изменение размера исходного изображения

Если ни одно из двух предпочтений, перечисленных выше (create_thumb и new_image) не используются, то метод изменения размеров будет обработки исходное изображение.

crop() 
Возвращает:TRUE при успехе, FALSE в случае неудачи
Возвращаемый тип:булево

Метод обрезки работает почти идентично функции изменения размера, кроме необходимости установить настройки для осей X и Y (в пикселях), определяющей область для обрезания:

$config['x_axis'] = 100;
$config['y_axis'] = 40;

Все настройки, кроме этих трех: rotation_angle, create_thumb and new_image, перечислены в таблице предпочтений.

Вот пример, показывающий, как можно обрезать изображение:

$config['image_library'] = 'imagemagick';
$config['library_path'] = '/usr/X11R6/bin/';
$config['source_image'] = '/path/to/image/mypic.jpg';
$config['x_axis'] = 100;
$config['y_axis'] = 60;

$this->image_lib->initialize($config);

if ( ! $this->image_lib->crop())
{
        echo $this->image_lib->display_errors();
}

Примечание

Без визуального интерфейса трудно обрезать изображения, так что этот метод не очень полезен, если вы не намерены создать такой интерфейс. Что мы и сделали для модуля фотогалереи в ExpressionEngine, в CMS, которую мы разрабатываем. Мы добавили JavaScript для пользовательского интерфейса, что позволяет выбрать области обрезки.

rotate() 
Возвращает:TRUE при успехе, FALSE в случае неудачи
Возвращаемый тип:булево

Метод вращения изображения требует, чтобы угол поворота устанавливался через его предпочтения:

$config['rotation_angle'] = '90';

Доступно 5 вариантов вращения:

  1. 90 - вращает против часовой стрелки на 90 градусов.
  2. 180 - вращает против часовой стрелки на 180 градусов.
  3. 270 - вращает против часовой стрелки на 270 градусов.
  4. hor - зеркальное отражение изображения относительно горизонтали.
  5. vrt - зеркальное отражение изображения относительно вертикали.

Вот пример, показывающий, как можно повернуть изображение:

$config['image_library'] = 'netpbm';
$config['library_path'] = '/usr/bin/';
$config['source_image'] = '/path/to/image/mypic.jpg';
$config['rotation_angle'] = 'hor';

$this->image_lib->initialize($config);

if ( ! $this->image_lib->rotate())
{
        echo $this->image_lib->display_errors();
}
watermark() 
Возвращает:TRUE при успехе, FALSE в случае неудачи
Возвращаемый тип:булево

Создает водяные знаки на изображении, пожалуйста, обратитесь к разделу водяные знаки для более подробной информации.

clear() 
Возвращаемый тип:смешанный

Метод Clear сбрасывает все значения, используемые при обработке изображения. Его следует использовать при обработке изображений в цикле.

$this->image_lib->clear();
display_errors([$open = '<p>[, $close = '</p>']]) 
Параметры:
  • $open (строка) – Тег открытия сообщение об ошибке
  • $close (строка) – Тег закрытия сообщение об ошибке
Возвращает:

Сообщения об ошибках

Возвращаемый тип:

строка

Возвращает все найденные ошибки в формате строки.

echo $this->image_lib->diplay_errors();