Developing Android App–My Experience Part 1

The source code for this app is available here.

The alpha version is available in Google Play.

 

Introduction

It is year 2014. Happy New Year to everyone!

For the last couple of months I have been developing an Android app which I initially targeted to complete by end of year 2013. Nonetheless, the progress is rather slow since I am working on it part-timely due to other commitments and the schedule has been delayed a few times.

Besides time constraint, there are also technical challenges as well. The app I intended to develop should have the following features

  • Able to use phone camera for surveillance purpose within Intranet.
  • Able to access phone camera for surveillance purpose, accessible from Internet easily without the hassles of complicated setup.
  • Able to plug in any webcams or spy cameras into your notebook or PC, and access and view them from another machine or from your mobile phone.
  • Provide features like motion detection, automatic email and SMS alerts upon motion detection, and save detected motion pictures into cloud storage.
  • Turn your mobile phone into a SMS gateway, exposing the functions through REST APIs. This will be integrated into my other projects and products here and here.

There are no break-through ideas here but this is definitely helping me to keep up with the technologies. On top of that, releasing the code as open source is also one way to contribute to the community.

Let’s start with the 1st features to leverage your phone for surveillance purpose.

 

User Interface

To start with, I used the following to design the UI

Below are some of the screenshots for the app.

sliding_menu

 

home

 

HTTP Server

To be able to access your phone and phone camera remotely you need to have a web server running in your Android phone, serving content over HTTP. Below are the components or libraries that I used for this purpose.

For this app, I have a control panel service running to host an AngularJS app which serves as the main entry point to the phone. You can start/stop the service through the Control Panel function and change the listening port.

Once the service is started, you can access the provided URL through any web browsers.

Some of the screenshots are shown below.

 

control_panel

 

 

control_panel_service

 

control_panel_web_1

 

Motion and Face Detection

For motion and face detection, I use OpenCV4Android. You can control this from the Settings menu. The followings are supported at this moment

  • Enable/disable motion and face detection
  • Configure motion detection threshold
  • Different motion detection algorithms – Simple, Background Subtraction or Motion History Image (MHI)
  • Configure the contour thickness

Once enabled, you can choose to view the detected motions or faces from the web browser by enabling or disabling “Stream detected motion and face”.

 

settings_1

 

settings_2

 

camera_mode_1

camera_mode_2

 

control_panel_web_2

 

What You Can Do Now with This App

As I mentioned in the beginning of this post, development of this app is still very much in progress. What you can test or use are the following features

Control Panel
  • Configure HTTP listening port
  • Start/stop the service
  • Auo start the service upon reboot
Camera Mode
  • Start the camera in surveillance mode
  • Change to front/back camera and its resolutions by using the left sliding menu in camera mode
  • Configure motion and face detection settings as described above.
Remote Viewing (Intranet)
  • Remotely start the camera in surveillance mode (Control Panel service must be started)
  • View the streamed video and audio, change the canvas and resolution size.
  • For remote viewing, motion JPEG is supported. Please note that only Chrome and Firefox support MJPEG. For Internet Explorer, use the frame update option. The web application should detect this automatically for you.
  • You can also use VLC media player to open the URL to MJEG and view the streamed video.

vlc_media_player

 

Upcoming

In my next series of posts I am going to talk in more details on the lessons learnt, technologies used and challenges that I faced while developing this application. By the end of this series, hopefully I am able to roll out this application successfully Smile

Irrduino

Irrduino is an Arduino-based irrigation control system. It includes:

  • IrrduinoController: A project written in C that runs on the Arduino controller. It was prototyped using an Android ADK board and an Arduino Ethernet Shield.
  • IrrduinoDroid: This is an Android application that can control IrrduinoController.
  • IrrduinoServer: This is a Python, Google App Engine application that can control IrrduinoController and talk to IrrduinoDroid. It also provides reporting.
  • IrrduinoServer/static/dart: This is a game written in Dart called Lawnville that is a bit like Farmville, but it results in a real lawn being watered.

PhoneKit Android Application

The possible usage of a smart phone is basically unlimited. Currently I am experimenting with various possible usages of the Android phone. A snapshot of the application that I am working on now.

 

phone_kit

Optimize PNG Image

As part of Android programming, or any software development, there is always a need to create or customize images. In mobile programming, PNG images are normally used as it supports lossless data compression.

In order to optimize the size of PNG images, there are tools that we can use, e.g.

Here is a scenario to show how much bandwidth we can save by using these tools. In this example, I have a PNG image which is 21k originally. Below is the metadata information shown using PngCrush.

You can see that the IDAT chunk before optimizing in the displayed information.

 | pngcrush 1.7.55
 |    Copyright (C) 1998-2002, 2006-2013 Glenn Randers-Pehrson
 |    Portions copyright (C) 2005       Greg Roelofs
 | This is a free, open-source program.  Permission is irrevocably
 | granted to everyone to use this version of pngcrush without
 | payment of any fee.
 | Executable name is pngcrush
 | It was built with libpng version 1.6.1rc01, and is
 | running with  libpng version 1.6.1rc01 - March 21, 2013

 |    Copyright (C) 1998-2004, 2006-2013 Glenn Randers-Pehrson,
 |    Copyright (C) 1996, 1997 Andreas Dilger,
 |    Copyright (C) 1995, Guy Eric Schalnat, Group 42 Inc.,
 | and zlib version 1.2.7.1, Copyright (C) 1995 (or later),
 |    Jean-loup Gailly and Mark Adler.
 | It was compiled with gcc version 4.8.0 20121031 (experimental).

Opening file 1.png for length measurement
Allocating read structure
Allocating read_info,  end_info structures
Reading IHDR chunk, length = 13.
Reading sRGB chunk, length = 1.
Reading gAMA chunk, length = 4.
Reading pHYs chunk, length = 9.
Reading tEXt chunk, length = 26.
Reading IDAT chunk, length = 20958.
Reading IEND chunk, length = 0.
Destroying data structs
   Recompressing 1.png
   Total length of data found in critical chunks =    21015


ENTERING MAIN LOOP OVER 150 METHODS
Allocating read and write structures
Allocating read_info, write_info, end_info structures
Initializing input and output streams
 Check the palette
Reading info struct
Transferring info struct
   IHDR chunk data:
      Width=512, height=512
      Bit depth =8
      Color type=6
      Interlace =0
   Setting IHDR
   gamma=0.454550
Handling 1 tEXt/zTXt chunks before IDAT
0  Software: Paint.NET v3.5.10
Found 0 unknown chunks
Finished handling ancillary chunks after IDAT

Begin interlace pass 0
Reading and writing end_info data
Destroying data structs


FINISHED MAIN LOOP OVER 150 METHODS


   CPU time decoding 0.010, encoding 0.000, other 0.030, total 0.040 seconds

Using PngCrush with the default options, after optimizing the size now becomes 15k, and the metadata is shown below.

 | pngcrush 1.7.55
 |    Copyright (C) 1998-2002, 2006-2013 Glenn Randers-Pehrson
 |    Portions copyright (C) 2005       Greg Roelofs
 | This is a free, open-source program.  Permission is irrevocably
 | granted to everyone to use this version of pngcrush without
 | payment of any fee.
 | Executable name is pngcrush
 | It was built with libpng version 1.6.1rc01, and is
 | running with  libpng version 1.6.1rc01 - March 21, 2013

 |    Copyright (C) 1998-2004, 2006-2013 Glenn Randers-Pehrson,
 |    Copyright (C) 1996, 1997 Andreas Dilger,
 |    Copyright (C) 1995, Guy Eric Schalnat, Group 42 Inc.,
 | and zlib version 1.2.7.1, Copyright (C) 1995 (or later),
 |    Jean-loup Gailly and Mark Adler.
 | It was compiled with gcc version 4.8.0 20121031 (experimental).

Opening file 2.png for length measurement
Allocating read structure
Allocating read_info,  end_info structures
Reading IHDR chunk, length = 13.
Reading gAMA chunk, length = 4.
Reading sRGB chunk, length = 1.
Reading pHYs chunk, length = 9.
Reading tEXt chunk, length = 26.
Reading IDAT chunk, length = 15132.
Reading IEND chunk, length = 0.
Destroying data structs
   Recompressing 2.png
   Total length of data found in critical chunks =    15189


ENTERING MAIN LOOP OVER 150 METHODS
Allocating read and write structures
Allocating read_info, write_info, end_info structures
Initializing input and output streams
 Check the palette
Reading info struct
Transferring info struct
   IHDR chunk data:
      Width=512, height=512
      Bit depth =8
      Color type=6
      Interlace =0
   Setting IHDR
   gamma=0.454550
Handling 1 tEXt/zTXt chunks before IDAT
0  Software: Paint.NET v3.5.10
Found 0 unknown chunks
Finished handling ancillary chunks after IDAT

Begin interlace pass 0
Reading and writing end_info data
Destroying data structs


FINISHED MAIN LOOP OVER 150 METHODS


   CPU time decoding 0.014, encoding 0.000, other 0.036, total 0.050 seconds

Using OptiPNG with default options, the image is optimized to be 11kb, and the metadata information is shown below.

 | pngcrush 1.7.55
 |    Copyright (C) 1998-2002, 2006-2013 Glenn Randers-Pehrson
 |    Portions copyright (C) 2005       Greg Roelofs
 | This is a free, open-source program.  Permission is irrevocably
 | granted to everyone to use this version of pngcrush without
 | payment of any fee.
 | Executable name is pngcrush
 | It was built with libpng version 1.6.1rc01, and is
 | running with  libpng version 1.6.1rc01 - March 21, 2013

 |    Copyright (C) 1998-2004, 2006-2013 Glenn Randers-Pehrson,
 |    Copyright (C) 1996, 1997 Andreas Dilger,
 |    Copyright (C) 1995, Guy Eric Schalnat, Group 42 Inc.,
 | and zlib version 1.2.7.1, Copyright (C) 1995 (or later),
 |    Jean-loup Gailly and Mark Adler.
 | It was compiled with gcc version 4.8.0 20121031 (experimental).

Opening file 1.png for length measurement
Allocating read structure
Allocating read_info,  end_info structures
Reading IHDR chunk, length = 13.
Reading sRGB chunk, length = 1.
Reading gAMA chunk, length = 4.
Reading pHYs chunk, length = 9.
Reading tEXt chunk, length = 26.
Reading IDAT chunk, length = 10252.
Reading IEND chunk, length = 0.
Destroying data structs
   Recompressing 1.png
   Total length of data found in critical chunks =    10309


ENTERING MAIN LOOP OVER 150 METHODS
Allocating read and write structures
Allocating read_info, write_info, end_info structures
Initializing input and output streams
 Check the palette
Reading info struct
Transferring info struct
   IHDR chunk data:
      Width=512, height=512
      Bit depth =8
      Color type=4
      Interlace =0
   Setting IHDR
   gamma=0.454550
Handling 1 tEXt/zTXt chunks before IDAT
0  Software: Paint.NET v3.5.10
Found 0 unknown chunks
Finished handling ancillary chunks after IDAT

Begin interlace pass 0
Reading and writing end_info data
Destroying data structs


FINISHED MAIN LOOP OVER 150 METHODS


   CPU time decoding 0.005, encoding 0.000, other 0.023, total 0.028 seconds

Obviously with the help of these tools, PNG images can be optimized efficiently, and let’s say you have lots of images, you can definitely benefit from the use of these tools.

Arduino Starter Kit

Received my Arduino Uno Start Kit

outofbox

 

Inside the box,

inthebox

The Arduino Uno board,

unorev3

unorev3vsphone

My Raspberry Pi Setup

Below are some screenshots for my Pi setup.

pi_setup

Since I am using my digital monitor, a HDMI to DVI cable is required.

I am using a 4port USB hub to connect my USB mouse and keyboard, and additional USD devices that I want to use.

pi_usb_hub

I am using my LG mobile travel adaptor to power up Raspberry Pi. You can see the output is 5.1V, 0.7A.

pi_usb_power

Boot up screen is shown below. I am using the Raspbian “wheezy” image. The default login is “pi” and password is “raspberry”.

pi_boot_up

 

After I logged in, I used the command “passwd root” to set the root password.

Run “startx” to go into the GUI mode.

pi_startx

To overclock it, uncomment the following line in /boot/config.txt.

arm_freq=800

Use the poweroff command to power off the device.

Raspberry Pi

Received my shipment for Raspberry Pi from element 14. Here are pictures I have taken.

The time I received it.

wrapped

 

After unwrapping,

out_of_the_box

 

Raspberry Pi,

raspberry_pi

 

The size of Raspberry Pi compared to a credit card,

raspberry_pi_size

SimpleBlocker

SimpleBlocker is a free and open source Android application which blocks or silences incoming calls from all calls, blocked contacts, unknown contacts, or both.

It is licensed under GPL and the source code is available at Google Code.

 

simpleblocker_blockedlist

 

simpleblocker_calllog

 

simpleblocker_settings

 

simpleblocker_help

2 Ways to Easily Generate Icons for Android Applications

For developers, creating icons for your mobile applications is not a straightforward task.

For Android, there are 2 easy ways for you to do so.

 

Android Asset Studio

The Android Asset Studio web app is a great resource for creating icons for your Android applications.

The icon generators allow you to quickly and easily generate icons from existing source images, clipart, or text. You can create Launcher icons, Menu icons, Action bar icons (Android 3.0+), Tab icons and notification icons.

Using the Device frame generators, you can quickly wrap your app screenshots in real device artwork, providing better context for your screenshots.

image

 

Android Eclipse Plugin

The new Android Eclipse Plugin now supports the same functionality directly. When you open the New wizard (Ctrl-N) the Android category contains a new item: "Android Icon Set":

image

You can use this to create your own icon sets.

image

SMSSpeaker

SMSSpeaker is an Android mobile application which uses the built-in TTS (Text to Speech) engine to read incoming SMS messages and call details.

Features include

  • Ability to turn on and off this feature.
  • Automatically disconnect incoming call.
  • Set ringer mode to Normal, Vibrate, Silent if you do not want to disconnect incoming call.
  • Choose Language, Language Speed
  • Enable and send autoresponder SMS automatically.

Please remember to turn off “Always use my settings” in Text-to-speech” settings in the phone Settings.

It is licensed under GPL and the source code is freely available.

Powered by WordPress