BTA Flexing

My passion RIAs…………..Shardul Singh Bartwal

Archive for the ‘AIR’ Category

Adobe AIR and SQLite Connectivity

Posted by shardulbartwal on April 14, 2008

Adobe AIR and SQLite Connectivity

 ===========================

  Abode AIR provides very easy mechanism to connect to the SQLite.I am doing the connectivity by coding. Here nothing different just create the connection and create the SQLConnection,open it, create SQLStatement and execute them, close connection.Upto my experience I think this is the same common way which we used in any database connectivity. So there is nothing special. I found this process very cool especially due the portable size of the SQLite and creating and deleting the database in just one mouse click. Apart form this you don’t require any thing else Flex Builder IDE with AIR. There is no software requirement for the SQLite.

 I am just putting some line of code for your better understanding. You can just copy and paste it. Although Its just a small code but hope it will give you the over all idea about dealing with the database in an AIR application.

 

*************************************************************

<?xml version=”1.0″ encoding=”utf-8″?>

<mx:WindowedApplication xmlns:mx=”http://www.adobe.com/2006/mxml

layout=”vertical” creationComplete=”init()”

width=”500” height=”400” backgroundColor=”#000000>

<mx:Script>

 

<![CDATA[

      import mx.controls.Alert;

      import mx.collections.ArrayCollection;

      import flash.data.*;

     

      private var ob:Array=new Array();

      public var mysqlConnection:SQLConnection;

      public var _createProdct:SQLStatement;

      public var _insertProduct:SQLStatement;

      public var _selectProduct:SQLStatement;

 

      private const _counterProduct:int = 1;

      private var databaseFile:File =

      File.applicationStorageDirectory.resolvePath("data.db");

      private const CREATE_PRODUCT_TABLE:String =

      "CREATE TABLE product (id INTEGER PRIMARY KEY,name TEXT," +

      "department TEXT, title TEXT, description TEXT);"

     

      private var _id:int;

      private var _name:String;

      private var _department:String;

      private var _title:String;

      private var _description:String;

     

      private var INSERT_PRODUCT:String;

      private const SELECT_PRODUCT:String = "SELECT * FROM product";

 

      public function createDatabase(databaseFile:File, productCount:int):void

      {

            if ((databaseFile != null) && (databaseFile.exists))

            {

                  databaseFile.deleteFile();

                  dg1.dataProvider=null;

                  Alert.show("Database Created Successfully.");

            }

     

            if (productCount < 1)

            {

                  productCount = 1;

            }

     

            mysqlConnection = new SQLConnection();

            mysqlConnection.open(databaseFile, SQLMode.CREATE);

            mysqlConnection.close();

            schemaGeneration();

      }

 

      public function deleteDatabase():void

      {

            if ((databaseFile != null) && (databaseFile.exists))

            {

                  databaseFile.deleteFile();

                  dg1.dataProvider=null;

                  Alert.show("Database Deleted Successfully.");

            }

            else

            {

                  Alert.show("There is no database to Delete.");

            }

      }

 

      private function schemaGeneration():void

      {

            var sqlStatement:SQLStatement = new SQLStatement();

            mysqlConnection=new SQLConnection();

            sqlStatement.sqlConnection = mysqlConnection;

            mysqlConnection.open(databaseFile, SQLMode.CREATE);

            sqlStatement.text = CREATE_PRODUCT_TABLE;

            sqlStatement.execute();

            mysqlConnection.close();

      }

 

      private function createInsertStatements():void

      {

            if((txt1.text !="")&&(txt2.text !="")&&(txt3.text !="")

            &&(txt4.text !=""))

            {

                  _id=0;

                  _name=txt1.text;

                  _department=txt2.text;

                  _title=txt3.text;

                  _description=txt4.text;

                 

                  if((databaseFile != null) && (databaseFile.exists))

                  {

                        INSERT_PRODUCT="INSERT INTO product (id, name, department, title, description)" +

                        " VALUES ("+"((SELECT max(id) FROM product)+1)"+",'"+_name+"','"+_department+

                        "','"+_title+"','"+_description+"');";

                        _insertProduct =new SQLStatement();

                        mysqlConnection=new SQLConnection();

                        _insertProduct.sqlConnection= mysqlConnection;

                        mysqlConnection.open(databaseFile, SQLMode.CREATE);

                        _insertProduct.text = INSERT_PRODUCT;

                        _insertProduct.execute();

                        mysqlConnection.close();

                        createSelectStatements();

                        clearAll();

                  }

                  else

                  {

                        Alert.show("There is no database so please create it First.");

                  }

            }

            else

            {    

                        Alert.show("Please enter the proper values For all the relative fields.");

            }

      }

 

      private function createSelectStatements():void

      {

                  _selectProduct =new SQLStatement();

                  mysqlConnection=new SQLConnection();

                  _selectProduct.sqlConnection = mysqlConnection;

                  mysqlConnection.open(databaseFile,SQLMode.READ);

                  _selectProduct.text = SELECT_PRODUCT;

                  _selectProduct.execute();

                  ob=_selectProduct.getResult().data;

                  mysqlConnection.close();

                  dg1.dataProvider=ob;

      }

 

      private function clearAll():void

      {

                  txt1.text="";

                  txt2.text="";

                  txt3.text="";

                  txt4.text="";

      }

]]>

 

</mx:Script>

 

<mx:VBox width=”100%” height=”100%” horizontalAlign=”center>

     

      <mx:HBox width=”80%” height=”30” horizontalAlign=”center>

     

            <mx:Label width=”120” textAlign=”right” text=”Name” color=”#ff0000/>

           

            <mx:TextInput id=”txt1” width=”120” height=”35/>

 

      </mx:HBox>

 

      <mx:HBox width=”80%” height=”30” horizontalAlign=”center>

     

            <mx:Label width=”120” textAlign=”right” text=”Department” color=”#ff0000/>

           

            <mx:TextInput id=”txt2” width=”120” height=”35/>

     

      </mx:HBox>

 

      <mx:HBox width=”80%” height=”30” horizontalAlign=”center>

     

            <mx:Label width=”120” textAlign=”right” text=”Title” color=”#ff0000/>

           

            <mx:TextInput id=”txt3” width=”120” height=”35/>

     

      </mx:HBox>

 

      <mx:HBox width=”80%” height=”30” horizontalAlign=”center>

     

            <mx:Label width=”120” textAlign=”right” text=”Description” color=”#ff0000/>

           

            <mx:TextInput id=”txt4” width=”120” height=”35/>

     

      </mx:HBox>

     

      <mx:HBox width=”80%” height=”100%” horizontalAlign=”center>

     

            <mx:DataGrid id=”dg1” width=”100%” height=”100%>

           

                  <mx:columns>

           

                        <mx:DataGridColumn id=”idCol” width=”50” dataField=”id” headerText=”Id” textAlign=”center/>

                       

                        <mx:DataGridColumn id=”nameCol” width=”100” dataField=”name

                              headerText=”Name” textAlign=”center/>

                       

                        <mx:DataGridColumn id=”departmentCol” width=”100” dataField=”department

                              headerText=”Department” textAlign=”center/>

                       

                        <mx:DataGridColumn id=”titleCol” width=”100” dataField=”title

                              headerText=”Title” textAlign=”center/>

                       

                        <mx:DataGridColumn id=”descriptionCol” width=”200” dataField=”description

                              headerText=”Description” textAlign=”center/>

           

                  </mx:columns>

           

            </mx:DataGrid>

     

      </mx:HBox>

     

      <mx:HBox width=”80%” height=”50” horizontalAlign=”center>

     

            <mx:Button id=”btnCreateDataBase” label=”Create DataBase” width=”130

                  click=”createDatabase(databaseFile,_counterProduct)”/>

           

            <mx:Button id=”btnInsertIntoDataBase” label=”Insert into DataBase” width=”150

                  click=”createInsertStatements()”/>

            <mx:Button id=”btnDeleteDataBase” label=”Delete DataBase” width=”130

                  click=”deleteDatabase()”/>

      </mx:HBox> 

</mx:VBox>

 </mx:WindowedApplication>

  

********************************************************** 

Hope you will enjoy this………………………………….. 

 

Posted in AIR, SQLite | 12 Comments »

Adobe AIR Experience It

Posted by shardulbartwal on April 11, 2008

Adobe AIR Experience It
========================

Have you ever created a desktop(Window) application using the tag base language?
Have you ever applied the CSS to the desktop application?
How will we create same window (desktop) version of any flex application?
How wiil we create a Rich application which can be install on our PCs by just running its Setup?
Is there any answer of these all questions?

The answer is very easy……………….Adobe AIR.
Just Experience it……………..

Posted in AIR | Leave a Comment »

Flex Charting with Editable Datagrid

Posted by shardulbartwal on November 20, 2007

Charting in Flex

charting.png

Charting in flex is one of the important and owesome feature of flex.Here is a example in which you u can see the Chart representation of the values in a Datagrid.Hoping you all will enjoy it.The important featureof the flex is the that on changing the value in the datagrid there is the coresponding change in the Chart and for achieving this you don’t require to do any thing more.

   Just  copy and paste the code below in your Application mxml of Flex.

******************************************************************

<?xml version=”1.0″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml” paddingTop=”50″
layout=”vertical” verticalScrollPolicy=”off”
>
<mx:Style>
Application {
backgroundColor: #333333;
}
Label{
color:#ff0000;
fontSize:11;
textAlign:justify;
font-family:Verdana;
}

Alert{
modalTransparencyBlur: 5;
modalTransparency: 0.6;
modalTransparencyColor: #DDDDDD;
modalTransparencyDuration: 1000;
color : #0f3177;
title-style-name : “.alertTitle”;
header-height:19;
border-thickness: 1;
drop-shadow-enabled: true;
drop-shadow-color :#d1ddf7;
background-color: #ffffff;
corner-radius :6;
border-style :solid;
header-colors : #90a4d1, #5970a0;
footer-colors : #9db6d9, #ffffff;
border-color : #5970a0;   
}

.alertTitle{
font-family :Times New;
font-size :20;
font-weight :bold;
text-align :left;
color :#ffffff;
}
</mx:Style>

  <mx:Script><![CDATA[
    import mx.utils.ArrayUtil;
     import mx.collections.ArrayCollection;
     import mx.events.DataGridEvent;
     import mx.events.ListEvent;
     import mx.controls.Alert ;
   
  public var expenses:ArrayCollection = new ArrayCollection([
        {Month:"January", Profit:2000000, Expenses:1500000,ENo:100},
        {Month:"February", Profit:1000000, Expenses:200000,ENo:80},
        {Month:"March", Profit:1500000, Expenses:500000,ENo:110},
        {Month:"April", Profit:1500000, Expenses:500000,ENo:130}
     ]);
      
     public function functionAddRecord(expenses:ArrayCollection):void
     {
     var strMonth:String=txtMonth.text;
  var strProfit:String=txtProfit.text;
  var strExpenses:String=txtExpenses.text;
  var strENo:String=txtENo.text;
  if(strMonth.length==0){Alert.show(“Enter the month First,it can not be Empty.”,”Blank field”)}
  else if(strProfit.length==0){Alert.show(“Enter the Profit First,it can not be Empty.”,”Blank field”)}
  else if(strExpenses.length==0){Alert.show(“Enter the Expenses First,it can not be Empty.”,”Blank field”)}
  else if(strENo.length==0){Alert.show(“Enter the ENo First,it can not be Empty.”,”Blank field”)}
  else
   {
    expenses.addItem({Month:strMonth,Profit:strProfit,Expenses:strExpenses,ENo:strENo});
        expenses.refresh();
        txtMonth.text=”";
        txtProfit.text=”";
        txtExpenses.text=”";
        txtENo.text=”";
     }
  }
 
      public function functionRemoveRecord(expenses:ArrayCollection):void
      {
       var _selectedindex:Number=dg1.selectedIndex;
       var _expensesLength:Number=expenses.length;

           if(_selectedindex!=-1)
        {
         var _selectedindex:Number=dg1.selectedIndex;
        expenses.removeItemAt(_selectedindex);
         expenses.refresh();
        }
         else if(_expensesLength==0)
         {
          Alert.show(“There is no Record to Delete”,”Error”);
         }
      }
  
  public function functionCheckStatusOfRemove():void
  {
   if(dg1.selectedIndex >0)
   {
    btnRemove.enabled=true;
   }
  }  
  
     public function functionitemEditEnd(event:DataGridEvent):void
        {
        /* var _rowIndex:Number=event.rowIndex;
        var _columnIndex:Number= event.columnIndex;
        var cell:String=(String(event.currentTarget.itemEditorInstance));
           if(event.currentTarget.itemEditorInstance.length==0)
           {
            Alert.show(“Not Possible”);
           } */
         }
 
  public function functionItemClick(event:ListEvent)
  {
        /*   var _rowIndex:Number=event.rowIndex;
          var _columnIndex:Number=event.columnIndex;
          {
           if(_rowIndex==1)
            {
    //trace(expenses.getItemAt((event.rowIndex-1)).Month);
    expenses.refresh();
            }
          } */
        }
  ]]>
  </mx:Script>
<mx:WipeLeft id=”myWipeLeft” duration=”2000″/>
<mx:WipeRight id=”myWipeRight” duration=”2000″/>
<mx:WipeUp id=”myWipeUp” duration=”1000″/> 
<mx:HBox width=”100%” height=”50%” verticalScrollPolicy=”off”>
<mx:VBox width=”50%” height=”100%” creationCompleteEffect=”{myWipeRight}”>
<mx:Panel title=”Monthly Status of Company” id=”pChart” width=”100%” headerColors=”100%” height=”100%”>
     <mx:ColumnChart id=”myChart” dataProvider=”{expenses}” addedEffect=”{myWipeLeft}” 
     mouseDownEffect=”{myWipeUp}” creationCompleteEffect=”{myWipeUp}”>
        <mx:horizontalAxis>
    <mx:CategoryAxis dataProvider=”{expenses}” id=”ca” categoryField=”Month”/>
        </mx:horizontalAxis>
 <mx:series>
   <mx:ColumnSeries xField=”Month” yField=”Profit” displayName=”Profit” addedEffect=”{myWipeUp}”/>
   <mx:ColumnSeries xField=”Month” yField=”Expenses” displayName=”Expenses” addedEffect=”{myWipeUp}”/>
   <mx:ColumnSeries xField=”Month” yField=”ENo” displayName=”No Of Employees” addedEffect=”{myWipeUp}”/>
 </mx:series>   
     </mx:ColumnChart>
     <mx:Legend dataProvider=”{myChart}”/>
</mx:Panel>
</mx:VBox>

<mx:VBox width=”50%” height=”100%” creationCompleteEffect=”{myWipeLeft}”>
 <mx:HBox width=”100%” height=”50%”>
  <mx:Panel width=”100%” height=”100%” title=”Add New/Remove Record”>
  <mx:Spacer height=”5″ width=”100%”/>
  <mx:HBox width=”100%” height=”20%”>
   <mx:Label text=”Month” width=”100″/>
   <mx:TextInput id=”txtMonth” width=”150″ height=”30″ restrict=”A-Z,a-z” toolTip=”Value should be non numeric.”/>
   </mx:HBox>
  <mx:HBox width=”100%” height=”20%”>
   <mx:Label text=”Profit” width=”100″/>
   <mx:TextInput id=”txtProfit” width=”150″ height=”30″ restrict=”0-9″ toolTip=”Value should be numeric.”/>
  </mx:HBox>
  <mx:HBox width=”100%” height=”20%”>
   <mx:Label text=”Expenses” width=”100″/>
   <mx:TextInput id=”txtExpenses” width=”150″ height=”30″ restrict=”0-9″ toolTip=”Value should be numeric.”/>
  </mx:HBox>
  <mx:HBox width=”100%” height=”20%”>
   <mx:Label text=”No of Emp.” width=”100″/>
   <mx:TextInput id=”txtENo” width=”150″ height=”30″ restrict=”0-9″ toolTip=”Value should be numeric.”/>
  </mx:HBox>
  <mx:HBox width=”100%” height=”20%”>
   <mx:Spacer width=”70″/>
   <mx:Button label=”Add New Record” click=”functionAddRecord(expenses)”/>
   <mx:Button id=”btnRemove” enabled=”false” label=”Remove Selected Record” click=”functionRemoveRecord(expenses)” toolTip=”For Removing any item first select it from ‘Edit Records’.”/>
 </mx:HBox>
</mx:Panel>
</mx:HBox>

<mx:HBox width=”100%” height=”50%”>
<mx:Panel id=”p1″ width=”100%” height=”100%” title=”Edit Records”>
<mx:DataGrid id=”dg1″ width=”100%”  editable=”true” selectable=”true” dataProvider=”{expenses}”
 itemClick=”functionItemClick(event)” itemEditEnd=”functionitemEditEnd(event)” enterFrame=”functionCheckStatusOfRemove()”>
 <mx:columns>
  <mx:DataGridColumn dataField=”Month” headerText=”Month” editable=”false”/>
  <mx:DataGridColumn dataField=”Profit” headerText=”Profit” textAlign=”center”/>
  <mx:DataGridColumn dataField=”Expenses” headerText=”Expenses” textAlign=”center”/>
  <mx:DataGridColumn dataField=”ENo” headerText=”No Of Employee” textAlign=”center”/>
 </mx:columns>
</mx:DataGrid>
</mx:Panel>
</mx:HBox>
</mx:VBox>
</mx:HBox>
</mx:Application>

******************************************************************

******************************************************************

Enjoy Flexing.

Shardul Singh Bartwal

Posted in AIR, ActionScript 3.0, Flex | 2 Comments »