How to add/use plugins in Phonegap 3.0

Phonegap 3.0 plugins can be added to the project using the CLI (Command Line Interface). Phonegap 3.0 had made the developers life much easier to utilize the plugins. We just need to follow two basic steps to use the plugins.

Here are the two basic steps we need to flow.
1. Adding the plugin to application
2. Implementing the javascript function

Before moving forward, I would like to elaborate the basic structure used with Phonegap 3.0 plugins. The plugins will be having the below structure. Continue reading

Windows Store App : Flipview custom styling – Part 2

Introduction :
Flip view by default comes with the style templates, which can be customized to produce a different appearance. Editing or styling the flip view container or its next and previous buttons can be done through these style sheet.

Description :
By default flip views for Windows store app have their own Next and Previous buttons, which are defined in their default styles sheet with a class named as “Arrow”. We can find the default style sheet from this MSDN Link .

Let’s replace the default arrow with a custom Image to change the flip view appearance. Continue reading

Getting geo-coordinates from address in PhoneGap application using Google API

In this post we will discover the use of Google API to get the latitude and longitude by passing the address/location in PhoneGap application.

It is very easy to get the geographic coordinates (latitude & longitude) from a particular address using Google API. Google API exposes Geocoder() method which takes the address as input parameter and returns the geometry.location as output. We can parse the geometry.location to get the latitude and longitude value.

Here is the code snippets to get the latitude and longitude value from specific address. Continue reading

Simple steps to create phonegap 3.0 plugin for Android

Phonegap plugins allows us to customize the way to use the native features as per our need. Basically, the communication between JavaScript and native code is accomplished by the bridge provided by Phonegap.
Starting with the Android platform, to develop plugin, it follows some basic flow. We need to call cordova.exec() function in JavaScript, which will be mapped with our execute() method defined in our native java file. We can also pass useful parameters and can also define the success and error callback methods to trace the flow.

Here are three basic steps we need to flow to create the plugin.
1. Creating the Native Java Interface
2. Creating the JavaScript Interface
3. Configuring the plugin Continue reading

Getting address from latitude/longitude value using Google API and PhoneGap

In this post we will discover the use of Google API to get the current address and type of address by using the PhoneGap geolocation API and Google API.

Sometimes we need to get the address of a location from geolocation value. It is very very easy to get the same using Google API and PhoneGap. First we need to get the geolocation value i.e latitude and longitude using PhoneGap geolocation API.

Here are the steps that we need to follow.

1. Include the Phonegap/Cordova JavaScript file and Google API JavaScript file inside your html page.

<script type="text/javascript" src="phonegap/cordova.js"></script>
<script type="text/javascript" src=";sensor=false"></script>

Continue reading

Windows Store App : Flipview custom styling – Part 1

Flipviews are a common control provided along with the windows store library. They are commonly used for magazines and news applications where reading content page wise is essential. It provides a unique swipe effect where you can see pages sliding horizontally or vertically according to your requirement.

For Swipe gestures using mouse,  as per the default style, there are arrows on both side boundaries of the flip view pointing towards the required direction of movement.

We will Look into a situation where we need to remove the arrows of the flip view from it’s style. This situation may arise when we want an entirely touch application where swiping the screen might be the only option. Continue reading

Rendering result in desire format making ajax call to local method in Rhomobile

While developing application, we sometimes need to make ajax call to local methods so that we can render the updated data without refreshing the whole page. We can achieve this using RhoMobile. If we need, we can call local method and get the data using JavaScript ajax call and finally render them into the current view without reloading it.

We can get desired format of output, using the advance use of ‘render’. If we need to render some data in different format like STRING, JSON, XML, following are the different ways to do the job.

Method 1 : Render as String
def get_string
render :string => ‘This is a sample line’
end Continue reading

Counting total rows in a table view having different section with Alloy using Titanium

Table view may contain different sections where each of those section may contain several rows. Here I am describing the way to calculate total number of rows present in a table view which have different section.

Summary :
Now easily we can get the total number of rows present on a table view with Alloy using Titanium.


Written ByRaju Mahato, Software Developer, Mindfire Solutions

Few issues and solutions in iOS7 using Phonegap 2.6

Issue #1 : Status bar issue in ios7 using phonegap:

In Phonegap by default the apps are not with full screen.

But in iOS7, all the applications are running full screen so the status bar is overlapping with the top part of the webview/page.

Open MainViewController.m file (present inside classes folder)
Place the following code in (void)viewWillAppear:(BOOL)animated class.

if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {
       CGRect viewBounds = [self.webView bounds];
       viewBounds.origin.y = 20;
       viewBounds.size.height = viewBounds.size.height - 20;
       self.webView.frame = viewBounds;

Continue reading

Display red edit button on left side of rows in a table view using Alloy with Titanium

Introduction :
For iOS we can implement the row edit functionality in a table view.
Here I am describing the same with below video.

Summary :
Following above video we have learned to display edit button along with red delete button on rows using Alloy with Titanium.


Written ByRaju Mahato, Software Developer, Mindfire Solutions