CodeIgniter User Guide Version 1.6.1

Clase de Manipulación de Imagen

La clase de Manipulación de Imagen de CodeIgniter le permite realizar las siguientes acciones:

Todas las tres librerías de imágenes principales son soportadas: GD/GD2, NetPBM, e ImageMagick

Nota: Marca de Agua sólo está disponible usando la librería GD/GD2. Además, aunque las otras librerías son soportadas, GD es requerida para que el programa calcule las propiedades de la imagen. El procesamiento de la imagen, sin embargo, será realizado con la librería que haya especificado.

Inicializando la Clase

Como la mayoría de las otras clases en CodeIgniter, la clase de imagen es inicializada en su controlador usando la función $this->load->library:

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

Una vez que la librería es cargada estará lista para el uso. El objeto de la librería de imagen que usará para llamar todas las funciones es: $this->image_lib

Procesando una Imagen

Sin importar el tipo de procesamiento que quiera realizar (redimencionar, recortar, rotar o marca de agua), el proceso general es idéntico. Establecerá algunas preferencias correspondientes a la acción que tenga intenciones de realizar, entonces llamará a una de las cuatro funciones de procesamiento disponibles. Por ejemplo, para crear un thumbnail de una imagen hará esto:

$config['image_library'] = 'GD';
$config['source_image'] = '/ruta/a/imagen/mifoto.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();

El código anterior le dice a la función image_resize que busque por una imagen llamada mifoto.jpg ubicada en la carpeta source_image, entonces cree un thumbnail que sea de 75 X 50 pixeles usando la image_library GD2. Ya que la opción maintain_ratio está habilitada, el thumb será tan cercano al width y height de destino como sea posible mientras preserve la proporción del aspecto original. El thumbnail será llamado mifoto_thumb.jpg

Nota: Para que la clase de imagen pueda hacer algún procesamiento, la carpeta contenedora de los archivos de imagen debe tener permisos de 777.

Funciones de Procesamiento

Hay cuatro funciones de procesamiento:

Estas funciones devuelve un buleano TRUE si funcionan y FALSE si fallan. Si fallan puede recuperar el mensaje de error usando esta función:

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

Una buena costumbre es usar la función de procesamiento condicionalmente, mostrando un error cuando falla, así:

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

Nota: Puede opcionalmente especificar el formato HTML a ser aplicado a los errores, enviando las etiquetas de apertura/clausura en la función, así:

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

Preferencias

Las 14 preferencias disponibles son descritas debajo permitiendole utilizar el procesamiento de imagenes de forma tal que se adecue a sus necesidades.

Note que no todas las preferencias están disponibles para cada función. Por ejemplo, las preferencias de hachas x/y sólo están disponibles para recortar imagen. De la misma manera, Las preferencias de ancho y alto no tienen efecto al recortar. La columna "disponibilidad" indica que función soporta una preferencia determinada.

Leyendas Disponibles:

Preferencia Valor por Defecto Opciones Descripción Disponibilidad
image_library GD2 GD, GD2, ImageMagick, NetPBM Establece la librería de imagen a ser usada. R, C, X, W
library_path Ninguna Ninguna Establece la ruta del servidor a su librería ImageMagick o NetPBM. Si usa una de estas librerías debe suministrar la ruta. R, C, X
source_image Ninguna Ninguna Establece el nombre/ruta de la imagen de origen. La ruta debe ser una ruta relativa o absoluta del servidor, no una URL. R, C, S, W
dynamic_output FALSE TRUE/FALSE (buleano) Determina si el nuevo archivo de imagen debe ser escrito a disco o generado dinámicamente. Nota: Si elije la configuración dinámica, sólo una imagen puede ser mostrada a la vez, y no puede ser posicionada en la página. Simplemente muestra la imagen dinámicamente a su explorador, junto con los encabezados de imagen. R, C, X, W
quality 90% 1 - 100% Establece la calidad de la imagen. Mayor calidad implica mayor tamaño del archivo. R, C, X, W
new_image Ninguna Ninguna Establece el nombre/ruta de destino de la imagen. Usará esta preferencia cuando cree una copia de una imagen. La ruta debe ser una ruta relativa o absoluta del servidor, no una URL. R, C, X, W
width Ninguna Ninguna Establece el ancho que quiere establecerle a la imagen. R, C
height Ninguna Ninguna Establece el alto que quiere establecerle a la imagen. R, C
create_thumb FALSE TRUE/FALSE (boolean) Le dice a la función de procesamiento de imagen que cree un thumb. R
thumb_marker _thumb Ninguna Especifica el indicador de thumbnail. Será insertado justo antes de la extensión del archivom así que mifoto.jpg será mifoto_thumb.jpg R
maintain_ratio TRUE TRUE/FALSE (boolean) Especifica si mantener la proporción del aspecto original cuando redimensiona o usar valores duros. R
master_dim auto auto, width, height Especifica que usar como la hacha maestra cuando redimensiona o crea thumbs. Por ejemplo, digamos que quiere redimensionar una imagen a 100 X 75 pixeles. Si su imagen de origen no permite redimensionamiento perfecto a esas dimensiones, esta configuración determina que hacha debe ser usada como valor duro. "auto" establece el hacha automáticamente basado en si la imagen es más alta que ancha o viceversa. R
rotation_angle Ninguna 90, 180, 270, vrt, hor Especifica el ángulo de rotación cuando se rotan imagenes. Note que PHP rota contra las agujas del reloj, así que una rotación de 90 grados a la derecha debe ser especificada como 270. X
x_axis Ninguna Ninguna Establece la cordenada X en pixeles para recortar una imagen. Por ejemplo, una configuración de 30 cortará una imagen 30 pixeles desde la izquierda. C
y_axis Ninguna Ninguna Establece la cordenada X en pixeles para recortar una imagen. Por ejemplo, una configuración de 30 cortará una imagen 30 pixeles desde arriba. C

Estableciendo preferencias en un archivo de configuración

Si prefiere no establecer preferencias usando los métodos anteriores, puede en su lugar ponerlos en un archivo de configuración. Simplemente cree un nuevo archivo llamado image_lib.php y el arreglo $config en ese archivo. Entonces guarde el archivo en: config/image_lib.php y será usado automáticamente. NO necesitará usar la función $this->image_lib->initialize si guarda sus preferencias en un archivo de configuración.

$this->image_lib->resize()

La función de redimensión de imagen le permite redimensionar la imagen original, crear una copia (con o sin redimensión), o crear una imagen thumbnail.

Por propósitos prácticos no hay diferencia entre crear una copia y crear un thumbnail excepto que un thumb tendrá el marcador thumbnail como parte de su nombre (por ejemplo, mifoto_thumb.jpg).

Todas las preferencias listadas en la tabla anterior están disponibles por esta función excepto estas tres: rotation, x_axis, and y_axis.

Creando un Thumbnail

La función de redimensión creará un archivo thumbnail (y preserva el original) si establece esta preferencia como TRUE:

$config['create_thumb'] = TRUE;

Esta preferencia sólo determina un thumbnail es creado o no.

Creando una Copia

La función de redimensión creará una copia del archivo de imagen (y preservará el original) su establece una ruta y/o un nuevo nombre de archivo usando esta preferencia:

$config['new_image'] = '/ruta/a/nueva_imagen.jpg';

Nota acerca de esta preferencia:

Redimensionando la Imagen Original

Si ninguno de las dos preferencias listadas arriba (create_thumb, y new_image) son usadas, la función de redimensión usará la imagen original como destino de procesamiento.

$this->image_lib->crop()

La función de recortar funciona casi idénticamente a la función de redimensión excepto que requiere que establezca preferencias para las hachas X e Y (en pixeles) especificando donde cortar, así:

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

Todas las preferencias listadas en la tabla anterior están disponibles excepto estas: rotation, width, height, create_thumb, new_image.

Aquí hay un ejemplo mostrando como puede recortar una imagen:

$config['image_library'] = 'imagemagick';
$config['library_path'] = '/usr/X11R6/bin/';
$config['source_image'] = '/ruta/a/imagen/mifoto.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();
}

Nota: Sin una interface visual es difícil recortar imagenes, así que esta función no es muy útil a menos que tenga intenciones de construir dicha interface. Esto es exactamente lo que hicimos para el módulo de galería de fotos en ExpressionEngine, el CMS que desarrollamos. Agregamos una Interface de Usuario que permite que el area a recortar sea seleccionada.

$this->image_lib->rotate()

La función de rotación de imagen requiere que el ángulo de rotación sea establecido a través de esta preferencia:

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

Hay 5 opciones de rotación:

  1. 90 - rota 90 grados contra las agujas del reloj.
  2. 180 - rota 180 grados contra las agujas del reloj.
  3. 270 - rota 270 grados contra las agujas del reloj..
  4. hor - Voltea la imagen horizontalmente.
  5. vrt - Voltea la imagen verticalmente.

Aquí hay un ejemplo mostrando como puede rotar una imagen:

$config['image_library'] = 'netpbm';
$config['library_path'] = '/usr/bin/';
$config['source_image'] = '/ruta/a/imagen/mifoto.jpg';
$config['rotation_angle'] = 'hor';

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

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

$this->image_lib->clear()

La función "clear" restablece todos los valores por defecto usados cuando se procesa una imagen. Usted podría querer llamarla si está procesando imágenes en un ciclo.

$this->image_lib->clear();

 

Marca de Agua

La característica Marca de Agua requiere la librería GD/GD2.

Dos tipos de Marca de Agua

Hay dos tipos de marca de agua que puede usar:

Marca de agua en una imagen

Al igual que con la otra funciones el procesamiento general para marca de agua involucra establecer las preferencias correspondientes a la acción que intente realizar, entonces llamar a la función "watermark". Aquí hay un ejemplo:

$config['source_image'] = '/ruta/a/imagen/mifoto.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();

El ejemplo anterior usará una fuente de 16 píxeles para crear el texto "Copyright 2006 - John Doe". La marca de agua será posicionada abajo/al centro de la imagen, 20 píxeles desde el fondo de la imagen.

Nota: Para que la clase de imagen pueda hacer cualquier procesamiento, el archivo de imagen debe tener permisos de 777.

Preferencias de Marca de Agua

Esta tabla muestra las preferencias que están disponibles para ambos tipos de marcas de agua (texto o revestimiento)

Preferencia Valor por defecto Opciones Descripción
wm_type text type, overlay Establece el tipo de marca de agua que debe ser usado.
source_image Ninguna Ninguna Establece el nombre/ruta de la imagen de origen. La ruta debe ser relativa o una ruta absoluta del servidor, no una URL.
dynamic_output FALSE TRUE/FALSE (boolean) Determina si el nuevo archivo de imagen debe ser escrito a disco o generado dinámicamente. Nota: Si elije la configuración dinámica, sólo una imagen puede ser mostrada a la vez, y no puede ser posicionada en la página. Simplemente muestra la imagen dinámicamente a su explorador, junto con los encabezados de imagen.
quality 90% 1 - 100% Establece la calidad de la imagen. Mientras más alta sea la calidad, mayor será el tamaño del archivo.
padding Ninguna Un número La cantidad de espaciado, establecido en píxeles, que serán aplicados a la marca de agua para establecer la distancia desde el borde de sus imágenes.
wm_vrt_alignment bottom top, middle, bottom Establece el alineamiento vertical para la marca de agua de la imagen.
wm_hor_alignment center left, center, right Establece el alineamiento horizontal para la marca de agua de la imagen.
wm_vrt_offset Ninguna Ninguna Puede especificar un punto de comienzo vertical (en pixeles) para aplicar a la posición de la marca de agua. El punto normalmente mueve la marca de agua hacia abajo, excepto que haya establecido alineamiento como "down" (abajo) entonces el valor de comienzo moverá la marca de agua hacia arriba en la imagen.
wm_hor_offset Ninguna Ninguna Puede especificar un punto de comienzo horizontal (en pixeles) para aplicar a la posición de la marca de agua. El punto normalmente mueve la marca de agua a la derecha, excepto que haya establecido alineamiento como "right" (a la derecha) entonces el valor de comienzo moverá la marca de agua a la izquierda de la imagen.

Preferencia de Texto

Esta tabla muestra las preferencias que están disponibles para el tipo de texto de la marca de agua.

Preferencia Valor por defecto Opciones Descripción
wm_text Ninguna Ninguna El texto que quiere mostrar como marca de agua. Típicamente este será una nota de derechos registrados.
wm_font_path Ninguna Ninguna La ruta del servidor a la fuente True Type que quiera usar. Si no usa esta opción, la fuente nativa de la GD será usada.
wm_font_size 16 Ninguna El tamaño del texto. Nota: si no está usando la opción True Type anterior, el número es establecido usando un rango de 1 - 5. De otra forma, puede usar cualquier tamaño de pixel válido para la guente que está usando.
wm_font_color ffffff Ninguna El color de la fuente, especificada en hexadecimal. Nota, debe usar los 6 caracteres de valor hexadecimal completos (por ejemplo, 993300), en vez de la versión abreviada de tres caracteres (por ejemplo, fff).
wm_shadow_color Ninguna Ninguna el color de la sombra, especificada en hexadecimal. Si deja esta opción vacía, no se usará sombra. Nota, debe usar los 6 caracteres de valor hexadecimal completos (por ejemplo, 993300), en vez de la versión abreviada de tres caracteres (por ejemplo, fff).
wm_shadow_distance 3 Ninguna La distancia (en pixeles) desde la fuente a la que la sombra debe aparecer.

Preferencias de Revestimiento

Esta tabla muestra las preferencias que están disponibles para el tipo de revestimiento de la marca de agua.

Preferencia Valor por defecto Opciones Descripción
wm_overlay_path Ninguna Ninguna La ruta del servidor a la imagen que quiere usar como marca de agua. Requerido sólo si usa el método de revestimiento.
wm_opacity 50 1 - 100 Opacidad de la imagen. Puede especificar la opacidad (por ejemplo, transparencia) de su imagen de marca de agua. Esto permite a la marca de agua ser débil y no oscurecer completamente los detalles de la imagen detrñas de ella. Una opacidad del 50% es típica.
wm_x_transp 4 Un número Si su imagen de marca de agua es una imagen PNG o GIF, puede especificar un color a la imagen a ser "transparente". Esta opción (junto con la próxima) le permitirá especificar ese color. Esto funciona expecificando la coordenada de pixel "X" e "Y" (medida desde arriba a la izquierda) dentro de la imagen que corresponde a un pixel representativo del color que quiere transparentar.
wm_y_transp 4 Un número Junto con la opción anterior, esto le permite especificar la coordenada a un pixel representativo del color que quiere transparentar.