arabic code
In the name of Allah the compassionate the most mercifull  Who is Allah ?
May peace and Allah mercy and blessings be upon you

About FlarabyAS3Flex | License | Documentation | Examples | Buy Now




1- Example of application using TextArea:




Source code:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="horizontal" viewSourceURL=""
xmlns:Flaraby="com.arabicode.text.Flaraby.*" horizontalAlign="center"
verticalAlign="middle"
width="100%" height="100%"
applicationComplete="init()" >

  <mx:Script>
    <![CDATA[
      //
      import flash.events.*;
      import mx.events.*;
      import mx.controls.Alert;
      import mx.controls.VScrollBar;
      //
      //Uncomment line below if you compile with Flex 2
      //import mx.core.UITextField;
      //Comment line below if you compile with Flex 2
      import mx.core.IUITextField;
      import mx.core.mx_internal;
      use namespace mx_internal;
      //
      //Uncomment line below if you compile with Flex 2
      //private var uit:UITextField;
      //Comment line below if you compile with Flex 2
      private var uit:IUITextField;
      //
      private var tF:TextFormat;
      private var vsb:VScrollBar;
      [Bindable]
      private var otps:String;
      [Bindable]
      private var fnts: Array = [
                    {label:"Traditional Arabic", data:{family:"TraditionalArabic", weight:"normal"}}
                    , {label:"Andalus", data:{family:"Andalus", weight:"normal"}}
                    , {label:"Tahoma", data:{family:"Tahoma", weight:"normal"}}
                    ];
      
      private function init():void
      {
        input.text = "بِسْمِ اللّهِ الرَّحْمـَنِ الرَّحِيمِ
                    الْحَمْدُ للّهِ رَبِّ الْعَالَمِينَ
                    الرَّحْمـنِ الرَّحِيمِ
                    مَـالِكِ يَوْمِ الدِّينِ
                    إِيَّاكَ نَعْبُدُ وإِيَّاكَ نَسْتَعِينُ
                    اهدِنَــــا الصِّرَاطَ المُستَقِيمَ
صِرَاطَ الَّذِينَ أَنعَمتَ عَلَيهِمْ غَيرِ المَغضُوبِ عَلَيهِمْ وَلاَ الضَّالِّينَ";
        addEventListener(Event.RESIZE, doConvert);
      }
      
      private function doConvert(event:Event):void
      {
        convert();
      }
      
      private function onUpdate(event:Event):void
      {
        //Get the internal VScrollBar
        var i:int = 0;
        //Loop through the TextArea component to find the scrollbar instance
        while(i<output.numChildren)
        {
          if(output.getChildAt(i).name.indexOf("Scroll") != -1)
          {
            vsb = output.getChildAt(i) as VScrollBar;
            //Move internal VScrollBar to the left
            vsb.x = 0;
            break;
          }
          i++;
        }
        //Move internal textField to the right of VScrollBar
        uit = output.getTextField();
        uit.x = vsb.width;
        uit.selectable = false;
      }
      
      private function convert():void
      {
        var selectedFont:Object = ft.selectedItem.data;
        //Change the TextArea style to the selected font
        output.setStyle("fontFamily", selectedFont.family);
        output.setStyle("fontWeight", selectedFont.weight);
        //Set the TextFormat properties
        tF = new TextFormat();
        tF.font = selectedFont.family;
        tF.bold = (selectedFont.weight == "bold")? true : false;
        //Set right and left margins to allow some space around text
        tF.rightMargin = 15;
        tF.leftMargin = 2;
        tF.size = sz.value;
        //
        //Get the internal textField's width minus margins right and left
        var wd:Number = uit.width - 17;
        //Change the extraCharWidth property as needed
        fb.extraCharWidth = xw.value;
        //
        var str:String = input.text;
        //If you like remove Tashkeel from string
        //str = fb.removeTashkeel(str);
        //Convert the string
        otps = fb.convertArabicString(str, wd, tF);
      }

    ]]>
  </mx:Script>
  
  <mx:Style>
  
      <!-- Fonts to be embeded into the application -->
      
      @font-face
      {
        src:url("c:\windows\fonts\trado.ttf");
        fontFamily: TraditionalArabic;
        fontWeight: normal;
      }
      
      @font-face
      {
        src:url("c:\windows\fonts\andlso.ttf");
        fontFamily: Andalus;
        fontWeight: normal;
      }
      
      @font-face
      {
        src:url("c:\windows\fonts\tahoma.ttf");
        fontFamily: Tahoma;
        fontWeight: normal;
      }
      
</mx:Style>
  
  
  <Flaraby:FlarabyAS3Flex
    id="fb"
    html="true"
    multiline="true"
    embedFonts="true"
    />
  
  <mx:Panel
    id="pan"
    title="FlarabyAS3 Demo"
    width="100%"
    height="100%"
    paddingBottom="10"
    paddingTop="10"
    paddingLeft="10"
    paddingRight="10"
    horizontalAlign="center"
    >
    <mx:Label text="Input" />
    <mx:TextArea
      id="input"
      width="100%"
      height="50%"
      textAlign="right"
      wordWrap="true"
      />
    <mx:HBox>
      <mx:Label text="Font" />
      <mx:ComboBox
        id="ft"
        dataProvider="{fnts}"
        close="convert()"
        />
      <mx:Label text="Size" />
      <mx:NumericStepper
        id="sz"
        maximum="50"
        minimum="8"
        stepSize="1"
        value="18"
        change="convert()"
        />
    </mx:HBox>
    <mx:HBox>
      <mx:Label text="ExtraCharWidth" />
      <mx:NumericStepper id="xw" maximum="2.0" minimum="0.0" stepSize="0.1" value="0.0" change="convert()" />
    </mx:HBox>
    <mx:Label text="Output" />
    <!-- Set TextArea's verticalScrollPolicy to 'on' by default to get
    the internal textField's correct width -->
    <mx:TextArea
      id="output"
      width="100%"
      height="50%"
      textAlign="right"
      editable="false"
      verticalScrollPolicy="on"
      fontSize="{sz.value}"
      htmlText="{otps}"
      updateComplete="onUpdate(event)"
      />
    <mx:Button label="Convert" click="convert()" />
  </mx:Panel>
</mx:Application>

Download the example files






2- Example of application using ItemRenderer:




Source code (itemrendererExample.mxml):

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:Flaraby="com.arabicode.text.Flaraby.*" layout="horizontal"
horizontalAlign="center" verticalAlign="middle"
width="550" height="450" applicationComplete="init()" >

  <mx:Script>
    <![CDATA[
      
      import flash.text.*;
      import mx.controls.Alert;
      import mx.collections.*;
      //
      import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;
private namespace rss = "http://purl.org/rss/1.0/";
use namespace rss;
      //
      import mx.controls.VScrollBar;
      //Uncomment line below if you compile with Flex 2
      //import mx.core.UITextField;
      //Comment line below if you compile with Flex 2
      import mx.core.IUITextField;
      import mx.core.mx_internal;
      use namespace mx_internal;
//
      private var tF:TextFormat;
      private var vsb:VScrollBar;
      //Uncomment line below if you compile with Flex 2
      //private var uit:UITextField;
      //Comment line below if you compile with Flex 2
      private var uit:IUITextField;
      
      [Bindable]
      private var listArr:ArrayCollection;
      
      [Bindable]
      private var otps:String;
      
      private function init():void
      {
        //Make the scrollbar hidden at start and move it to the left
        vsb = getVScrollBar();
        vsb.x = 0;
        vsb.visible = false;
      }
      
      private function getVScrollBar():VScrollBar
      {
        //Get the internal VScrollBar
        var i:int = 0;
        //Loop through the TextArea component to find the scrollbar instance
        while(i<lst.numChildren)
        {
          //Alert.show(String(lst.getChildAt(i).name), 'Error', Alert.OK);
          if(lst.getChildAt(i).name.indexOf("Scroll") != -1)
          {
            vsb = lst.getChildAt(i) as VScrollBar;
            return vsb;
          }
          i++;
        }
        return new VScrollBar();
      }
      
      public function updateLayout():void
      {
        //Make sure the scrollbar and the list items' positions are
        updated on each list update
        vsb = getVScrollBar();
        vsb.x = 0;
        //
        var i:int = 0;
        while(i<lst.numChildren)
        {
          //Alert.show(String(lst.getChildAt(i).name), 'Error', Alert.OK);
          if(lst.getChildAt(i).name.indexOf("mask") != -1)
          {
            lst.getChildAt(i).x = 17;
            
          }
          if(lst.getChildAt(i).name.indexOf("Content") != -1)
          {
            lst.getChildAt(i).x = 17;
          }
          i++;
        }
      }
      
      private function onSuccess(event:ResultEvent):void
      {
        //
        var feed:XML = event.result as XML;
        listArr = new ArrayCollection();
        // Put the result xml data into an ArrayCollection to work
          as a dataProvider for the list
        for each (var item:XML in feed.channel.item)
        {
          var obj:Object = {title:item.title
                  , description:item.description
                  , link:item.link
                  , pubdate:item.pubDate};
          listArr.addItem(obj);
        }
        //
      }
      
      private function onFailure(event:FaultEvent):void
      {
        Alert.show(event.fault.message, 'Error', Alert.OK);
      }
      
      private function convert(str:String):void
      {
        //Get internal TextArea's textField
        uit = output.getTextField();
        uit.selectable = false;
        // Make sure the scrollbar is visible
        vsb.visible = true;
        //Set the TextFormat properties
        tF = new TextFormat();
        tF.font = "TraditionalArabic";
        tF.bold = true;
        tF.size = 16;
        tF.align = "right";
        //Convert the string
        // It's a good idea to minimize the internal textField's width by 2 pixels
        in multiline text, just to be safe
        otps = fb.convertArabicString(str, uit.width-2, tF);
      }
      
    ]]>
  </mx:Script>
  
  <mx:Style>
    
    <!-- Fonts to be embeded into the application -->
    
    @font-face
    {
      src:url("c:\windows\fonts\tradbdo.ttf");
      fontFamily: TraditionalArabic;
      fontWeight: bold;
    }
    
    <!-- TextArea styles -->
    
    .outp
    {
      fontFamily: TraditionalArabic;
      fontWeight: bold;
      fontSize: 16;
    }
    
  </mx:Style>
  
  <mx:HTTPService id="getrss"
  url="http://www.arabicode.com/akhbar/rss/rss.php?
  rss=http://www.akhbar.ma/monde_2.xml"
  method="GET" resultFormat="e4x" showBusyCursor="true"
  useProxy="false"
  result="onSuccess(event)" fault="onFailure(event)" />
  
  <Flaraby:FlarabyAS3Flex id="fb"
  html="true"
  multiline="true"
  embedFonts="true" />
  
  <mx:Panel id="pnl" title="ItemRenderer Demo
  (Akhbar.ma - http://www.akhbar.ma/monde_2.xml)"
  width="100%" height="100%" paddingLeft="10"
  paddingRight="10" paddingTop="10"
  paddingBottom="10" horizontalAlign="center" >
  
    <mx:Label text="Titles" />
    
    <mx:List
      id="lst"
      width="100%"
      height="40%"
      rowHeight="35"
      textAlign="right"
      dataProvider="{listArr}"
      itemRenderer="aitem"
      change="convert(lst.selectedItem.description)"
      verticalScrollPolicy="on"
      enterFrame="updateLayout()"
      render="updateLayout()" />
      
    <mx:Label text="Description" />
    
    <mx:TextArea styleName="outp" id="output" width="100%" height="50%"
    textAlign="right" editable="false" htmlText="{otps}" />
    
    <mx:Button label="Load News Titles" click="getrss.send()" />
    
  </mx:Panel>
</mx:Application>


Source code (aitem.mxml):

<?xml version="1.0"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml"
  xmlns:Flaraby="com.arabicode.text.Flaraby.*" >
  
<mx:Script>
<![CDATA[

        import flash.text.TextFormat;
        //
        //Uncomment line below if you compile with Flex 2
        //import mx.core.UITextField;
        //Comment line below if you compile with Flex 2
        import mx.core.IUITextField;
        import mx.core.mx_internal;
        use namespace mx_internal;
        //
        //Uncomment line below if you compile with Flex 2
        //private var uit:UITextField;
        //Comment line below if you compile with Flex 2
        private var uit:IUITextField;
        //
        private var tF:TextFormat;
        private var ss:String;
        
        private function convert(str:String):String
        {
          //Get internal Text's textField
          uit = itemLabel.getTextField();
          //Set the TextFormat properties
          tF = new TextFormat();
          tF.font = "TraditionalArabic";
          tF.bold = true;
          tF.size = 16;
          //Convert the string
          ss = fb2.convertArabicString(str, uit.width, tF);
          //
          return ss;
        }

]]>
</mx:Script>
    
    <mx:Style>
      
      <!-- Fonts to be embeded into the application -->
      
      @font-face
      {
        src:url("c:\windows\fonts\tradbdo.ttf");
        fontFamily: TraditionalArabic;
        fontWeight: bold;
      }
      
      <!-- Text styles -->
      
      .itm
      {
        fontFamily: TraditionalArabic;
        fontWeight: bold;
        fontSize: 16;
      }
      
    </mx:Style>
    
    <Flaraby:FlarabyAS3Flex id="fb2" embedFonts="true" />
    
    <mx:Text id="itemLabel" styleName="itm"
    width="100%" height="100%" textAlign="right"
    selectable="false" paddingLeft="2" paddingRight="2"
    paddingTop="2" paddingBottom="2"
    text="{convert(data.title)}" />
    
</mx:VBox>

Download the example files





delicious     digg      technorati      reddit      magnolia      yahoo      google

© 2009 arabicode.com, all rights reserved