Monday, 1 July 2013

How to set Header, Scrollable Content and Footer in Android?

In GUI, we want to show the content inside the header and footer layout.

Relative Layout is the best one for android to create and maintain the header,footer and scrollable content.

Here is the example code for the relative layout with header,footer and content.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout       xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:orientation="vertical">
      <RelativeLayout
            android:layout_width="fill_parent"
            android:layout_height="40dp"
            android:id="@+id/rlHeader"
            android:background="#2F5E7A">
            <TextView
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:layout_centerInParent="true"
                  android:textSize="16dp"
                  android:textColor="#ffffff"
                  android:textStyle="bold"
                  android:text="Header Item"/>
      </RelativeLayout>
     
      <LinearLayout
            android:id="@+id/llFooter"
            android:layout_width="fill_parent"
            android:layout_height="40dp"
            android:background="#2F5E7A"
            android:gravity="center"
            android:orientation="horizontal"
            android:layout_alignParentBottom="true">
            <TextView
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:layout_gravity="center"    
                  android:textSize="16dp"
                  android:textColor="#ffffff"
                  android:textStyle="bold"
                  android:text="Footer Item"/>       
      </LinearLayout>  
     
      <ScrollView
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/rlHeader"
            android:layout_above="@id/llFooter"
          >
      <LinearLayout
            android:id="@android:id/empty"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            >
           
          <Button
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:text="Content Item1"/>
         
          <Button
                  android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Content Item2" />
         
          <Button
                  android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Content Item3" />
         
          <Button
                  android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Content Item4"  />
         
          <Button
                  android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Content Item5"  />
           
           <Button
                  android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Content Item6"  />
         
          <Button
                  android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Content Item7" />
         
          <Button
                  android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Content Item8" />
         
           <Button
                  android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Content Item9" />
         
          <Button
                  android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Content Item10" />
         
          <Button
                  android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Content Item11" />
      </LinearLayout>
      </ScrollView>
</RelativeLayout>

 Here we would need to place the content layout inside the "ScroolView"

Thank you.
 




Wednesday, 26 June 2013

Insert record dynamically in sqlite using phonegap

Inserting the record into the SQLite table is very easy.
Some times when we try to dynamically insert the record(more than 100 records) into the table will cause some problems.
That time we can able to lose some records in database.

Then how can we avoid this problem?
Yes..It's also very easy., we can use the recursive functions. This function will take care of the problem to insert the record into the SQLite table.

Now we can assume that the data from the service response is as follows,


var response =
[
   { "stateId": 1, "stateName": "TamilNadu" },
   { "stateId": 2, "stateName": "Kerala" },
   { "stateId": 3, "stateName": "Karnataka" },
   { "stateId": 4, "stateName": "AndraPradesh" },
   { "stateId": 5, "stateName": "Maharastra" },
   { "stateId": 6, "stateName": "Orissa" },
   { "stateId": 7, "stateName": "MadyaPradesh" },
   { "stateId": 8, "stateName": "WestBengal" },
   { "stateId": 9, "stateName": "Assam" },
   { "stateId": 10, "stateName": "Gujarat" },
   { "stateId": 11, "stateName": "JammuKashmir" }
]

The above response will looks like JSON format. So we can conver the array format as,   

     var myObject = jQuery.parseJSON(response);
     myObject = eval(myObject);       
     fnStateInsert(myObject, 0);


The recursive function of inserting the record into the table are as follows,

function fnStateInsert(serviceResponse, i) {
    console.log("Service Length : " + serviceResponse.length + " i : " + i);
    var dbinsert = window.openDatabase("IVoteDB", "1.0", "IVoteDB", 1000000);
    if (i < serviceResponse.length) {
        var dbinsert = window.openDatabase("IVoteDB", "1.0", "IVoteDB", 1000000);
        insertQuery = "INSERT INTO STATEMASTER(STATEID,STATENAME) VALUES (" + "'" + serviceResponse[i].stateId + "','" + serviceResponse[i].stateName + "')";
        dbinsert.transaction(function insertUserPrefDB(tx) {
            tx.executeSql(insertQuery);
        }, errorCB, function successCB() {
            /* Recursive Function For Inserting the State in Local Db */
            fnStateInsert(serviceResponse, (i + 1));
        });
    }
    else {
        alert('State Inserted Successfully');
    }
}

Now you will insert  all records into the table without losing the data.

Thank you....

Wednesday, 8 May 2013

Get Data from JSONArray inside an array using JQuery

The service will return the JSONArray inside an Array, that time we would need to use the following method to get a particular data from the service response.

The JSONArray inside an array format service response will looks like as follows,

var response= {
    "Name":
     [
        [{"Key": "A", "Value": "Sample1" }],
        [{ "Key": "A","Value": "Sample2"}],
        [{"Key": "A","Value": "Sample3" }],
        [{"Key": "A","Value": "Sample4" }]
    ],
    "Title": "Office"
}


Now, we want to get the data as "Value" from the above response.

We will use the the following jquery, we would get the output.

$.each( response.Name, function( index, result ) {
  alert( index + ": " + result[0].Value );
  console.log( index + ": " + result[0].Value );
});