Archive for the ‘mobile’ Category

Friday, February 26th, 2010

As I mentioned in my previous post I have been working through  the OpenGL ES 2.0 book and have been porting many of the examples to Android. I am going to go through some of the progress I have made so far.

Besides getting the various Android side of things set up the biggest annoyance I found was that all of the shaders in the examples were hard coded.  They all look something like this inlined in the code:


GLbyte vShaderStr[] =
"attribute vec4 vPosition;    \n"
"void main()                  \n"
"{                            \n"
"   gl_Position = vPosition;  \n"
"}                            \n";

GLbyte fShaderStr[] =
"precision mediump float;\n"\
"void main()                                  \n"
"{                                            \n"
"  gl_FragColor = vec4 ( 1.0, 0.0, 0.0, 1.0 );\n"
"}

Obviously this makes it fairly difficult to edit and test shaders in an external program so the first thing I did was create a mechanism to load a shader from the res/raw/ resource directory, drop it into native code, and compile/link into a shader program .  These code snippets should get you started:

In Android/Dalvik land load a shader into a string:


String vShader = readFileAsString(GL2JNIView.this.getContext().getResources()
.openRawResource(R.raw.vshader));

Send the string to native land and load it into a character array, compile/link the shader program, and free the pointer:


char *vertexShader = env->GetStringUTFChars(vShader, 0);

//load shader program

env->ReleaseStringUTFChars(vShader, vertexShader);

Here is a quick overview of some of the examples I have been working on, screen shots are straight from my Nexus One:

The mighty spinning cube demo, with a simple vertex and color fragment shader.  One major difference between ES 1.x and 2.0 is that all of the transformation functions have been done away with, instead you must manually manipulate a matrix and pass it into the vertex shader and multiply all the vertices by this matrix, fortunately the ES 2.0 book sample code comes with functions that map the old functions to the new approach.

Here is the multi texturing example from Chapter 10 of the ES 2.0 book, multitexturing becomes a fairly simple formula which is performed inside of the fragment shader.

The Cube Map texturing example from Chapter 9 of the book.  ES 2.0 provides a straight forward method for rendering things like reflections on objects by using a cube texture map.

This is a shot of the Particle System demo from Chapter 13 of the book.  It is difficult to get a good screen shot of all of the particle movement.  All of the particle parameter are passed into the shaders and calculations are performed by the GPU.

One of the first things I wanted to do after I got done with the basics was to load a textured .obj model in dalvik/Android and load it into native code and render it using vertex/fragment shaders.  This is a sample model from this very cool OpenGL ES android tutorial/project.

The ES 2.0 book assumes that you already know how to do graphics programming with OpenGL as well as program Shaders , so I have been using many other resources for learning GLSL and graphics programming in general.  I have found that the best resources are usually just OpenGL books from 5 years ago.  This is an example of a sepia filter from this great book: Shaders For Game Programmers And Artists.  The flag also waves using a simple sin() method on the z coord in the vertex shader.

This is a simple 4-sample blur shader from the above book.

This is my attempt at creating a motion blur shader. It renders the cube to a Frame Buffer Object then interpolates between a previous frame.  I haven’t gotten it to perform the proper blending of the two frames but I am pretty close to getting it to work.

Per-Pixel Lighting

I have been trying to get the per pixel lighting example from the ES 2.0 book to work but unfortunately they only provide the Shaders and a RenderMonkey workspace which leaves out some fairly crucial elements for actually getting it to run in code.

Next up I want to get familiar with all the various lighting effects you can do with shaders.  Shaders provide a much more flexible lighting model than the fixed function lighting options in ES 1.x, but it also makes doing lighting not as straight forward as it was.  After that I would like to put together some scenes and maybe get a simple game engine going with flexible shader options.

Friday, February 5th, 2010

* Update: r3 of the Android NDK has been released with OpenGL ES 2.0 support get it here *

The Motorola Droid and the Nexus One are the first Android phones with graphics hardware that support OpenGL ES 2.0.  Developers have not yet had access to the advanced graphics API in the latest Android SDK/NDK , but it looks like official support for ES 2.0 in the Android NDK is imminent as the latest NDK code in the Android Open Source Project includes the libraries needed to access the OpenGL ES 2.0 API.  If you are impatient like I am and would like to dip your toes into the strange world of vertex and fragment shaders,  here is a quick way of getting OpenGL ES 2.0 support up and running in the current release of the Android SDK. ( This has been tested on OS X and a Nexus One, I would imagine it would work with Linux and the Droid too, no idea about Windows)

The first step is to download the latest Android source code from AOSP.  The project we are interested in is in: development/ndk.  Copy the ndk directory wherever you want.  The NDK is  missing the platform specific ARM toolchain binaries so we are just going to get those from the 1.6 release of the NDK which you can find here.  Copy the build/prebuilt/  directory of the 1.6 NDk to the build/ directory of the 2.0 NDK.

The next step is to run the host-setup.sh script in build/

sh build/host-setup.sh

After the set up script runs we are ready to build the sample hello-gl2 that conveniently comes with the new NDK.  This project contains all the code you need to set up the application and native parts to support ES 2.0.

make APP=hello-gl2

This will compile all of the native code and copy the binary to the libs/ directory of the Android project.

After this is finished we can build and install the application found in apps/hello-gl2/project/ onto our Android 2.0+ device and see ES 2.0 in action!

Pretty awesome right?  I will save actual OpenGL ES 2.0 walkthroughs for later as I go through the ES 2.0 book, but the source included in the hello-gl2 project should be enough to get you started.  Obviously this is all unsupported and unofficial and you should more than likely not release apps using these APIs onto the market until the Official SDK is updated.

You certainly wouldn’t want to release a Live Wallpaper using this code because it would probably get 1 star as most users are unimpressed that you got ES 2.0 working ;)

Monday, August 25th, 2008

QR Codes are a great way to share information with mobile phones. Originally used to track car parts, QR codes are now used to quickly and easily spread information to mobile users. For example a company can put a QR code in a magazine that contains the URL to their website. Instead of the user having to type in a long URL on their phone they can simply take a picture of the QR Code with their camera phone and have their decoding software open the link for them. For more uses of QR Codes check out this blog.

I am going to go through a quick example of encoding and decoding QR codes in Android.

Encoding

There are a number of services and libraries available for encoding QR Codes. The actual encoding process is a bit more involved than I would like to go through for this entry and we generally would not want to do the actual encoding on the client. Instead we will harness the power of the “cloud” to do the heavy lifting for us. In this case we will use the Google Charts API which just recently expanded to include QR codes. The API allows for a number of options such as size, error correction type, encoding type, and margins (the general rule for QR Codes is to have a 4 column/row white border around the barcode so that the decoding software can get a better “lock” on it)

The code below makes an http request to the Google Charts API with the URL encoded text we entered in the EditText view and populates our ImageView with the resulting image.


encodeButton.setOnClickListener(new OnClickListener(){

public void onClick(View arg0) {
    img.setImageBitmap(QR.this.encodeString(edit.getText().toString()));
}

});

private Bitmap encodeString(String input) {
     URL aURL;
     try {
      aURL = new URL("http://chart.apis.google.com/chart?chs=300x300&cht=qr&choe=UTF- 8chl="+URLEncoder.encode(input, "UTF-8"));
      URLConnection conn = aURL.openConnection();
      conn.connect();
      InputStream is = conn.getInputStream();
      BufferedInputStream bis = new BufferedInputStream(is);
      Bitmap bm = BitmapFactory.decodeStream(bis);
      bis.close();
      is.close();
      return bm;
      } catch (MalformedURLException e) {
       e.printStackTrace();
      } catch (IOException e) {
       e.printStackTrace();
      }
     return null;
}

Decoding

The ZXing library is an open source Java library for decoding numerous 1D and 2D barcodes. We will be using the core library but there is also an Android specific application that provides hooks into the camera. Since the emulator does not support capturing images just yet we will settle for using the image we just encoded. We will need one class specific to the Android ZXing library, RGBMonochromeBitmapSource which lets us convert Android bitmaps to the format that ZXing uses.

The code below takes the bitmap image from the ImageView and pushes it through the decoder populating a TextView.


decodeButton.setOnClickListener(new OnClickListener(){

public void onClick(View arg0) {

     try {
      tv.setText(((QR.this.decode(img.getDrawingCache()))));
     } catch (ReaderException e) {
      e.printStackTrace();
     }
}
});

private String decode(Bitmap bm) throws ReaderException {
     QRCodeReader reader = new QRCodeReader();
     Result r = reader.decode( new RGBMonochromeBitmapSource(bm));
     return r.getText();
}

We can use our friend Linkify to automatically make any text of the correct format (http://, mailto:, and even map locations) into a link that launches the appropriate application.


textView.setAutoLinkMask(Linkify.ALL);



I have even been experimenting with integrating the decoder with the built in WebView class which lets us decode images directly from the web browser. As you can see in this example I have clicked on a QR Code and a dialog pops up with the decoded information.

The code to do this is a little hackish but involves using the WebView.requestImageRef(msg) mechanism and calling decode from the handler that receives that message.

I know of a number of decoders being developed for android but hopefully there will be a standard one that can be called using Intents so that developers can just fire off an intent in their application and get text back, not having to worry about dealing with the camera or the decoder libraries.

Wednesday, April 9th, 2008

In case you hadn’t heard, Google has released a preview of AppEngine, it’s cloud/platform service. It provides a full application development and deployment stack that has access to google services like email, login, and datastore. It also provides a python-based application development environment called webapp as well as supporting other python web frameworks, like django.

Since location-based services for mobile phones are all the rage, I thought I would walk through how to create a simple location sharing web service on AppEngine and interact with it in Android. I will show you how to create a simple REST-ish API that consumes HTTP requests and outputs simple XML data. It probably won’t be exciting for people interested in shiny web applications, but using this approach provides a flexible protocol for interacting with remote service from a mobile phone, allowing the data to be consumed and displayed in a native phone application.

After that, I will show you how to use Android’s LBS and networking APIs to interact with the service.

Setup
Create a new AppEngine project and create a file called location.py. First, we need to configure the app.yml with the url mapping for our service. For this example I will simply use “/endpoint” as my mapping to the location.py handler.


application: location
version: 1
runtime: python
api_version: 1

handlers:
- url: /endpoint
  script: location.py

There are many more ways to define your url mapping to provide RESTful urls for your app, see here for more info.

location.py
The source for the service can be found here. I am going to step through the file from the top down.

Model
We want to create a location domain model that can be used with the datastore api. To do this we define a Location class that inherits from db.Model. We will create fields for latitude, longitude, and date.


class Location(db.Model):
  lat = db.IntegerProperty()
  lon = db.IntegerProperty()
  date = db.DateTimeProperty(auto_now_add=True)

lat and lon are stored as Integers because it makes things a little easier to use with some of the Android Map and Location APIs.

Since we want to be able to output our model as XML we make a helper method that makes a one line XML element with lat and lon as attributes:


def printloc(self,location):
      return '<location lat=\'%(lat)s\' lon=\'%(lon)s\'></location>\n' % {'lat':location.lat, 'lon':location.lon} 

Models in AppEngine/webapp have a to_xml() method that allows them to be exported to XML automatically, the format is much more verbose than I would like to deal with in this tutorial, but they do provide an interesting look as to how the data is stored and read in the datastore/BigTable.

Methods
The next two methods get called when a request is made. They are mapped to the GET and POST http methods, this makes it easy to design RESTful interfaces for our web service. In our example we want a POST to create a new location, while GET will fetch a list of the 10 most recent locations.

Post


  def post(self):
      location = Location()
      location.lat = int(self.request.get('lat'))
      location.lon = int(self.request.get('lon'))
      location.put()
      self.response.out.write(self.printloc(location))

This creates a new location object and stores the two parameter values in it and saves the location to the data store. We then write the location out to the response.

The output of this method will look something like this:


<location lat="37422375" lon="-122096532"/>

Get


def get(self):
    locations = db.GqlQuery("SELECT * FROM Location ORDER BY date DESC LIMIT 10")
    self.response.headers['Content-Type'] = 'text/xml'
    self.response.out.write('<list>')
    for l in locations:
        self.response.out.write(self.printloc(l))
    self.response.out.write('</list>')

This code fetches the latest 10 locations using a GQL query and wraps them in a element.

The output of this call will look something like this:


<list>
<location lat="37422375" lon="-122096532"/>
<location lat="37429756" lon="-122100756"/>
<location lat="37428218" lon="-122101459"/>
<location lat="37422383" lon="-122096532"/>
<location lat="37422378" lon="-122096531"/>
<location lat="37422384" lon="-122096533"/>
<location lat="37449370" lon="-122119525"/>
<location lat="37449355" lon="-122119523"/>
<location lat="37454563" lon="-122130219"/>
<location lat="37454443" lon="-122130012"/>
</list>

main


def main():
  application = webapp.WSGIApplication(
                                       [('/endpoint', LocationService)],
                                       debug=True)
  wsgiref.handlers.CGIHandler().run(application)

if __name__ == "__main__":
  main()

This code binds our handler to the /endpoint address, and runs the service.

Android integration
I will now briefly demonstrate how to interact with the service from within Android. If you are like me, and were a little late trying to sign up for the AppEngine preview program, you are running your web service locally. You need to run the development server with the “-a ADDRES” where ADDRESS is your internal network address. Android has an internal network loopback that loops any requests made from the phone to “localhost” back to the phone so you won’t be able to access your service if it is running on localhost.

Our first step is to build a new MapActivity that contains a MapView and two menu actions “Update Location” and “Fetch Locations”. The source for this activity can be found here.

Update Location:
The definition of our Post Current Location menu item which is defined inside of public boolean onCreateOptionsMenu(Menu menu):


menu.add(0, 1, "Post Current Location", new Runnable(){

			public void run() {

				// get current location and use it as params to our API call
				LocationManager locMan = (LocationManager) MiniLocationMap.this
						.getSystemService(Context.LOCATION_SERVICE);
				Location loc = locMan.getCurrentLocation("gps");

				 Map headers = new HashMap();

		        String text= "lat=" +(int)(loc.getLatitude()*1E6) + "&lon=" + (int)(loc.getLongitude()*1E6;
		        byte[] bytes = text.getBytes();
		        ByteArrayInputStream bais = new ByteArrayInputStream(bytes);
				mRequestQueue.queueRequest(
		                "http://10.0.0.199:8080/endpoint",
		                "POST", headers, new LocationEventHandler(mHandler), bais, bytes.length, false);
			}

		});

This gets your current location in the same way that we did in our fire eagle example. It then constructs a POST request with the latitude and longitude as parameters for our web service. You need to convert the latitude and longitude to integers, there is probably a simpler way to do it than above. This example uses the RequestQueue class which provides an interface for making http requests. For more information on performing these requests you should definitely check out this blog, which is full of great android examples.

The LocationEventHandler class handles the data returned from the request. In my example the EventHandler uses the XML pull parser to parse the XML data into a DemoLocation object which is then passed back to the Map Activity using it’s handler. In the Handler the location is extracted from the Message object and used to center the map on the location just posted:


public void handleMessage(Message msg) {
			// TODO Auto-generated method stub
			super.handleMessage(msg);

			if(msg.what == 123){
				DemoLocation currentLocation = (DemoLocation) msg.getData().get("location");
				mMapController.centerMapTo(new Point(currentLocation.lat, currentLocation.lon), true);

			}
				}
		}

Retrieving Locations


menu.add(0, 0, "Retrieve Locations", new Runnable(){

			public void run() {
				 Map headers = new HashMap();
				mRequestQueue.queueRequest(
		                "http://10.0.0.199:8080/endpoint",
		                "GET", headers, new LocationListHandler(mHandler), null, 0, false);
			}

		});

This creates a GET http request and uses LocationListHandler to create an ArrayList of locations that can be used by our map. To keep the tutorial short I won’t actually do anything with the list of locations, but they could be used with an overlay to draw points on the map of all the places you have recently been.


This fairly primitive implementation should be enough to get you started creating web services in AppEngine and using them in android. Security is obviously an issue I ignored. The built-in google user account api is built around user authentication using web forms and http redirects, similar to OpenID. This makes it a little difficult to create APIs using just google accounts. Implementing OAuth and having the web-based authorizorization part of the process use the google user api, then having a seperate table storing a reference to the user’s account, applications, and access tokens would be one approach to solving this problem.

Overall, AppEngine was easy to use and provides a nice set of functionality to build on top of. Having your web stack and client stack all under the google umbrella is kind of interesting. The barrier of entry to developing and deploying a web app is now so low that I can see people building their own personal web services for things like their desktop and mobile phones. You now control your personal information and can use open standards for sharing that information.

Thursday, March 13th, 2008

Update 2 See this post or just skip straight to this excellent library for all of your OAuth and Java needs

*Update* The code in this entry no longer works with the Android SDK because of the upgrade to HttpClient 4. The OAuth Java library has been updated to work with HttpClient 4 but I have not looked at it recently *Update*
Fire eagle is a Yahoo! location sharing service that provides an API that allows external clients and services to update and query user location information. Besides the obvious interesting connection between a location sharing service and Android’s Location-Based-Services API, I became more interested in how fire eagle uses OAuth as it’s authorization scheme and how it can be used on a smart mobile device.

OAuth is an open authentication protocol that allows access to web service resources from other web services as well as desktop applications. Other open authentication schemes, like OpenID, use http redirects and require users input credentials onto a web page in order to authorize clients. This isn’t very useful for a desktop or mobile client that would like direct access to a web API. OAuth still requires the user to enter their credentials into a website, but this is only done during the initial application authorization step, after that step is complete the application can make authorized API calls directly without needing user intervention.

A web service that uses OAuth will let application developers to register for a consumer key which is paired with a consumer secret. The consumer key is used to identify the client application and the consumer secret is used to sign requests made by the client application which is then verified by the host web service.

Here is a general outline of the OAuth process from a client application’s perspective:
1. The client requests a request token from the service. They include their consumer key and a few other OAuth specific parameters including a hash signature using the consumer secret.The service replies with a request token.
2. The client application then directs the user to the service’s authorization page, with the request token as a parameter, where the user can log into the service and authorize the application to access their information.
3. Once the user is finished authorizing, the client application needs to request an access token which will be used to make authorized calls to the service’s API. The service replies to the request with an access token and access secret. The application needs to save both of these securely.
4. The client application can now make API calls by including the user’s access token, and signing the oauth parameters with the access secret.

Laserbeak
I am going to attempt to walk through a “simple” android application that performs the request and authorization steps of OAuth as well as makes an update call to fire eagle with the current location of the phone.

Setup
The first step will be getting your own application key and secret token from the fireeagle service. Fire eagle is currently invite-only but there are plenty of invites floating around.

The second step is to setup a new android project and give it GPS and LOCATION permissions.

The third step will be getting the OAuth java libraries from the OAuth Java repository. Since the libraries use the apache-commons and http libraries that are already included in android you can simply drop the net.oauth, net.oauth.client, and net.oauth.signature into your source directory. Note: The OAuth java libraries aren’t “finished” and not as well documented as the libraries for other languages but I have found them to be fairly straight forward and functional.

The Application
We will create a simple application that consists of an activity with three buttons. Each button’s onClick event will trigger a step in our authorization process. Complete source code for this activity can be found here

Initializing the OAuth provider, consumer, and accessor in the Activity’s OnCreate method:


		serviceProvider = new OAuthServiceProvider(OAUTH_REQUEST,
				OAUTH_AUTHORIZE, OAUTH_ACCESS);

		consumer = new OAuthConsumer("http://www.noredirectfordesktop.com",
				CONSUMER_KEY, CONSUMER_SECRET, serviceProvider);

		accessor = new OAuthAccessor(consumer);

		httpClient = new OAuthHttpClient(new HttpClientPool() {

			public HttpClient getHttpClient(URL server) {
				return new HttpClient();
			}
		});

Here we initialize the classes that will be used to make OAuth requests to the Fire eagle service, we include the three URLs as well as the consumer key and consumer secret. All of the OAuth specific parameters and operations will be performed by these classes.

The request token button:


Button requestButton = (Button) this.findViewById(R.id.req_button);
		requestButton.setOnClickListener(new OnClickListener() {

			public void onClick(View arg0) {

				try {
					httpClient.getRequestToken(accessor);
				} catch (Exception e) {
					// TODO Auto-generated catch block
					e.printStackTrace();
				}

				// manually set the access token to the request token...not sure
				// why
				accessor.accessToken = accessor.requestToken;

				// start browser application so user can authorize your
				// application
				Intent authIntent = new Intent(Intent.VIEW_ACTION);
				authIntent.setData(Uri.parse(FIRE_EAGLE_AUTHORIZE_URL
						+ accessor.requestToken));
				Laserbeak.this.startActivity(authIntent);
			}

		});

Here we use the built in getRequestToken method to make a token request to the service. If all goes well the token is stored in the requestToken field of the accessor, for the authorization step we need to manually set the accessToken field on the accessor to equal the requestToken.
The next step is interesting in that we need to have the user manually authorize our application, android makes it easy to launch the browser to the authorization URL using a VIEW_ACTION intent. This will launch a browser that the user can use and once they are finished they can simply close the browser and return to the application which is still running in the background.

The authorize button:


Button authButton = (Button) this.findViewById(R.id.auth_button);
		authButton.setOnClickListener(new OnClickListener() {

			public void onClick(View arg0) {

				try {

					OAuthResponseMessage response = (OAuthResponseMessage) httpClient
							.invoke(accessor.newRequestMessage("GET",
									serviceProvider.accessTokenURL, null));

					// manually set these fields on the accessor from the
					// response
					accessor.accessToken = response.getParameter("oauth_token");
					accessor.tokenSecret = response
							.getParameter("oauth_token_secret");

					//at this point you should store the accessToken and tokenSecret
					//somewhere secure
				} catch (Exception e) {
					e.printStackTrace();
				}
			}

		});

Our application is now authorized to make API calls, lets try calling update with the current Lat/Lon of our phone


Button updateButton = (Button) this.findViewById(R.id.update_button);
		updateButton.setOnClickListener(new OnClickListener() {

			public void onClick(View arg0) {

					// get current location and use it as params to our API call
					LocationManager locMan = (LocationManager) Laserbeak.this
							.getSystemService(Context.LOCATION_SERVICE);
					Location loc = locMan.getCurrentLocation("gps");

					HashMap params = new HashMap();
					params.put("lat", loc.getLatitude());
					params.put("lon", loc.getLongitude());
					try {

						OAuthResponseMessage response2 = (OAuthResponseMessage) httpClient
								.invoke(accessor.newRequestMessage("POST",
										FIRE_EAGLE_UPDATE_URL, params
												.entrySet()));
					} catch (Exception e) {
						e.printStackTrace();
					}

			}
		});

Here we get the LocationManager and get the user’s current latitude and longitude and put them in a parameter map to be used in the request.

Those are the basic steps for using OAuth and fire eagle. There are a number of things I left out like saving and accessing the access token and access secret from a secure place, as well as saving the state of the accessor for when your application gets interrupted by an incoming call. You could also create a service that updates your location periodically in the background instead of explicitly updating it in an activity.

Unfortunately due to security issues, desktop and mobile applications are only allowed to access the user and update API calls. The more interesting calls that allow you to query all the users of your application and create a social location network are restricted to web applications.

Now that you know how to authorize an application in OAuth you can use the above steps to interact with any other OAuth capable API, like pownce.

Wednesday, March 5th, 2008

Yesterday, the android team released WikiNotes , a personal wiki(like voodoopad), to help developers new to the platform get the hang of the flow of a typical android application. It provides a nice example of using intents to trigger activities directly, and associating activities with intents for the viewing of URI referenced content from a content provider. It also shows how to implement a content provider that allows the resolution of a URI on a field that isn’t the data’s ID column as well as perform searches via URI.

WikiNotes already provides support for automatically creating links for things like websites, phone numbers, and CamelCase formatted WikiNotes. Since android uses URIs to identify content on the phone, you can create links to any kind of content inside of WikiNotes.

I will provide a quick example of using the Linkify class to create a clickable link in a WikiNote that points to a contact in your address book.(hopefully, I am not stepping on anyone’s toes)

Before we start, since we will be accessing contacts on our phone we need to add the permission android.permission.READ_CONTACTS to our AndroidManifest.xml

Contacts are identified by the URI: content://contacts/people/#. I don’t think anyone would want to have to type out that whole thing on their handset keyboard so I will use the short hand “C:#” to identify a clickable contact in our WikiNote. This doesn’t make it any easier to identify who the contact actually is, but the contact provider currently only allows you to reference them by id number, plus its just easier to use a number for now.

Linkify uses a pattern matcher to identify which part of the string of a TextView to make into a clickable link so our first step is to define a wiki contact regex Pattern. If you open up WikiNotes you will see the declaration and definition for WIKI_WORD_MATCHER. Just under that we will add code for our wiki contact pattern.


private static final Pattern WIKI_WORD_MATCHER;
private static final Pattern WIKI_CONTACT_MATCHER;
static {

// Compile the regular expression pattern that will be used to
// match WikiWords in the body of the note
WIKI_WORD_MATCHER = Pattern.compile("\\b[A-Z]+[a-z0-9]+[A-Z][A-Za-z0-9]+\\b");
//match shorthand C:# for a wiki contact
WIKI_CONTACT_MATCHER =Pattern.compile("\\b[C]+[:]+[1-90-9]+\\b");

The next step is to Linkify the TextView so that when it is clicked it resolves to the full contact URI. Inside of the ShowWikiNotes() we want to add the following below the second Linkify.addLinks()


//add custom linkify match for contacts
Linkify.addLinks(noteView, WIKI_CONTACT_MATCHER,

android.provider.Contacts.People.CONTENT_URI.toString()+"/", null, new TransformFilter(){

public String transformUrl(Matcher matcher, String url) {

String ret = url.substring(2); //parse out the number

return ret;
}

});

This uses the method:

addLinks(TextView text, Pattern p, String scheme, MatchFilter matchFilter, TransformFilter transformFilter)

Where the first two parameter are obvious. Scheme is the uri to prepend to the matched text. MatchFilter which lets you further filter the matched text, and TransformFilter which takes the matched text and lets you change it before it is added to the scheme. In this case the string that is passed to the filter is “C:#” and we want to parse out the number part of the string.

Once you have done this you should be able to type C:1 into your WikiNote, confirm it and it will display a clickable link that will take you to the Contact viewing activity.

Woops… Well this is an interesting error in that it shows a little of how intent filters work. When the link is clicked in the TextView an intent with the View action and Browesable category is launched with it’s data set to the contact URI. The issue is that the ContactViewer activity does not have the the android.intent.category.BROWSABLE intent filter so when the intent is triggered the system can’t find an activity that matches it. Now if it did have that filter it would have displayed the following (hopefully):

As the number of content providers grows we can link to many different kinds of content in the wiki and have android automate the viewing of the content by calling the appropriate view activities. You can have links to music, videos, and images, but interestingly with a little modification you could launch all kinds of applications and intent actions from wiki links. You now have a wiki user interface where your users can easily design their own wiki-based navigation for their phone and it’s content.