Playing with the ming API , a C library for SWF/Flash.My notebook.

Ming is a C library generating some simple Flash/SWF movies. In this post I will describe how I used the Ming API by try to converting to SWF the SVG that was generated in a previous post
Genetic Algorithm with Darwin's Face: Dynamic SVG

The original SVG file

The original SVG file looks like this:

<?xml version="1.0"?>
<svg:svg xmlns:svg="http://www.w3.org/2000/svg" version="1.1" width="160" height="222" style="stroke: none;" viewBox="0 0 160 222">
<svg:g id="face">
<svg:polygon points="110,193 11,320 -67,164" style="fill: rgb(129, 82, 122); opacity: 0.68;"/>
<svg:polygon points="109,30 224,181 -4,-1" style="fill: rgb(213, 113, 17); opacity: 0.52;"/>
<svg:polygon points="128,105 101,0 209,-75" style="fill: rgb(200, 91, 58); opacity: 0.04;"/>
<svg:polygon points="115,183 169,232 193,-29" style="fill: rgb(185, 133, 125); opacity: 0.9;"/>
<svg:polygon points="68,186 47,39 57,30" style="fill: rgb(249, 68, 34); opacity: 0.62;"/>
<svg:polygon points="80,185 108,123 158,131" style="fill: rgb(62, 181, 169); opacity: 0.56;"/>
<svg:polygon points="110,61 211,-86 115,217" style="fill: rgb(10, 46, 216); opacity: 0.86;"/>
<svg:polygon points="115,183 169,232 192,-27" style="fill: rgb(188, 127, 122); opacity: 0.9;"/>
<svg:polygon points="78,197 205,135 85,178" style="fill: rgb(53, 145, 210); opacity: 0.6;"/>
<svg:polygon points="108,64 211,-81 111,220" style="fill: rgb(10, 46, 216); opacity: 0.46;"/>
<svg:polygon points="110,59 210,-88 116,215" style="fill: rgb(10, 46, 216); opacity: 0.86;"/>
<svg:polygon points="53,138 60,45 46,60" style="fill: rgb(13, 98, 29); opacity: 0.8;"/>
(...)

A generic C program using the ming API would look like this:

/* initialize ming */
Ming_init();
/* create a movie */
movie=newSWFMovie();
/* set number of frames */
SWFMovie_setNumberOfFrames(movie, NUM_FRAME);
/* loop over the frames */
for(i=0;i<NUM_FRAME;++i)
{
/* create rectange */
rect = newSWFShape();
SWFShape_movePenTo(rect,x,y);
SWFShape_drawLineTo(rect,x+width,y);
SWFShape_drawLineTo(rect,x+width,y+height);
SWFShape_drawLineTo(rect,x,y+height);
SWFShape_drawLineTo(rect,x,y);
/* add figure in the movie */
SWFMovie_add(swf, rect);
(...)
/* add frame */
SWFMovie_nextFrame(movie);
}
/* save movie to file */
WFMovie_save(movie,"file.swf");
/* dispose movie */
destroySWFMovie(movie);

I created a simple C code transforming my SVG to SWF using the ming API. The file contains 5 frames where I slightly moved some shapes. The code was posted on github at: http://github.com/lindenb/ccsandbox/blob/master/src/svg2swf.c.

Compile & run:

export LD_LIBRARY_PATH=${ming.lib.dir}
gcc -L ${ming.lib.dir} -I ${ming.include.dir} `xml2-config --cflags ` svg2swf.c -lming `xml2-config --libs `
./a.out -o darwin.swf darw.svg

Result

(also posted on OWW)

That's it
Pierre

FLEX, Flash and Bioinformatics: episode II

Looking for resources about flash/flex and biofinformatics I found this nice (action)script example querying pubmed:

www: http://codelog.voisen.org
Here is the flash application
Here is the the source code

Pierre

Hello World ! My first FLEX2 Application.

Adobe Flex 2 software is a rich Internet application framework based on Adobe Flash that will enable you to productively create beautiful, scalable applications that can reach virtually anyone on any platform.

The SDK was downloaded and extracted from : http://download.macromedia.com/pub/flex/sdk/flex_sdk_2.zip.

File:first.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
    horizontalAlign="center" verticalAlign="center">
    <mx:Button id="myButton" label="Hello Bioinformatics World !" />
</mx:Application>

The file was compiled to flash using the mxmlc command (a java application):

>FLEX/SDK/bin/mxmlc --strict=true --file-specs first.mxml
Loading configuration file FLEX/SDK/frameworks/flex-config.xml
FLEX/test/first.swf (125402 bytes)
>  ls
first.mxml  first.swf

I then opened first.swf in firefox and...


Whaaaa ! It worked without any problem !!

I'M THE KING OF THE WORLD !!

This looks exciting ! I need a good tutorial ! I need a good tutorial ! I need ....


Pierre :-)