Saturday, March 26, 2011

Create your first Android App , You donot need to be a programmer for that !!!!!!

Google Labs comes up with another invention & this one 
I bet you is gonna be a super hit !!!
Google App Inventor (Beta) is an Android app maker which 
lets you create your own Android apps & that too on a browser , 
and best thing about it is that you donot need to be
a programmer for that !!!!!

So lets get started 
     Computer requirements 
      1 . You need to have java 6 installed on your computer .
           You can download the  latest jdk from
       2.Install the App Inventor Setup 
          a) For Windows users you can download it from 

          b) After the installation of app inventor it may ask for the location 
          of the software , if it does so  then specify it as 
           C:\Program Files\Appinventor\commands-for-Appinventor  
           because this is where the adb.exe file is located .
       3.  Once you are done with this please login using your 
             google account to         
            Click on My Projects and now you are ready to create 
            your first app .
           Building my first App
           Click on New , Give a name to your project . Oki Lets 
           name it MyHome .
            MyHome:- Its a simple app in which you have pics of 
            your family member ,when you click on the pic a call is 
            established  to the family member .
           So first you decide what your screen should look like .
           For that we will be using Labels & Buttons .
           On the left hand side of your browser you have Basic List
           From that select the Components Button and drag & drop it
           on to the screen .
           Next add a Label to the screen .
           In my MyHome App I have included four buttons for 4 family
           members & a label for each of them .

           Step3 :
           Set the Label text properties to the text of 
           of your choice  .
           Label1: Mother
          Step 4
           Your screen should look like this now .
           Once done with this,the next step is to set the properties of the
           Button .Clear the text properties of the button .
           To set the Image Properties : Click on Image on the Properties box
           and upload the image of your choice .
           Your screen should look like this now 
            Step 5 :
            You need to establish a call when you click on the pic for that 
            you need to add the phone component .The Phone component 
            is available in the  Social  Tab of the Pallete .
             Choose the Phone Call Component and drop down it to the Screen .
             We have four members & so we will be using four phone call 
              components .
             Step6 :
             Set the Phone Call Properties .
             Enter the phone nos in each of the phone call component with the
             nos of the corresponding members .

 So this ends up the Design of your App . 
Now the next step is to build the Application Logic .  

On your browser click on the Open Block Editor Button . 
A file will be downloaded(AppInventorForAndroidCodeblocks.jnlp)

Double Click on the file and wait till the Block Editor opens , it may 
take sometime though around 30-50 secs .

Once the block editor is open the next step is to connect it with
a device .
If you are using a emulator click on New Emulator& select a emulator .
Now click on Connect to the Device button & wait till the device is 
connected .

           Step 7 .
           Select Button1 on My Blocks Editor .
           From the list of options select the Onclick block 
            Step 8
            Select Phone Call on My Blocks Editor
            Form the list of options select the   MakePhoneCall Block

               Repeat this step for each of the buttons .
             So finally you are done with the application logic  & you can
             download it to your Android Phone or computer to use .

             If you want to emulate it in an emulator then you will have
             to install it on your computer .
             Download the app you have created :- For that next to the
             Open Block Editor Button you have one more button that
             gives to the option of downloading it to the computer .
              For trying your app on a emulator :
             1. Download the app and place the app in the folder         
               C:\Program Files\Appinventor\commands-for-Appinventor    
              2. Open the cmd prompt on your computer .
                Make the root directory of cmd prompt as
                cd  C:\Program Files\Appinventor\commands-for-Appinventor    
               3. Install the apk file my running the command 
                adb install MyHome.apk 
            So you have finally installed  the apk file & now you can 
            view your working MyHome app on your emulator !!!!!!
    If you still have any problems creating  your first app , please do 
    If you liked something about this article ,you can show your appreciation
    by a vote of thanks .

Thanks for reading ,
Vaishakh Thayyil 


Sunday, March 20, 2011

Google Latitude Mashup With Google maps

My Second post was on getting the user's location using
google latitude/badge api .This thread is definitely a
continuation of the earlier post , here i will show you how
to display the user location on google maps .

For that we will be using a jquery plugin called JQUERY:GMAP3

Create a php file that will return the latitude & longitude
Make an ajax call to the php file
Display the google latitude result on google maps


######getposition.php #######

//Replace the YOURUSERID in the url below with your Badge userid . 
$url="" ;
// We get the content
$content = file_get_contents( $url );
print($content); //This will return the data in json format

Step 2 & Step3

For the ajax calls we will be using jquery functionalities directly ,a call
will be made to the php page, which will return me data in json format
which we will parse using jquery parseJSON() function .After this  using
the jquery GMAP3 library(
we will be displaying the marker on google map .

#### Showmap.html ######

    <script type="text/javascript" src="jquery-1.4.4.min.js"></script>        
    <script src="" type="text/javascript"></script>
    <script type="text/javascript" src="gmap3.js"></script> 

        margin: 20px auto;
        border: 1px dashed #C0C0C0;
        width: 500px;
        height: 250px;
        overflow: auto;
        width: 100px;
        margin: 20 auto;
        float: left;
        width: 20px;
        height: 20px;
        margin-left: 20px;
        border:1px solid #000;
    <script type="text/javascript">   

// ajax call to the php page   
type: "POST",
url: "getposition.php",
success: function(msg){
var obj=$.parseJSON(msg);
// Parse data recived .For more details check  //
var latitude=obj.features[0].geometry.coordinates[1];
var longitude=obj.features[0].geometry.coordinates[0];
var coord=new google.maps.LatLng(latitude,longitude); 
{ action: ':addMarker',
latLng: coord,
center: true,
zoom: 14,
mapTypeId: google.maps.MapTypeId.ROAD
    <div id="test1" class="gmap3"></div>

This was just a basic mashup of google latitude & google maps .
If you want to use all the functionalities of google maps you can
which has clear explanation of using google maps jquery plugin.

If you have still queries about this thread , please do comment .


Saturday, March 19, 2011

Easier way to use Google Latitude

 Click Like If you Agree
Hi Everyone ,

My first post was about getting the Location using Google Latitude Api using OAUTH,

it is extremely useful when you want to create an application that gets your app users

location and you can mashup with google maps api or yahoo maps to create killer apps .

But if you are creating a system in which you create google latitude account for your

customers  or you want to track your kids from your home , there's  a simpler method

 for doing that , a shortcut rather than going the OAUTH way i.e. Google Latitude Badge .

Step 1

Log into your google account through which you are linked to Google Latitude

Step 2



About This Blog

This Tech Blog is about a month old and increasing
number of pageviews and a steady increase in
our loyal readers has prompted us in writing
unique articles that will be of great use to all the
webmasters .The blog currently has only 15+
unique google tricks and hacks , we will be adding
new tricks as and when we stumble upon something
useful to our readers .

  © Blogger templates The Professional Template by 2008

Back to TOP