Flex on Ubuntu(1)

Posted by PunNeng, Fri Jun 08 12:38:00 UTC 2007

กระแส 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 เพิ่มก้อนนี้เข้าไป

  1
  2
  3
  4
  5
  6
<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 ก้อนนี้แปะไป

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
<?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 ได้

Filed Under: General | Tags: flex ubuntu xml

Comments

  1. iporsut 10.31.07 / 00AM

    ขอบคุณครับพี่เหน่ง คิดว่าจะต้องเสียเวลาลงวินโดว์ซะแล้ว

Have your say

A name is required. You may use HTML in your comments.




codegent: we're hiring