Flex on Ubuntu(1)

กระแส RIA แรงเหลือเกิน ก็มีให้เลือกเยอะ flex, silverlight, javaFX, openLazlo, ajax
แต่ยืนบน flash มานานละ ที่ทำงานก็ต้องใช้ flex ทำงานด้วย ก็เลยมาทำ RIA ด้วย flex นี่แหละ
และมันก็สามารถทำบน linux ได้ด้วย ก็ลองบน ubuntu นี่แหละ
มาดูแบบง่ายๆ กันก่อน ว่าผลที่ทำออกมาจะเป็นแบบไหน

เริ่มต้นด้วยการโหลด flex sdk มาก่อน จากนั้น extract ไว้ที่ตามใจชอบ
จากนั้น ไป config เล็กน้อยสำหรับ SciTE อีกหน่อย(ผมเคย config มันไปทีนึงแล้ว ลองทบทวนดูอีกทีก็ได้ครับ)

$ sudo gedit /usr/share/scite/html.properties

บางส่วน แก้ code เป็น

file.patterns.xml=*.xml;*.xsl;*.svg;*.xul;*.xsd;*.dtd;*.xslt;*.axl;*.xrc;*.rdf;*.swfml;*.mxml
filter.web=Web (html htm asp shtml css xml docbook jsp swfml mxml)|$(file.patterns.web);*.css;*.xml;*.docbook|

*.swfmil ไม่จำเป็น แค่เพิ่ม *.mxml ก็พอ
ใส่ code สำหรับปุ่ม build ด้านล่างของ file หน่อย

command.build.*.mxml=/path/to/your/flex_sdk/bin/mxmlc $(FileNameExt) -output $(FileName).swf

จริงๆ จะสั่งจาก terminal ตรงๆ ก็ได้
ตัว flash player ยังคงเหมือนเดิมเรื่อง font ต้องทำการ embed font เสมอ แต่วิธีการ embed font ใน flex ต่างจาก flash หน่อย

$ gedit /path/to/your/flex_sdk/frameworks/flex-config.xml

ใน tag fonts
เพิ่มก้อนนี้เข้าไป

<languages>
    <language-range>
        <lang>ThaiEng</lang>
        <range>U+0E01-U+0E5B,U+0020,U+0041-U+005A,U+0020,U+0061-U+007A,U+0020,U+0061-U+007A,U+0030-U+0039,U+002E,U+0020-U+002F,U+003A-U+0040,U+005B-U+0060,U+007B-U+007E</range>
    </language-range>
</languages>

ในนี้จะรวม English(Uppercase,Lowercase) Numerals Punctuation และ Thai
ตัวอย่างดูได้จาก /path/to/your/flex_sdk/frameworks/flash-unicode-table.xml
สั่งต่อ

$ scite flex_example1.mxml

เอา code ก้อนนี้แปะไป

<?xml version="1.0" encoding="UTF-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    applicationComplete="feedRequest.send()" layout="absolute">
    <mx:Style>
    @font-face {
        font-family : mySerif;
        src : local("Serif");
	unicode-range : "ThaiEng";
     }

     Panel{
        fontFamily: mySerif; 
     }

    </mx:Style>
    <mx:HTTPService 
        id="feedRequest" 
        url="http://feeds.feedburner.com/ubuntuclub" 
        useProxy="false" />
    <mx:Panel x="20" y="10" width="475" height="400" title="Flex on Ubuntu" layout="absolute" >
	<mx:Label x="20" y="5" htmlText="{feedRequest.lastResult.rss.channel.title}" />
        <mx:DataGrid id="dgPosts" x="20" y="30" width="400" dataProvider="{feedRequest.lastResult.rss.channel.item}">
            <mx:columns>
                <mx:DataGridColumn headerText="Posts" dataField="title"/>
                <mx:DataGridColumn headerText="Date" dataField="pubDate" width="150" />
            </mx:columns>
        </mx:DataGrid>
        <mx:LinkButton x="20" y="285" label="Read Full Post" click="navigateToURL(new URLRequest(dgPosts.selectedItem.link));"/>
        <mx:TextArea x="20" y="185" width="400" height="80" htmlText="{dgPosts.selectedItem.description}" />
    </mx:Panel>
    
</mx:Application>

แล้วก็กดปุ่ม build โลดดด
ก็จะได้ผลอย่างที่เห็นนั่นแหละครับ
แล้วเอา .swf ไปใช้งานตามสะดวก

เห็นไหม บน Linux ก็ทำ Flex ได้

จากเว็บผมเอง