Somms.NET
Somms Multimedia Solutions
por Julio Rabadán González

Recently I needed some modal and waiting messages in a PhoneGap app. My first approach was to use a javascript solution, based in jQuery, but the performance and quality of native modal messages are unquestionable. So I decided to program it, and here you have the result.

First I created a new Java class to handle all the staff. Place it with the rest:

package com.phonegap;

import android.app.Activity;
import android.app.AlertDialog;
import android.app.ProgressDialog;
import android.content.Context;
import android.content.DialogInterface;
import android.content.DialogInterface.OnClickListener;
import android.content.res.Resources;
import android.os.Handler;
import android.os.Message;
import android.view.Window;
import android.webkit.WebView;

public class Notification {
	
	private Context mCtx;
	private WebView mAppView;
	private OnClickListener clickListener;
	
	private final int POSITIVE_BUTTON = -1;
	private final int CANCEL_BUTTON = -2;
	
	private ProgressDialog progressDialog;
	

	public Notification(Context ctx, final WebView appView)
	{
		this.mCtx = ctx;
        this.mAppView = appView;
        clickListener = new OnClickListener() {
			
			@Override
			public void onClick(DialogInterface dialog, int which) {
				switch (which)
        		{
        			case POSITIVE_BUTTON:
        				appView.loadUrl("javascript:navigator.notification.successCallback()");
        				break;
        			case CANCEL_BUTTON:
        				appView.loadUrl("javascript:navigator.notification.failCallback()");
        				break;
        		}
				
			}
		};
	}

	/**
	 * Shows a custom alert window with buttons.
	 * @param message Text to show
	 * @param options Array with strings for title (0), positive button (1) and negative button (2), in this order
	 */
	public void prompt(String message, String[] options)
	{
		 AlertDialog.Builder alertBldr = new AlertDialog.Builder(mCtx);
         String title = (options[0]!=null ? options[0] : "PhoneGap" );
		 alertBldr.setMessage(message);
         alertBldr.setTitle(title);
         if(options.length>1 && options[1]!=null)
         { 
        	 alertBldr.setPositiveButton(options[1], this.clickListener);
         }
         if(options.length>2 && options[2]!=null)
         {
        	 alertBldr.setNegativeButton(options[2], this.clickListener);
         }
         alertBldr.show();
         return;
	}
	/**
	 * Shows an activity modal message, with a spinning wheel
	 * @param message Text to show
	 */
	public void activityStart(String message)
	{
		this.progressDialog = ProgressDialog.show(mCtx,"",message, true);
		
	}
	/**
	 * Closes the activity modal message.
	 */
	public void activityStop()
	{
		this.progressDialog.dismiss();

	}
}

Modify DroidGap.java to add the new Javascript interface.

Add this after private class member declarations of DroidGap.java:

	private Notification mNotif;

Add this at the end of the bindBrowser method of DroidGap.java:

    	mNotif = new Notification(this, appView);
    	appView.addJavascriptInterface(mNotif, "Notificator");

And now, the javascript part.
Warning: this code will not work with the actual iPhone solution for prompt. The Java-Javascript interface does not allow to pass objects as parameters, and I have to use a string array. The best option is to modify the iPhone function to mimic this one, the limiting one.

/**
 * Start showing an activity modal message
 */
Notification.prototype.activityStart = function(message)
{
	Notificator.activityStart(message);
};
/**
 * Stop showing the activity modal message, if it's currently
 * spinning
 */
Notification.prototype.activityStop = function()
{
		Notificator.activityStop();
};
/**
 * Show a prompt modal message.
 */
Notification.prototype.prompt = function(message, title, buttonLabel,
		cancelButtonLabel, successCallback, failCallback)
{
	var options = new Array();
	if (title)
		options[0]= title;
	if (buttonLabel)
		options[1] = buttonLabel;
	if (cancelButtonLabel)
		options[2] = cancelButtonLabel;

	this.successCallback = successCallback;
	this.failCallback = failCallback;
	Notificator.prompt(message, options);

};

That’s all

Categorías: Android, Informática, Java, Javascript, PhoneGap, Programación
Comentarios: RSS 2.0.
Tanto los comentarios como los 'pings' están cerrados.