Sunday, April 28, 2013

Native Android Client Architecture And Frameworks

Hi guys,

We all know principle of kiss. We should keep our software architectures simple as possible. One way to do that is decide architecture and narrow down the problem before going for solution/decisions. Choose good frameworks/plugins, this will make your code simple and readable. And of-course this strategy encourages re-usability, which is a way of fast development.

In this post I will try to simplify client application architecture (android client-server model) and provide list of famous frameworks. To solve solution of

  • Threads
  • Network operations
  • Cache/database
  • Re-usability 

Flow of application will be like below

So upon request or event trigger

  • First apply validations
  • Call service to execute request
  • Service with execute it can initiate thread to fetch data from server, or read from database(cache) or other facilitate other kind of requests
  • Service will return model, some data or exception
  • Services here are not android service. This layer helps you to reuse code in activities/fragments.

So what frameworks we can use in this architecture

   1.   View (Activity/Fragments)
           For view we have 
  • Robojuice  It help to bind xml view(gui), resources with objects. These annotation reduce line of code and enhance readability. 
  • Actionbarsherlock. Helps in managing navigation between view, standardization of actions for view, menu buttons on page for android 4.0+   
  • Droid4me helps you handling activity/fragment life cycle, exception handling , thread management, intra-component communication, file download management.
   2. Validations
  •  You can use my work utils jar.
  • Apache commons-validator, has xml validations and common validation methods (email addresses, dates, URLs, etc.)
   3. Thread
  •  For thread you can use Async tasks
  • You can use Robospice. It provides solution for threading, parsing data (xml, json), notification to view, exception handling.
  • You can use Droid4me for thread management.
   4.  Database manager
  • OrmLite use to create persist objects. So you dont need to populate objects after query and write code for operations like insertion, deletion, update etc your self.
  • Sqlitegen, use to create DAOs(data access object), easy to convert query results into object. 
  • ActiveAndroid allows you to save and retrieve SQLite database records without ever writing a single SQL statement. Each database record is wrapped neatly into a class with methods like save() and delete().
   5.  Network Manager 
  • Spring Restful helps communicating with servers over http, https protocols, methods can be post, get, put, delete. You can parse response direct into json, xml with the support of gson, jackson and other parsers for xml and json. (Recommended)
  • Use  Android-query to get json, xml, inputstream, files from server.

Sunday, April 14, 2013

Dependency injection android (roboguice review)

Pre-req: you should know about development in android.
I am using: For this tutorial I am using windows xp, maven, android 2.33 , spring restfull android, robojuice

Hi guys,

People those are familiar with spring and Inversion of control, They knows that IOC provides good level of abstraction in managing object(s) i.e initializations, object management, association management. And also decrease lines of code. So lets see roboguice.

To install this first create a maven base project.

1) Add dependencies for roboguice into the project (POM.XML).


2) What we have?
    We can megre 2 steps i.e declaration and initialization, we can avoid object creation and management on different  level (code liens) at class level.

We can create service and bind it with our activities/fragments. This provides alot of ease in fast development.

we can also bind android resources string/arrays/color/config etc to objects.


3) List of warped components 
   Robo juice warped many android components, list of these components are below

  • RoboActivity
  • RoboListActivity
  • RoboExpandableListActivity
  • RoboMapActivity
  • RoboPreferenceActivity
  • RoboAccountAuthenticatorActivity
  • RoboActivityGroup
  • RoboTabActivity
  • RoboFragmentActivity
  • RoboLauncherActivity
  • RoboService
  • RoboIntentService
  • RoboFragment
  • RoboListFragment
  • RoboDialogFragment

To use feature of robojuice, all you need is to extend your components with one of respective above warped components. for example if you want to use robojuice dependency management in your activity then extent your class with  RoboActivity  instead of Activity.

4) Create and activity
  Lets create a activity with robojuce, lets say we have  list of software houses.
 So I have a list of software houses in string.xml

 and my activity is like below:

5) Lets create a factory to execute web service calls (Powered by Spring rest for android)

i) Create an interface  ResponseFctory 

ii) Create implementation of ResponseFctory , 
       Add annotation @Singleton on the top of implementation, because we are creating a factory of singleton scope.

iii) Create configuration file to bind Interface with implementation
   A class extends AbstractModule and bind interface with implementation in configure function
with command

below is example

iv) Register custom AbstractModule  with robojuice 
Create a robojuice.xml file in res/values folder. Add path of your Configuration class like below

    <string-array name="roboguice_modules">

v) Use this factory inside your activity like below

6) Benefits

i) Decrease association. We can bind parameters with function. Hence increase decoupling.
ii) Promote polymorphism, Singeltons and interfaces. Hence increase decoupling.
iii) Object creation and management. you dont need to initialize objects on different level (lines in code) of class.. Hence increase readability
vi) Decrease lines of code. Enforce  best practices.

Source code available.

Sunday, April 7, 2013

Review Twitter Bootstrap

Using: For this tutorial I am using Netbean IDE , windows xp plateform, php as server side language.
Pre-req: You should know about html, java script and css.

Preview my work here

I was looking into twitter bootstrap so here is my findings.

A) Structure of application:
    All you need is download , extract and and put the folders into your application. It has js, css and img folders. you can use it with any server side language. For demonstration I am using php. So after putting the files my project lookes like below:

B) Structure of web page:
    For creating a web page, we have 2 options
    1) Use Table structure/layout to display your contents.
     2) Use Divs  to show contents , then you need to concentrate on css to set thes div on required positions,

  Twitter Bootstrap solves layout issues. They provide css of div to divid your pages into rows and columns. So we dont need to worry about  positions of the Divs to show our contents.

   <div class="row">
        <div class="span1">contents 1</div>
        <div class="span1">contents 2</div>
Column span levels are from 1 to 12.

Responsive Bootstrap: They have css/style created for tabs, mobiles and desktop. So your structure can easily adjust for device and desktop. All you need is to include a meta tag and css file

  1. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  2. <link href="assets/css/bootstrap-responsive.css" rel="stylesheet">

Their recommendation: Use on a limited basis and avoid creating entirely different versions of the same site. Instead, use them to complement each device's presentation. Responsive utilities should not be used with tables, and as such are not supported.   (Reference)

So I  made a sample page with rows and colums on desktopn this lookes like

On mobile phone it lookes like below:

C) Widgets
     We have list of wigets below. These can are adjustable on both devices and destops. So that means you can use intratcive and cool wedgits on your mobile applications.

  1.  Button groups 
  2.  Button dropdowns 
  3.  Navigational tabs, pills, and lists 
  4.  Navbar 
  5.  Labels 
  6.  Badges 
  7.  Page headers and hero unit 
  8.  Thumbnails 
  9.  Alerts 
  10.  Progress bars 
  11.  Modals 
  12.  Dropdowns 
  13.  Tooltips 
  14.  Popovers 
  15.  Accordion 
  16.  Carousel 
  17.  Typeahead 

So here is a view on desktop
and how the look on mobile device

D) Javascript
    Here we have

  1. Event handling (like we do in web app i.e clicks, selections, display, inrection etc
  2. Transitions 
  3. Custom popup called Modals 
  4. Tooltips
  5. Carousel

E) Style
     There are amazing style sheets available that workes for mobiles, tabs and destop. You can create beautiful headings, labels, buttons, meues , carosels, thumnails etc. It provides redability on mobile devices.


F) Customization

   We can easily customize our applications. And with it we can create application for both mobile and dektops. It will definitly decrease the development cost. Because I have noticed that web developer spent most of the time in adjectment of contents position on page and we put extra efforts to make our web pages compatible with mobile browsers. In twitter bootsrap javascript is very usefull, provides all kind of event handling that we need in a web application.