Creating First Emgu CV Project

In the last post we read about Starting with Emgu CV, now here we will start our first Emgu CV project. Emgu CV is not so difficult all we have to do is to add certain references and make use of Emgu Controls. Lets get started.

Lets start creating a blank windows form application.

My First Emgu CV Project

You will get a new project created for you, before starting further enable “show all settings” under tools, this enables a lots of features like form designer layout, snap to grid and many.

tools visual studio

Options page visual studio

 

 

 

 

 

 

 

 

Now lets start, first thing we will do is Add References, browse for the Emgu bin folder (by default it is located at C:Emguemgucv-windows-x86 2.3.0.1416bin ), in the bin folder there must be some dlls add all those starting with “Emgu.CV” (choose only one among Emgu.CV.DebuggerVisualizers.VS2008.dll and Emgu.CV.DebuggerVisualizers.VS2010.dll depending on the visual studio you are using, in my case it is Emgu.CV.DebuggerVisualizers.VS2010.dll)

Add Reference

Emgu CV Reference DLL

 Now we need to add some existing items, Goto Project>Add Existing Items and now again browse for bin directory of Emgu CV and this time choose all the dll files starting with “opencv_“, these dll files are required for each time the output is generated via Emgu that is why we added them to our project directory, we will also change there property so that they get copied always to the output folder. So, select all the dll added and select properties and change the “Copy to Output Directory” to “Copy Always“.

Add existing items emgu cv

 

 

 

 

 

 

 

 

 

 

 

We already have added the Emgu custom controls to our toolbox, now lets design our form, we will be using two ImageBox (Emgu Control), one Button and a Textbox, design the form as below.

Emgu CV Form Design

 

Now come to the form1.cs code view, and add the following namespaces;

using Emgu.CV;
using Emgu.CV.CvEnum;
using Emgu.CV.Structure;
using Emgu.CV.UI;

Next create some member variables :

Capture capturecam = null; //instance for capture using webcam
bool CapturingProcess = false; //boolean stating the capturing process status
Image<Bgr, Byte> imgOrg; //image type RGB (or Bgr as we say in Open CV)
Image<Gray, Byte> imgProc; //processed image will be grayscale so a gray image

Now its time to add a form load event, we will start capturing via webcam under it.

capturecam = new Capture();

this will associate the default webcam with capturecam object.

code snippet

 

 

 

 

 

 

 

 

 

 

 

 

 

 

We have added the associated to capture object in try catch block in order to avoid the error if the webcam is already in use.

We added a event handler to Application.Idle, so that it performs task when idle, and the task is to get the next frame. ProcessFunction is called at every idle state of application.

QueryFrame gets the next frame from the webcam, if it is null it means there is some problem and hence we stop our app there.

InRange function takes two parameter min range and max range of Bgr.

SmoothGaussian applies the Gaussian smoothing with the x,y length = 9, we can pass different parameters for x and y also.

Now lets come to the coding part of playorpause button:

playorpause code

 

 

 

 

 

 

 

 

 

this is the simplest part, it checks the boolean value of CapturingProcess and accordingly changes the button text and stops streaming from webcam.

Sample Output: 

emgu cv output

 

Starting with Emgu CV

What is Emgu CV ?

Before learning what is Emgu CV, one should know what is Open CV.

Open CV

It stands for Open Source Computer Vision, it was designed especially for computational efficiency with strong focus on real time applications.  It is written in optimized C/C++, and can take advantage of multi-core processing. In Image processing it has been a great boon for the developers.

Emgu CV

Its is essentially a huge library of “wrapper” functions that allows calling OpenCV funtions from Visual Studio Windows Form Application. It is necessary because Visual Studio/.NET is an “interpreted” environment that cannot directly call functions written in native C/C++.

In this tutorial we will start configuring our Visual Studio and environment for developing applications using EmguCV.

Firstly we need to download some the essential tools, we will be using the most stable versions though the new versions are also available.

  1. Visual Studio 2010 Express Edition
  2. Emgu CV (version 2.4.2 is available but had various issues so I’m doing it with the most stable version found 2.3.0)

Once you have installed all this it should work fine, but one common exception found is

The type initializer for ‘Emgu.CV.CvInvoke’ threw an exception.

If you see this exception, do following :

  • For Version 2.4+, the bundled OpenCV binary is build with Visual Studio 2010, you will needs to installed MSVCRT 10.0 SP1 x86 or MSVCRT 10.0 SP1 x64 to resolve the dependency issue.
  • For Version 2.0+, the bundled OpenCV binary is build with Visual Studio 2008, you will needs to installed MSVCRT 9.0 SP1 to resolve the dependency issue.
  • For Version 1.5, the bundled OpenCV pre1.1 binary is build with Visual Studio 2005, you will needs to installed MSVCRT 8.0 SP1 to resolve the dependency issue.

This is the most effective solution to the problem for the above exception, for others and detailed troubleshooting click here.

Now start the configuration part :

  1. We need to add a environment variable to the system variables.
    Right Click My Computer>Advanced System Settings>Environment Variables
    Under “System Variables” edit variable “path”
    add a semicolon(;) and the path to the emgu installation directory bin folder(by default it is C:Emguemgucv-windows-x86 2.3.0.1416bin
    system variables
  2. Now the environment is ready and we need to add the emgu custom controls to Visual Studio ToolBox
    In the toolbox, right click on General tab and select “choose items”
    Visual Studio ToolBox
  3. Select browse on bottom right corner and browse for “Emgu.CV.UI.dll” (it is located in bin folder of installation directory i.e C:Emguemgucv-windows-x86 2.3.0.1416bin)
  4. Now the Visual Studio will have the tools for emgu control
    Emgu Controls

 This is all required for setting up the environment for working with Emgu CV, in the next article we will learn how to create our first project with Emgu CV. Cheers :)

Android Development – Getting Started

I hope the Android Development - Intro helped you in configuring your machine for developing Android apps, in this tutorial we will quick start our first Android app. Here is a step wise article.

Step 1 – Start the eclipse extracted from the adt-bundle  i.e  %….%adt-bundle-windows/eclipse/eclipse.exe

Step 2 – A workspace launcher will popup and you have to define the workspace for your android apps, workspace is the place where all the source files are kept.

Workspace Launcher

Step 3 – Once you have selected your workspace now your IDE is ready for you, Goto File>New>Android Application Project

Android Application Project

Step 4 – Next step is about configuring your project, it will have options like creating custom launcher and adding activity etc.

Configure Android Project

Step 5 – Hence we have checked Create custom launcher icon in the previous screen, this screen allows to add our custom launcher icon. Here I’m using the default icons.

Custom Launcher Icon

Step 6 – Next we have to decide the activity for our app, there are different types of activity available but for the beginners we will start with BlankActivity.

Create Activity Android Application

Step 7 -  In this screen you can give name to your activity.

Name Activity - Android

This was all the configuration part, its done now you can start your real coding. After completing the above steps, you will see a designer screen, where you can design and code your app.

New App Designer - Android

Now we have the blank app with the title MyFirstApk and “Hello world!” text in center. This is just a hello world app, lets start Running Android App.

Android Development – Intro

Since last few days I was trying to get my hands on some new technology, tried many but finally landed with Android Development. The only thing which attracted me to this is that I can deploy my apps directly to my phone. Here is a quick tutorial how to get started.

Android plugins are available in the major IDEs like Eclipse and NetBeans, I tried configuring with all but the ADT (Android Development Tool) available is easy to use and recommended. Just download the bundle and extract to a specific location and it does everything for you.

With a single download, the ADT Bundle includes everything you need to begin developing apps:

  • Eclipse + ADT plugin
  • Android SDK Tools
  • Android Platform-tools
  • The latest Android platform
  • The latest Android system image for the emulator

Android Development Tool

Stay Tuned for next posts on android development.

Dell Inspiron N5010 Windows 8 Bluetooth FIX

Windows 8 had great start in previous days, and my Dell Inspiron N5010 didn’t supported Bluetooth drivers, i searched many websites  but everywhere is was mentioned that N5010 doesn’t have a bluetooth drivers support for WIndows 8. But then i found a quick fix. Follow the below steps :

Step 1

Run 15r BTOOTH.exe (your bluetooth driver for Windows 7).

Your files will get extracted in C:DellR273948

Step 2

Goto the path C:delldriversR273948Win64.

Locate BTW.msi and run it in compatibility mode.

compatibility

It will start installing and in the end it will ask did it worked fine well in compatibility mode, Press Yes.

You are done. Enjoy.

Add a Settings Panel in Charm Bar – Privacy Policy

Charm Bar is a brand new feature of Windows and is seen for the first time, it can be referred to as universal toolbar and thus you can access it from anywhere no matter which application you are working on. The two ways in which you can access the Charm Bar is, firstly, by dragging your mouse pointer to the top or bottom right corner of the screen (since the show desktop thing is also at the bottom right, I prefer the top right corner). You can alternatively press the Windows+C button on your computer to invoke the bar.

Charm Bar

The Settings charm provides a single access point to all settings that are relevant in the user’s current context. The Settings charm is always available. Regardless of context, settings include system settings that always apply, system-brokered settings that enable users to control an app’s access to system devices and capabilities, and settings that are specified by the current app.

I will show you a step wise instruction on how to add a item in settings charm bar.

Step 1 : Add the Following Namespaces

using Windows.UI.ApplicationSettings;
using Windows.UI.Popups;

Step 2 : Next you need to register for “CommandsRequested” in your page, Add the handler during app initialization

SettingsPane.GetForCurrentView().CommandsRequested += OnSettingsPaneCommandRequested;

Step 3 : Add my handler that shows the settings text

private void OnSettingsPaneCommandRequested(SettingsPane sender,SettingsPaneCommandsRequestedEventArgs args)
{
// Add the commands one by one to the settings panel
args.Request.ApplicationCommands.Add(new SettingsCommand(“commandID”, “Command Name”, DoOperation));
}

Step 4 :  Add DoOperation method

private void DoOperation(IUICommand command)
{
// Write the logic here that you want to do, when the user clicks it
}

This is all, you are done. Privacy policy is the major need of app developers these days, they need to add a privacy policy in Settings charm, below is the DoOperation method for adding a privacy policy.

private async void DoOperation(IUICommand command)
{
Uri uri = new Uri(“<insert web url to your privacy policy here>”);
await Windows.System.Launcher.LaunchUriAsync(uri);

}

Enjoy. Download Source code.

Points To Remember While Developing App For Windows 8

Recently I attended Windows 8 AppFest at Banglore and preparing now for Wowzapp (Windows 8 Hackathon) in Agra and learned a lot about developing Windows 8 apps, and I found many folks here are confused about the metro style apps (Windows RT Style). This post is to keep in mind some points what to do and what not to do while developing apps for Windows 8.

Use of Buttons

Use of buttons in Windows 8 apps is strictly prohibited, it’s not that the button control is not present there, but the classic button view is ignored and preferred not to be used, as the Windows 8 UI is completely a new one and these buttons make them look clumsy. There won’t be any issues while getting your app certified but ignoring them are the standard developing rules, you can use the Image element instead and can use the image click events to add events to it or if you want to stick to button control you need to completely customize it, use some background foreground images and color such that it doesn’t look like a classic button.

Color Range

I have seen many developers adding gradient in the background which may look good to them but not to all the users, so try to keep your app simple and don’t add such gradients use a single color in your background and some contrast color for the foreground items.

App Bar

This is located at the bottom of the app and comes up when the app is right clicked, this contains all the actions that can be performed on that particular app page. Your app page is meant to be kept very clean just the data that is to be accessed and all the setting/actions/navigation should come to the charm, app bar or navigation bar.

Navigation Bar

This is located at the top of the application and comes up on right click, this contains all the navigation’s which are possible, like menu items etc. remember menu items can’t be in the app bar, app bar only contains the actions to be performed on a particular page. Having a separate view of AppBar and NavigationBar in mind is very important.

Few other points to be kept in mind are :

  • Your app should be Fast and Fluid
  • Snap and Scale Beautifully
  • Use the right Contracts
  • Invest in a Great Tile
  • Feel Connected and Alive
  • Embrace Metro Principles

Hope you emerge out to be a great app developer, cheers.

Rotate and Flip Images in Windows Form

One of my friends asked me how to rotate an image to a particular angle, so I just thought of writing an article on it. Below is the step-wise process on how to use the inbuilt functions for rotating and flipping the image.

Step 1: Create a blank windows form application

Step 2: Add a pictureBox from the toolbox and add a source image to it.

Now comes the real part, using Image.RotateFlip we can rotate the image by standard angles(90,180,270 degrees) or flip the image horizontally or vertically.

The parameter of RotateFlip is System.Drawing.RotateFlipType, which specifies the type of rotation and flip to apply to the image.

e.g : pictureBox1.Image.RotateFlip(RotateFlipType.Rotate180FlipNone);

the above code will rotate the image in pictureBox1 by an angle of 180 degree.

Step 3: Now back to our code, add namespaces we will use here

using System.Drawing.Imaging;
using System.Drawing.Drawing2D;

Step 4: We will make a function RotateImg with two arguments one is the Bitmap Image and the other is the float angle. Code snippet is as follows :

public static Bitmap RotateImg(Bitmap bmp, float angle)
{
int w = bmp.Width;
int h = bmp.Height;
Bitmap tempImg = new Bitmap(w, h);
Graphics g = Graphics.FromImage(tempImg);
g.DrawImageUnscaled(bmp, 1, 1);
g.Dispose();
GraphicsPath path = new GraphicsPath();
path.AddRectangle(new RectangleF(0f, 0f, w, h));
Matrix mtrx = new Matrix();
mtrx.Rotate(angle);
RectangleF rct = path.GetBounds(mtrx);
Bitmap newImg = new Bitmap(Convert.ToInt32(rct.Width), Convert.ToInt32(rct.Height));
g = Graphics.FromImage(newImg);
g.TranslateTransform(-rct.X, -rct.Y);
g.RotateTransform(angle);
g.InterpolationMode = InterpolationMode.HighQualityBilinear;
g.DrawImageUnscaled(tempImg, 0, 0);
g.Dispose();
tempImg.Dispose();
return newImg;
}

Step 5: Now we have a function which will rotate and image to the arbitrary angle, I’m adding my code now to the form_load event so that as soon as the form loads my code gets executed.

Bitmap bitmap = (Bitmap)pictureBox1.Image;
pictureBox1.Image = (Image)(RotateImg(bitmap, 30.0f));

the above two line code will first convert the image in pictureBox1 to a Bitmap image and then it will call our function RotateImg to rotate the image to 30 degree (example).

Here is the snapshot of the output window.

 

Connect C# with MySql

This article is to show the step wise process of how to connect C# to MySql, I will be using MySql Connect/Net for this. Later I will show how to execute INSERT, UPDATE, DELETE and SELECT commands, this will include only setting up the connection.

Getting Started

First make sure you have downloaded and installed the MySql Connector/Net from the MySQL official website. In this article, I will use the Connector/NET version 6.1.6.

I felt the need of this when I was developing a windows form application and wanted to connect it to a database on my website. In this article I’m assuming that you have a cpanel on web and a database in it, you can also install MySql on your system.

Our first step will be “Adding Reference and Creating the MySQL Connector DLL from the Project”.

First we need to add a reference to ‘mysql’, we can do this by navigating to solution explorer and then right-click on the reference folder and then look for MySql.Data under .net tab

In order to use the application on other computers that don’t have the connector installed, we will have to create a DLL from the reference. To do so, we right click the reference name in our project, and set the copy local to true in its properties:

Now we are done with adding the reference and now we can start our actual coding.

We will start by adding a namespce

using MySql.Data.MySqlClient;

I have created a simple form with a button in it, our connection will be established when the button is clicked i.e. we will write our code in the OnClicked event of the button. My form looks some what like this.

Now comes the actual coding part.

We will have to create the connection string first.

To establish a connection, you must specify the computer you are connecting to, that has MySQL installed. To indicate the computer you are connecting to, use the Data Source, theDataSource, the Host, the Server, the Addr, the Address, or the Network Address attribute of the connection string. If you are connecting to a local database (installed in the same computer where the application is running), you can omit specifying the name of the computer. Otherwise, you can assign localhost to this attribute. To specify the database you want to connect to, the connection string includes an attribute named Database or Initial Catalog.

To specify the user name, use the User Id, the Uid, theUser name, or the Username attribute and for password use the PASSWORD or the PWD (remember that the attributes are not case-sensitive) attribute.

Here is a sample connection string :

string cs = @”server=YOUR_SERVER_NAME;userid=YOUR_USERNAME;
password=YOUR_PASSWORD;database=DATABASE_NAME”;

Now the code under the button clicked event.

That’s all. Debug your application, i have added the connection open in try catch block so if the connection established it will show a message boc which says “Connection Established”.

Cheers.

Image Browser Windows 8 – First Simple App

This is a very first app we are going to create for windows 8, its a Image Browser, we will create it using a FlipView control in windows 8. The FlipView control lets people flip through views or items one at a time. Flip buttons appear on mouse hover and let people flip to the next or previous item.

First step is to create a new Metro Style Blank App Project.

Now the project is created and the ‘MainPage.xaml’ is opened in the main window or you can open it from the solution explorer. Firstly we will add FlipView control which can be done by using the toolbox on left or writing some xaml code. The code for adding a FlipView is written below, we have used HorizontalAlignment and VerticalAlignment so that our control comes in center of the screen.

<FlipView HorizontalAlignment=”Center”  VerticalAlignment=”Center”>

</FlipView>

FlipView control can contain many FlipViewItem in it, which will flipped once at a time, inside the FlipViewItem we define what is to be displayed, since we are making a image gallery we will use Image control inside every FlipViewItem we add. Here is the complete snippet of the code.

I have added three images as a sample, you can add as many as u can or u can bind the image control programmatically to retrieve ‘n’ number of images. You might have noticed the beauty of Windows 8 SDK, i haven’t used any C# code and i have a nice light weight image browser. Debug the app.

Ask for source code. Cheers :)