Generating PDF-s on the client side (including non-latin chars)

This seems to come up every once in a while, especially outside US and UK. People start looking at the PDF generating libraries, and find that when they use a non-latin character it stops to work. It needs some special care but it is really easy to get it working, I’m going to show how to do it, step by step, when using purepdf (a port of iText

Getting ready

You can find purepdf on google code. Once you download the zip you’ll find purePDF.swc and purePDFont.swc, for this example you’ll only need the first one so put it in your projects lib folder and you’re ready.
The next thing you need is a font to use, I’ll be using Ubuntu-L.ttf which can be downloaded from font.ubuntu.com, just drop it in the project. You can use any font, as long as it supports the charset you’ll be using. At this point my project looks something like this:

Continue reading →

Using constants in Flex CSS – with compile time error checking

One of the problems with CSS is that in involves a lot of copy&paste. Having multiple selectors which share a common property value (like a font color) is common, but in CSS you still need to have an individual color for each selector. So you end up with code that looks like this:

s|TextArea{
    color:#eeeeee;  
}

s|Button{
    color:#eeeeee; /* the same color as above*/
}

Which is ok, but involves a lot of searching and replacing and careful analysis of the changes being made. I’ve been thinking about a way to put constants in there for a while and finally found a nice one today, while reading documentation for Flex 4.5. It’s really simple to use and has an added bonus – the compiler will make sure that the consts are actually defined, which should help with maintainability.

Defining the constants

Let’s start by defining the constants and their value. You need to create a new actionscript file (in my case style\StyleConstants.as), than throw away all the code that’s inside (eg. the package and class definitions), and define a const inside, we’ll use the file later.

/* file: style\StyleConstants.as */
private const someColorConstant:uint = 0xff0000;

Please notice that the variable can be private and will still work (it can also be public).

Putting Actionscript variables in CSS – PropertyReference

Looking at the Flex CSS documentation I’ve found that there’s a new keyword that you can use in Flex 4 CSS – PropertyReference. Since the docs say that “You can use document properties in your CSS” we’re going to do just that. The CSS class will be the modification of the one at the top, I’ll put it in style\Style.css and replace the colors with a pointer to the const declared above.

/* file: style\Style.css */
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/mx";

s|TextArea{
    color:PropertyReference("someColorConstant");
}

s|Button{
    color:PropertyReference("someColorConstant");
}

Continue reading →

Basic socket server in AIR

The socket api is relatively simple, but I couldn’t find a simple step by step tutorial on getting sockets working. The basic idea was to create an app that can send text to connected clients (which I’ll be using to send code while teaching a Flex class), and getting that basic functionality working is amazingly simple with AIR 2+.

The config

To make life easier, first I’ve created a class that will hold the configuration for the socket, it’s nothing interesting, but as it will be used later, I’ll put it at the top. There are a few things to keep in mind while choosing the port – it needs to be smaller than 65536 and should be bigger than 1024 (see docs) and ports can’t be shared, so you need to make sure that the port you’re choosing isn’t already used 1.

public class SocketConfig
{
   static public const port:int = 9231;
   static public const address:String = "127.0.0.1";
}

The server – setup

Creating the server is really easy. We just need to set up an instance of the ServerSocket class, and start listening and handling incoming connections.

// create a server socket
protected var socket:ServerSocket = new ServerSocket();

protected function createServer(event:FlexEvent):void
{
   // bind the socket to a given address and port
   socket.bind(SocketConfig.port,SocketConfig.address);
   // the CONNECT event is dispatched after a client connects
   // to the socket, make sure we handle it
   socket.addEventListener(ServerSocketConnectEvent.CONNECT,
                           clientConnectedHandler);
   // start listening for connections
   socket.listen();
}

Continue reading →

Notes:

  1. Remember to close the socket when closing the app, otherwise you might run into trouble when launching it again

Snippet- DataGrid labelField upgrade – complexFieldNameComponents

When displaying data in a DataGrid you can now reach into the inner structure of the data item while using the dataField property.

Let’s say your data is:

<employee>
    <name>Maurice Smith</name>
    <phone>555-219-2012</phone>
    <email>maurice@fictitious.com</email>
    <active>false</active>
    <description>
        <short>short description </short>
    </description>
</employee>
<employee>
    <name>Mary Jones</name>
    <phone>555-219-2000</phone>
    <email>mjones@fictitious.com</email>
    <active>true</active>
    <description>
        <short>short description </short>
    </description>
</employee>

If your data has nested fields, like the short one above you can use simple dataField to reach for them, like this:

<mx:DataGrid dataProvider="{employees}">
    <mx:columns>
        <mx:DataGridColumn dataField="description.short" headerText="Description"/>
    </mx:columns>
</mx:DataGrid>

I’m almost sure this wasn’t possible the last time I’ve tried this with some previous version of Flex SDK.

Flash Builder extension for Swiz – sneak peak

I’ve spent some time lately learning how to extend Flash Builder, and finally have some results to show.

I’ve build a few projects using the Swiz framework, which I love, but I’ve always felt that adding event handlers in the controllers was a rather tedious task, requiring a lot of checking of what’s in the event and copy pasting. So I’ve started looking into ways that I could automatize the task, and ended up learning how to extend Eclipse and Flash Builder. The plugin is very raw and still has a long way to go, but it’s doing something useful, so I’ll start using it and keep working on it. Below a quick video showing it at work.

/