J2ME StopWatch Application

Posted by & filed under , .

This is another resurrect from my old website — again, it seems people are visiting my site looking for this (old) J2ME application. Please be aware that I haven’t updated this application in ages — it was known to run last time I checked, but that was a while back. I suspect as such it’s still working, but even if it isn’t, perhaps it has still some good points. If not, well, at least I’m no longer showing a 404 to people (desperately) looking for this application. So here it is below, the original post, together with the downloadable(s).

This application is currently at version 1.1.0 — last update 14/Aug/2006.

A couple of years ago when I got my Nokia 6600 mobile, I was initially over the moon with the facilities the phone was oferring and also the fact that it was programmable in Java (J2ME). Like all the other enthusiasts (read geeks :D) of the J2ME platform I found myself soon writing all sorts of useless mobile applications that I would then try on my mobile. Soon though I discovered that my mobile was missing one utility that I did occasionally need — a stopwatch! So having realized that, I started writing this application which I still use on my Nokia from time to time.

I heard that the new models (Nokia N-series) do actually include such a tool, but I cannot confirm it yet as in the meanwhile I switched to a Sony Ericsson mobile and kind of postponed the idea of trying the N-series Nokia’s for later on. (As you probably are aware, the Sony Ericsson mobiles have such a stopwatch utility built-in.) Even if they do have such an utility, you might still want a stopwatch that’s customizable (see below) or maybe you just want an alternative to the standard ones — either way, feel free to use (and adapt) this application to your liking.

For the impatient users, scroll to the bottom of the page and grab the download link, the rest of you, who want to play a bit more with this app and maybe even customize it a bit, keep reading.

Customizing the Application

The first thing that you will notice (starting with version 1.1.0) is that now there is a Settings dialog which allows you some basic customization — as it stands at the moment this only offer you switching in between images and built-in fonts when showing the stopwatch digits.

The applications offers a “skinnable” GUI so you can customize it to your liking. This means that you can change the appearance of the digits so they either match your mobile skin or they fit better on your mobile screen.

Please note that the default graphics provided with the application span for exactly 180 pixels in width and 46 pixels in height and this occupies most of the application screen for a Nokia 6600 series phone; however, for other mobiles it might be either too much (in which case you might not see all of the digits) or too little (in which case you might want to increase the size of the images).

In order to customize the application, you will have to download the project file (provided below). Also make sure that you have WTK (at least) and (even better) Eclipse and EclipseME — as you will have to re-build the jar file after replacing the graphics.

Also be aware that if you want to customize the application, you might need some technical knowledge, about how to zip/jar/pack files and also how to create graphics to match your mobile skin. Details on how to do so are not provided here, but there are no doubt loads of reference points on the net. Once you get yourself acquianted to this, you can visit this page again and follow the instructions provided below.

So, if you decide you want to customize the application, here’s how:

  • The application uses images to “draw” the digits. These images are stored in the res/img/ directory. They are in PNG format, for portability reasons. (As you are probably aware, the PNG format is the recommended format by J2ME, even though most phones also support GIF and JPEG). Feel free to change the images to JPEG for instance, but be aware that doing so means you will also have to change the sources, as the source code assumes that images are in PNG format.
    In brief, each digit has a corresponding image, the naming convention for the files being digit.png — e.g. 0.png for 0, 1.png for 1 etc).
  • The simplest customization one can do is to simply remove all the files in this directory or even remove the whole directory. In such case, when the application starts, it will check for the presence of res/img/0.png, if this is not found, then the application will assume that the digit images are not in place and switch to using the mobile fonts for “drawing” the digits on the screen. This is in fact the most portable solution — as the fonts are quite small and it is nearly guaranteed that all the digits will always be seen on any screen. However, it looks rather lame — if you ask me 🙂
  • Another way to customize the application is obviously to replace the images in the res/img/ directory with your own. A few things you need to bear in mind though:
  1. The format of the time shown is HH:MM:SS:mmm where HH is the number of hours, MM is the number of minutes, SS is the number of seconds and mmm is the number of milliseconds.
  2. On top of the images for the digits (0.png to 9.png) there are 2 more images provided: dot.png and semi.png. semi.png is a semicolon (:) and it is used to separate hours from minutes and minutes from seconds; the dot.png file is a dot (.) and it is used to separate seconds from milliseconds.
  3. All the images have to be the same size (width x height) — this also includes the dot.png and semi.png.
  4. (see comments above) Due to the fact that the number of characters shown is 12, make sure that the width of the images is such that they will all fit on your mobile screen. In other words, make sure that 12 x width of an image <= width of your mobile phone screen.
  • Once you have replaced/delete the images, you will have to re-deploy your application (i.e. re-create the jar file). Details on how to do so are given in the above section Compiling the Application. Then simply re-install the application on your mobile (see the section above Installing the Application for details on how to do so.)

Advanced Customization

On top of replacing the images and “skinning” the application, there are a few other customizations one can make. However, be aware that in order to do this you need to change the source code — and therefore you will have to recompile and re-deploy the application. It is beyond the scope of this document to provide details on how to go about doing so, however, there are loads of tutorials on Eclipse and EclipseME websites.

  • Change the background color — By default, the background color for the application is white, however, you can change it to suit your needs by modifying the StopWatchDisplayable.paint() function. Simply locate the lines that calls Graphics.setColor() before drawing a rectangle (that basically erases the whole screen) and replace COLOR_WHITE with the color you want.
  • Change the digits color — By default, if you decide to go with the non-graphical look-and-feel and have deleted all the images from res/img/, the color used when “drawing” the digits is navy, however, you can change it to suit your needs by modifying the StopWatchDisplayable.paint() function. Simply locate the lines that calls Graphics.setColor() before drawing the digits and replace COLOR_NAVY with the color you want.
  • Change the font used for digits — If you decide to go with the non-graphical look-and-feel and have removed all the image files from res/img/ then you can change the font used to “draw” the digits on the screen. Simply look in the constructor of StopWatchDisplayable for the line that initializes the fnt member — this is the font used to “draw” the digits when no images are found. By default, the font is initialized as monospace bold large — so feel free to change either the font type, the weight or the size.
    Note that there is another font used in the application (fntLaps) however, that is used when “drawing” the number of laps (see below) — please do not confuse the 2 of them.
  • Change the font used for number of laps — If you are using the Laps facility in the application, you will notice that the number of laps is shown on the screen using a monospace medium-height font. If you want to change that, simply look in the constructor of StopWatchDisplayable for the line that initializes the fntLaps member.

History

The current version of this application is 1.1.0 and as it stands at the moment I am not tracking previous versions to that. It’s very likely that if I decide to maintain this project in the future I will only keep the latest version, however, if at some point I will provide downloads for previous versions as well then this page will contain links to all the previous versions of the project.

  • Version 1.1.0 (released on 14/Aug/2006) added a Settings form which allows users at runtime to switch in between graphical digits (i.e. images) and digits “painted” using the device built-in fonts. This came as a request from one of the users who has found the application impossible to use on an LG phone due to the size of the image files. I have then come to realize that not all people downloading this will necessary be interested in re-compiling the application so I have provided the possibility of changing the appearance of the application on-the-fly.

Note that this application is also hosted on getjar.com, so if you prefer you can download it from there. Alternatively just download the whole zip here.

Final note on this: I am not actively maintaining this application so please do not ask for updates! I might put it on something like github or sourceforge if I have the time and give it to the community — but unfortunately I do have a few other things on my hands at the moment, so this will be done as and when I have the time. Quite happy to hear though from a developer who wants to take over this project — so by all means if you fancy doing that drop me a line using the contact form.