Introduction
All Windows Mobile devices nowadays come equipped with a built-in camera. With its increasing resolution and overall quality of the pictures it can take, its use is no longer limited to taking family photographs. Every business or institution which requires photographic documentation (such as insurance agents, billboard maints, crime scene inspectors, photo journalists, etc.) can find such Windows Mobile device useful.
In this article, I will demonstrate how to create a smart device application using Microsoft Visual Studio (any of 2005 or 2008 will do) which uses a camera and built-in microphone. The application will provide this functionality:
- Start the built-in camera and take a picture.
- Display the taken picture and let the user adjust it (by rotating, cropping, adjusting brightness, contrast, gamma correction value).
- Record a voice note belonging to the picture.
- Save the picture together with the voice note into a mobile SQL CE database.
- View the pictures stored in the database and play back the recorded notes.
This is the look of the mainscreen of the application:
Prerequisites
You will need:
- Microsoft Windows Mobile 5.0 SDK (or later) which you can download here.
- A Windows Mobile 5.0 device with a built-in camera to test the application.
- Resco MobileForms Toolkit Volume 2 which you can download here.
Resco MobileForms Toolkit is a set of Visual Studio controls designed for mobile devices. After installing Resco MobileForms Toolkit Volume 2 to your computer, the controls will be automatically added to Visual Studio's toolbox. We will use these Resco controls and libraries in the project:
- Resco Audio library for .NET CF
- Resco ImageBox for .NET CF
- Resco ImageButton for .NET CF
The application can be created for both .NET Compact Framework 2.0 and .NET Compact Framework 3.5. Just download the appropriate version of Resco MobileForms Toolkit 2008.
Preparing the project
Start by creating a new smart device project in Visual Studio. For the Resco Audio library and Resco ImageBox control to work properly, two .dll files containing the native code must be copied to the mobile device. Add these two file as content to your project:
- Resco.Audio.Native.dll
- Resco.ImageBox.Native.dll
You will also have to set their CopyToOutputDirectory property to either CopyAlways or CopyIfNewer. Also, add a database file named data.sdf to the project.
Database
The application will use mobile SQL CE server which is part of .NET Compact Framework. Visual Studio should be able to install .NET Compact Framework and SQL CE server to your mobile device automatically upon deploying the application. The database model is very simple. The database contains only one table and its schema can be seen on Figure 1.
Figure 1 Database model
The Thumb column will contain a thumbnail of the image which will be created from the original image by reducing its size. This will be used to let the user see a preview of the images.
User interface
The application consists of three Form objects:
- MainForm - allows the user to take a picture using the camera and adjust it.
- RecordForm - allows the user to record a voice note.
- ViewImages - allows the user to view the images from the database and play back the recorded notes.
MainForm
The MainForm in Visual Studio's designer is displayed on Figure 2. It contains the ImageBox control which displays the taken picture. The ImageButtons at the top right corner are used to rotate the image and start the built-in camera. In the lower part of the form, there are 4 track bars which can be used to zoom in and out, adjust brightness, contrast and gamma correction value. The Crop mode checkbox sets the ImageBox control into crop mode as can be seen on Figure 3.
|
|
Figure 2 MainForm designer |
Figure 3 Crop mode |
The user can adjust the size and position of the cropping rectangle and then perform the cropping. There are two menu items on the form:
- Save - saves the picture (including the performed adjustments) into the database together with a voice note.
- View - views the images from the database.
RecordForm
You can see the design of this form on Figure 4. The form is very simple. It contains an ImageButton which starts and pauses the recording. The recorded length in milliseconds is displayed in a TextBox. The value of TextBox is refreshed every 500 milliseconds using a Windows Timer object. As soon as the user has finished recording, he can close the form by clicking the OK button.
Figure 4 RecordForm design
ViewImagesForm
The most contents of this form are created during run-time. The designer contains only a Panel container which fills the entire client area. As soon as the user chooses to view the images, the images in the database are first counted. Then corresponding amount of ImageButtons are created and added to the Panel, each displaying a thumbnail of an image (see Figure 5). The user can click any of these ImageButtons. Then the image is displayed using an ImageBox across the whole client area of ViewImages form (see Figure 6).
|
|
Figure 5 ViewImages form |
Figure 6 ViewImages form - image displayed |
Application logic
The logic of the application is depicted on Figure 7. The state diagram shows how and when the individual forms are displayed. You can see that recording a voice note is arbitrary. If the user chooses not to record a voice note a DBNull.Value is stored into the Image table in the Audio column.
Figure 7 State diagram
Conclusion
Having an intelligent camera with you which can not only take pictures, but also allow the user to process them and save it to the database, can be very useful in many business sectors. The mobile database can consequently be synchronized with company's main database server ensuring accessibility and safety of data. You can download the whole application including the source code in C# here.