Polls

Escribirías en el wiki de codepixel?
 

Login Form






Lost Password?
No account yet? Register

Wiki Codepixel

Visita el Wiki de programación gráfica de codepixel . Podrás incluir los enlaces que creas interesantes para desarrollar videojuegos, motores de render, demos, etc.

Quién está online?

We have 15 guests online

Syndicate

Inicio
La utilidad del PNG para los programadores PDF Print E-mail
Written by Javier Loureiro   
Tuesday, 17 November 2009

Este tutorial os muestra cómo cargar imágenes PNG de forma sencilla. El formato PNG aparece como substituto del GIF, que estuvo muchio tiempo protegido por una patente, por lo que se optó por hacer un formato abierto para las imágenes que se envían en internet.

La comrpesión de PNG utiliza el algoritmo "deflate", el mismo que utiliza el gzip, que no es siempre el más eficiente, pero al menos no tiene problemas de patentes. Es un sistema de compresion que no tiene pérdidas, por lo que se puede abrir un png, grabarlo, abrirlo, grabarlo, etc muchas veces y los valores de los píxeles se mantienen intactos. Al contrario que el jpeg, que va degradando calidad en cada compresión.

Una característica realmente interesante para un programador es la variedad de formatos de pixel que png almacena. Guarda valores en 8 y 16 bits. Los 16 bits son importantes si vamos a hacer muchas operaciones de composición, ya que el redondeo progresivo nos genera bandas de colores uniformes, al ir despreciando decimales. No he probado si el formato 16 bits es compatible con los formatos 16 bits de las GPU´s. Pero si nos vamos al ahorro. PNG soporta formatos "packed", donde por ejemplo, podemos especificar imágenes de 1 bit por pixel. De tal forma que 1 byte, representa el valor de 8 píxeles (muy útil para máscaras).

 

La librería incluye formas automáticas de conversión. Permite leer las imágenes en 8 bits, aunque estén en 16 bits, o descartar los valores alpha. Todo esto se hace en la lectura, lo cual nos ahorra código, memoria, y tiempo de ejecución.

 

Un tema que a mí me interesa especialmente es la gestión de color. La cabecera PNG permite especificar valores del espacio de color (incluso embeber un perfil de color completo, pero es muy complicado de leer). Tiene un campo gamma que os permite transformar los valores de los píxeles a lineal. De esta forma, podréis saber si la textura es una imágen con el gamma aplicado (que es lo normal), y hacer la inversa para tener los valores en lineal. De esta forma, podréis operar con ellos sin tener problemas con las transparencias. Pero si teneis una imagen que no tiene gamma (por ejemplo, una textura que uséis de parámetro para un shader), podeis leer la cabecera del png, y no realizar esta conversión. Al elevar un valor a su gamma, y realizar despues el inverso, perdemos mucha precisión (especialmente si trabajamos en 8bits), y este paso nos lo podemos ahorrar si tenemos la imagen en lineal. 

 

Otro aspecto importante del formato PNG es la posibilidad de meter texto. Pocos programas lo soportan, pero podéis usar la librería para "marcar" texturas, dependiendo del uso que le váis a dar, de esta forma, vuestro motor puede operar de forma distinta en función de lo esté escrito en la cabecera. Por ejemplo, podéis enviar la textura al canal especular, o indicar que no queréis que genere mipmaps en la carga. Las posibilidades son enormes.

 

 

Comentarios
AgregarnuevoBuscar
- Ruben Penalva - web de libPNG     | 193.34.187.xxx | 2009-11-17 15:44:40
Para los que no vayan a pinchar en el tutorial. Usa la libreria libPNG. La podeis descargar de aqui: http://www.libpng.org/pub/png/libpng.html

Como bien dice el tutorial, si quereis cargar imagenes sin complicaros mucho la vida podeis usar devIL: http://openil.sourceforge.net/
winden   | 213.155.151.xxx | 2009-11-17 17:53:34
El formato de 16 bits no es de coma flotante sino de coma fija.
- mk - article     | 92.113.87.xxx | 2009-12-08 08:34:09
I found this article to be very informative. Thanks for sharing, but i have one question: what about punctuation and special characters in alt. and title deions? can you use any of the following? @ | , . ?
Escribir comentario
Nombre:
Email:
 
Website:
Título:
Código UBB:
[b] [i] [u] [url] [quote] [code] [img] 
 
Security Image
Por favor introduce el codigo anti-spam que puedes leer en la imagen.

Copyright (C) 2007 Alain Georgette / Copyright (C) 2006 Frantisek Hliva. All rights reserved.



menéameDigg!Del.icio.us!Google!Technorati!Yahoo!
 
Next >

Lista de Correo

visita la lista de correo de codepixel. Es una lista abierta, asi que podrás subscribirte y preguntar tus dudas de programación, compartir tus opiniones, aportar ideas, y formar parte de la comunidad codepixelera.

 

Visita la antigua página

Image