Saturday, May 16, 2015

Trainsity Sapporo Android App

Find your way around Sapporo city's subway using the high resolution vector maps of the train network. The following metro rail lines are available:

  • Namboku, 
  • Tozai, and 
  • Toho lines. 

The maps have small file size footprints but with many levels of zoom and can work offline without connecting to the Internet. Users can click the train station box labels to open Google Maps or Google StreetView, where they can use all the functions of the Google apps to visualize the surrounding area and/or perform routing for directions. There is also an offline function to calculate the best way to travel from a station to another station with a direction breakdown and timings (which may vary from the actual travelling time).

On a mobile handset, the app will display a list of train maps, which when tapped will open up a detail view of the subway transit map, as shown below.

Tapping the station boxes will bring up an option menu where users can choose to display the station in Google Maps or Street View.

There is also an option to find the best direction to or from the tapped stations.

The app is also optimized for tablet sized devices. Both the list and the vector maps are displayed at the same time, as shown below.

The user can toggle the map to full screen mode by tapping the action bar icon at the top right corner.

 The app can be downloaded from the Google Play Store. Just click the button below.
Get it on Google Play

Monday, April 13, 2015

Resampling a single GeoTiff image in QGIS

QGIS comes bundled with GDAL tools which you can use to resample one or more raster images, though the QGIS menu labels may be a little unclear.

To resample an geo image in QGIS, do the following:

  1. Start QGIS. Optional. Load in a geo image file to resample.

  2. Select Raster | Projections | Warp (Reproject).

    The Warp (Reproject) dialog box appears.

  3. In the Input file field, click Select. Browse and select the source file, e.g. UTM2GTIF.tif.
  4. In the Output file field, click Select. Type in the destination file e.g. ResampleUTM2GTIF.tif.
  5. Toggle on Resize.
  6. In the Width field, type in the destination width in pixels e.g. 100.
  7. In the Height field, type in the destination height in pixels e.g. 133.

  8. Click OK.

    The source file is resampled.

Tuesday, April 7, 2015

Using RawTherapee RGB curves to make color corrections to aerial photographs

Besides graphics editing software like Photoshop and Gimp, the free and open source raw image format processing software RawTherapee (see can be used to correct color cast problems in aerial photographs due to atmospheric haze or sensor problems. An example of an image with a color cast problem is shown below. The sample can be downloaded from,_1966.jpg.
Aerial photograph courtesy of
RawTherapee has the RGB curves function that can be used to easily correct the color cast problem.

The trick to solving the color cast problem is to adjust the RGB curves to ensure the color gray values have the same RGB values.  If a gray color feature in the image e.g. an asphalt road has unequal RGB values, then the image has a color cast problem. Some times, it may be necessary to adjust the curves in the middle, dark, and/or light tones. The following example illustrates how to correct the color cast problem using RawTherapee.

  1. Start RawTherapee. Load the image.

  2. Click the Color tab on the right pane. Then click RGB Curves as shown below.

  3. Move the screen pointer around the image. Observe the RGB % values in the Navigator pane on the left when the pointer is on a mid tone gray colored feature e.g. paved road.

    Note: in this example, the RGB values are 67.5%, 63.5%, and 82.4%. The numbers indicate that there is a blue cast in the mid tone values, i.e. the blues are too high and will have to be lowered. The red and green values are alright (maybe the reds need to be lowered just a tad).
  4. In the RGB Curves, choose the Blue Channel Control Cage as shown below.

  5. Drag down the blue curve in the middle tone area. Move the cursor to the mid tone gray color feature and observe the adjusted RGB values in the Navigator pane underneath the screen pointer. Readjust the blue curve if necessary until the RGB values are about equal.

  6. I decided to adjust the mid tone red curve a little. So in the RGB Curves pane, click the Red Channel Control cage. Drag down the red curve in the mid tone area slightly and observe the adjusted RGB values in the Navigator pane. Readjust until the RGB values are about equal.

  7. No adjustment is necessary for the light tones since the color cast seems to be minimal. However the dark tones seem to need a little more red values as shown in the screenshot below.

  8. In the RGB Curves pane, drag the red curve in the dark tones slightly up. When the RGB values are about equal, the correction is complete.

    Note: after every change, always move the cursor to the dark area and check the adjusted RGB values in the Navigator pane.
  9. Now to apply the color correction, send the job to the queue and generate the image in your desired format e.g. JPEG.

    The color corrected image is created.

Monday, March 30, 2015

How to change the Android ActionBar background from the default dark color

By default, the background color of the ActionBar in any Android App is black as shown in the example below.

I wanted to style the background to a different non-black color. After some investigation, I had to do the following:
  • Choose a color
  • Define a custom theme
  • Assign the custom theme to the application
Choose a color
  1. Decide on a color to use for the background e.g. red or #303f9f in hex.
  2. Decide on a color for the text e.g. white of #ffffff in hex.
  3. Add these colors to the Android app's XML file e.g. [app]/res/values/color.xml.
<?xml version="1.0" encoding="utf-8"?>
<color name="actionbar_background">#303f9f</color>
<color name="actionbar_text">#ffffff</color>

Define a Custom theme

  1. Open up the Android app's styles XML file e.g. [app]/res/valuess/styles.xml, in a text editor.
  2. Append in a new style e.g. CustomActionBarTheme that inherits a parent theme e.g. Theme.AppCompat.Light.DarkActionBar.
  3. Append in new styles for the action bar, title text, and tabs text, e.g. MyActionBar, MyActionBarTitleText and MyActionBarTabText.
  4. The following code shows the complete styles.xml file.

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<style name="CustomActionBarTheme"
<item name="android:actionBarStyle">@style/MyActionBar</item>
<item name="android:actionBarTabTextStyle">@style/MyActionBarTabText</item>
<item name="android:actionMenuTextColor">@color/actionbar_text</item>
<!-- Support library compatibility -->
<item name="actionBarStyle">@style/MyActionBar</item>
<item name="actionBarTabTextStyle">@style/MyActionBarTabText</item>
<item name="actionMenuTextColor">@color/actionbar_text</item>
<!-- ActionBar styles -->
<style name="MyActionBar"
parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse" >
<item name="android:background">@color/actionbar_background</item>
<item name="android:titleTextStyle">@style/MyActionBarTitleText</item>
<!-- Support library compatibility -->
<item name="background">@color/actionbar_background</item>
<item name="titleTextStyle">@style/MyActionBarTitleText</item>
<!-- ActionBar title text -->
<style name="MyActionBarTitleText"
<item name="android:textColor">@color/actionbar_text</item>
<!-- ActionBar tabs text -->
<style name="MyActionBarTabText"
<item name="android:textColor">@color/actionbar_text</item>

Assign the new custom theme to the Android Application

  1. Open up the AndroidManifest.xml file in a text editor.
  2. In the application tag, change the theme to the new theme e.g. @style/CustomActionBarTheme.
  3. The following code snippet shows the relevant portion of the edited AndroidManifest.xml file.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android=""
package="com.dom925.demo" >
<!-- etc -->

Now the application's ActionBar should be using the custom theme with a non-black background.

Friday, March 20, 2015

Enabling the Developer options on Xiaomi Redmi Note Android phone

If you want to develop Android apps using a Xiaomi Redmi Note mobile phone, you'd find it to be missing the developer options, as shown in the General Settings screen below.

This is not enabled by default but it can be switched on by doing the following.

  1. Open up Settings.

    The General Settings screen appears.
  2. Tap on About phone.

    The About phone screen appears.

  3. Tap Android version several times.

    The message You are now a developer appears.
  4. Close the About Phone and Settings screens.
  5. Open up Settings.

    The General Settings screen appear.

    Note: the {} Developer options are now available.

Monday, March 2, 2015

Trainsity Osaka Windows Phone App

Carry these high resolution vector maps of Osaka city's subway train network in your Windows Phone and find your way around Osaka. The maps have small file sizes and can be accessed without a data connection. The following metro rail lines are available:
  • Midosuji, 
  • Tanimachi, 
  • Yotsubashi, 
  • Chuo, 
  • Sennichimae, 
  • Sakaisuji, 
  • Nagahori-Tsurumi-ryokuchi, 
  • Imazatosuji, 
  • Newtram Nanko Port Town, 
  • Kita Osaka Kyuko, 
  • Kintetsu Keihanna, 
  • Hankyu Kyoto, 
  • Hankyu Senri, 
  • Osaka Monorail, and 
  • Kitakyu Namboku lines.
Users can click the train station labels to open the external Bing Maps app where they can use all the functions of the external app to visualize the surrounding area including querying for directions. This app has its own directions function for finding the best path from one train station to another.

On a Windows Phone handset, the app will display tiles of train lines, which when tapped will open up a detail view of the metro transit map, as shown below.
Tapping the station labels will bring up an option menu where users can choose to display the station location in Bing Maps.
If you want to find how long it takes to travel from one station to another, and the best route to take, simply swipe to the Route page. Then type in the From station and To station. As you enter the values, a drop down list will appear and a station can be selected from the list. Finally tap the Execute icon.
Tapping the more details link will display the recommended route to take.
 Click the button below to download the app from the Windows Phone store.

Monday, February 23, 2015

Disabling the Windows Phone frame rate numbers display while debugging

While debugging Windows Phone Apps, there will be some (weird looking) running numbers on the right side of the app's screen, as shown in the screen shot below.

These are actually frame rate counter numbers to aid in debugging. They can be easily switched off if you do not want them on the screen, especially if you want to capture the screen. To turn it off, just do the following:

  1. In Visual Studio, open up the project's App.xaml.cs file in the editor.

  2. Look for the following lines:

    if (System.Diagnostics.Debugger.IsAttached)
    this.DebugSettings.EnableFrameRateCounter = true;

  3. Change them to the following:

    if (System.Diagnostics.Debugger.IsAttached)
    this.DebugSettings.EnableFrameRateCounter = false;

  4. Run and debug the app again.

    The frame rate numbers are no longer displayed.

Related Posts with Thumbnails