Sunday, January 22, 2012

DataGrid Part 4 - DataGrid Header

If you have not read the previous posts, you might want to start from the first post.

Again, referring to the code segments below, we are discuss the final step, DataGrid.refresh() in this post. As you might guess, this function eventually constructs the whole DataGrid.
DataGrid.setNoDataText("No data available");
DataGrid.addColumnStyle(new cls_datagrid.column("Header 1", "header_5", 50));
DataGrid.addColumnStyle(new cls_datagrid.column("Header 2", "header_4", 80));
DataGrid.addColumnStyle(new cls_datagrid.column("Header 3", "header_3", 130));
DataGrid.addColumnStyle(new cls_datagrid.column("Header 4", "header_2", 120));
DataGrid.addColumnStyle(new cls_datagrid.column("Header 5", "header_1", 80));
DataGrid.addColumnStyle(new cls_datagrid.column("Header 6", "header_0", 140));
DataGrid.setDataSource(DataSource);
DataGrid.refresh();

The first thing to construct in DataGrid and it is also the part to be discussed in this post is the DataGrid header. As you might recall the screen of the DataGrid in the very first post as shown on the left.

The Header is referring to the top most of the DataGrid, which column header is placed i.e. "Header 1", "Header 2" and so on and so forth. The objective of this post is to build the basic header to hold the columns that defined and being added via the function DataGrid.addColumnStyle() above. The others functions like sorting & resizing will be discussed further in future posts.


Sunday, January 15, 2012

DataGrid Part 3 - DataGrid.column

If you have not read the previous posts, you might want to start from the first post.

We have discussed the DataSource in previous post, we will continue discussion on the DataGrid.column in this post. Just a re-cap, we have following codes in previous post. DataGrid.column is parameter to DataGrid.addColumnStyle() as shown below.
DataGrid.setNoDataText("No data available");
DataGrid.addColumnStyle(new cls_datagrid.column("Header 1", "header_5", 50));
DataGrid.addColumnStyle(new cls_datagrid.column("Header 2", "header_4", 80));
DataGrid.addColumnStyle(new cls_datagrid.column("Header 3", "header_3", 130));
DataGrid.addColumnStyle(new cls_datagrid.column("Header 4", "header_2", 120));
DataGrid.addColumnStyle(new cls_datagrid.column("Header 5", "header_1", 80));
DataGrid.addColumnStyle(new cls_datagrid.column("Header 6", "header_0", 140));
DataGrid.setDataSource(DataSource);
DataGrid.refresh();
DataGrid.column is a static class in DataGrid class. As you might notice, column is a very simple class with getter and setter methods.
public static class column{
  
  private String strColumnName;
  private String strFieldName;
  private int intWidth;
  private int intIndex;
  
  public column(String DisplayName, String FieldName, int width)
  {
   strColumnName = DisplayName;
   strFieldName = FieldName;
   intWidth = width;
  }
  
  public void setIndex(int index)
  {
   intIndex = index;
  }
  
  public int getIndex()
  {
   return intIndex;
  }
  
  public String getColumnName()
  {
   return strColumnName;
  }
  
  public String getFieldName()
  {
   return strFieldName;
  }
  
  public int getWitdh()
  {
   return intWidth;
  }
  
  public void setWidth(int width){
   intWidth = width;
  }
 }

Let's examine the class DataGrid, finally. :)
public class cls_datagrid extends LinearLayout{

 private Context mContext;
 private members_collection mc;
 private String strNoDataText;

 class members_collection{
  public ArrayList<column> COLUMN_STYLE;
 }

 public static class column{
  
  private String strColumnName;
  private String strFieldName;
  private int intWidth;
  private int intIndex;
  
  public column(String DisplayName, String FieldName, int width)
  {
   strColumnName = DisplayName;
   strFieldName = FieldName;
   intWidth = width;
  }
  
  public void setIndex(int index)
  {
   intIndex = index;
  }
  
  public int getIndex()
  {
   return intIndex;
  }
  
  public String getColumnName()
  {
   return strColumnName;
  }
  
  public String getFieldName()
  {
   return strFieldName;
  }
  
  public int getWitdh()
  {
   return intWidth;
  }
  
  public void setWidth(int width){
   intWidth = width;
  }
 }

 public cls_datagrid(Context context , AttributeSet attrs) throws Exception {        
  super(context, attrs);
  setOrientation(VERTICAL);
  mContext = context;        
  mc = new members_collection();
  mc.COLUMN_STYLE = new ArrayList<column>();
 }

 public void addColumnStyle(column columnStyle)
 {
  mc.COLUMN_STYLE.add(columnStyle);
 }

 public void setNoDataText(String strText)
 {
  strNoDataText = strText;
 }

}
Couple of things to note here.
  1. DataGrid extends LinearLayout
  2. member_collection class is just a placeholder to hold variables that to be shared amongst all the classes in the package.
  3. In the construction, we initialize the columns as an ArrayList and assign it to mc.COLUMN_STYLE
  4. function addColumnStyle(column) simply take DataGrid.column and put it in the ArrayList
  5. setNoDataText() is used to assign string value to display for an empty DataGrid
So we have an incomplete DataGrid class for now which has only DataGrid.column feature.

Next, DataGrid Part 4 - DataGrid Header

Saturday, January 7, 2012

Cross platform mobile application framework

I just learnt the are some cross platform mobile application framework which allows you to develop once and deploy to multiple platform , for example, application developed in Android and deployed into IOS.

The concept is to develop everything in HTML5, Javascript and CSS using the framework. The application then will be compiled via service provider and you will have your application in the platform you want.

One of the framework is called PhoneGap. What attracted me in PhoneGap is the storage features which I do not find in other framework.

Here is the features list.
  1. Accelerometer
  2. Camera
  3. Capture
  4. Compass
  5. Connection
  6. Contacts
  7. Device
  8. Events
  9. File
  10. Geolocation
  11. Media
  12. Notification 
  13. STORAGE
That's all about the good stuff. The bad thing is that you have to pay for it, it is not fully free. The service you have to pay for is the compilation in the cloud, PhoneGap Build. 



I'm not sure how it works. What is the definition of developer? and how to define public apps? Further look at the support issue, I realized that it is not cheap at all, even for basic, it costs $249.99 per year. It is clear that not every individual developer could affords it. It does come with a price uh! I can't find FAQ section in the website, hence I still cannot understand how's the pricing works. There is PhoneGap Build service included in the support package, does it mean the FREE for developer is never going to happen because I do need to pay even for the basic package. 

Another thing to note that, it is not easy to switch to another language, in this case, Javascript and the framework when you have already familiar with your current language so well. Simply put it, you have to rewrite everything from the start. It is not a easy task! However, the advantage of multiple platform deployment does outweigh the effort of re-development.