LeichtgewichtLeichtgewicht

2009/05/02 – 01:55

Libspark: PSDParser

This blog entry should have covered different file utils from the Spark Project. During writing I realized that just the PSDParser offers a lot to write by itself so here we go.

The Spark Project offers a small library for parsing a .psd (Photoshop Document) to extract the various data stored in it like layers or color information. See a example use:

Download Example Photoshop File | Download Sources

(Either JavaScript is not active or you are using an old version of Adobe Flash Player. Please install the newest Flash Player.)


The start is quite simple: Just download the current version from their svn, add it to your classpath and instanciate it with:

var parser: PSDParser = new PSDParser( data /* ByteArray */ );


Most likely the first thing you will need from the parser is a image representation of the .psd. Fortunatly thats quite simple to get with:

bitmap.bitmapData = parser.imageData.image;
// or
bitmap.bitmapData = parser.imageData.getImage();

Currently the image you can get is on white(not transparent) only.


Layers

But you can create a transparent presentation by accessing all layers

for( var layer: LayerPixelData in parser.layerAndMask.pixels )
{
   showLayerImage( layer.image );
}

The layers are sorted from 0=bottom to x=top.

The BitmapData contains only the relevant pixels. To show them on their proper positions, you have to take the bounds given within the layerStructure.

for( var i: int = 0; i < parser.layerAndMask.layers; i++ )
{
  var layerStructure: LayerStructure = LayerStructure( parser.layerAndMask.layers[i] );
  var layerPixelData: LayerPixelData = LayerPixelData( parser.layerAndMask.pixels[i] );
  showLayerImage( layerPixelData.image, layerStructure.bounds.left, layerStructure.bounds.top );
}


Opacity

The opacity of each layer is stored in the layerStructure.opacity field. Perhaps for easier processing in Photoshop the people at adobe stored the value as Integer from 0-255 instead of the 0-100 which you can set within Photoshop. (I wonder what happens with Photoshop if you create a .psd that uses full spectrum)

Watch out to not catch floating point calculation errors:

var opacity: int = Math.round( layerStructure.opacity * 100 / 255 ); // positions are important
var bit: int = Math.round( 255 * ( percent / 100 ) ); // reverse operation


Problems

As for now there are still many things PSDParser doesn't support. It is open source and the one guy who made the start obviously didn't have enough time to finish it.

For a start: some of the things it doesn't support throw a exception, so you better wrap it with a try/catch block if you work with user content.

var parser: PSDParser;
try {
  parser = new PSDParser( data /* ByteArray */ );
} catch (e: Error ) {
  // Display a error message
}
if( null != parser )
{
  // Continue with your code.
}

There is a list of features missing/not-working in the bug tracker of libspark.

Anyway: Its a very useful start. I hope munegon will find some time to add features to this great project. Since its open source project you could also try to contribute your time/expirience.

Thanks Munegon! Thanks Spark team!

Factsheet

author: munegon
category: file handling
used revision: trunk [r2554]
documentation: japanese

Tags: , , ,

Comments

  1. echo5-7

    OMG!!! Thats excactly what I was looking for!

  2. Tobias

    Hi Martin,

    thanks for the article. Just keep on.

    Greets Tobias

  3. Sharnalk

    That’s amazing. Thank you for your article. It is very efficient.

Leave a Reply

Twitter Users!
Enter your personal information in the form or sign in with your Twitter account by clicking the button below.

Site informations

Martin Heidegger – Web Developerskype:mastakanedaxing:martin.heideggertwitter:leichtgewicht