Get Picture Information inside a StatusStrip

In this brief tutorial I will show you how you can get basic information from a picture and display them inside StatusLabels on a StatusStrip control.

If you are using C# 2010 Express, like I am, you will notice that it's very easy to do this. First, set up a new project and on the main form add a pictureBox, a button, and a statusStrip. On the statusStrip you need to add 4 statusLabels in which we will display the Picture's Pixel Size, the Picture's KB Size, the Picture's Path from where it was loaded and the Cursor Coordinates on the PictureBox.

At first we will set up some initial text for the statusLabels and set up some borders between them.

public Form1()
{
InitializeComponent();
//we set the text for the initial statusStrip statusLabels
picSize.Text = "Picture Pixel Size: "; //will display the picture's pixel size
picSizeKB.Text = "Picture KB Size: "; //will display the picture's size in KB
cursorPosition.Text = "Cursor Position: "; //will display the position of the cursor on the picture
filePath.Text = "Picture Path: "; //will display the path from where the picture has been opened
//creates a Right side border for every statusLabel on the statusStrip only to separate them
picSize.BorderSides = ToolStripStatusLabelBorderSides.Right;
picSize.BorderStyle = Border3DStyle.RaisedOuter;
picSizeKB.BorderSides = ToolStripStatusLabelBorderSides.Right;
picSizeKB.BorderStyle = Border3DStyle.RaisedOuter;
cursorPosition.BorderSides = ToolStripStatusLabelBorderSides.Right;
cursorPosition.BorderStyle = Border3DStyle.RaisedOuter;

//the text displayed on the button
button1.Text = "Load Picture";

//note that all text and borders we set up earlier can be easily
//setup from the respective control's proprieties panel
}


Then we will double click the button that we have added to add a Click event which will allow us to load a picture inside the pictureBox.

private void button1_Click(object sender, EventArgs e)
{
//when clicking the button we open a window that allows us
//to select the picture we want to load inside the picture box
OpenFileDialog openPic = new OpenFileDialog();
//this Filter allows us to open only JPG files
openPic.Filter = "Image Files(*.jpg)|*.jpg;";
if (openPic.ShowDialog() == DialogResult.OK)
{
pictureBox1.Image = new Bitmap(openPic.FileName);
}
//We update the picSize label to show the pixel size of the picture we opened
picSize.Text = "Picture Pixel Size: " + pictureBox1.Image.Width + " X " + pictureBox1.Image.Height;
//The FileInfo is located in IO framework class, so if you haven't called it yet, you should
//before the namespace you will have to add the line "using System.IO;"
//We need this class to get the size of the picture we opened
FileInfo fi = new FileInfo(openPic.FileName);
//Displays the size of the picture in KB
//We have to divide it by 1024 as the Length method calculcates the class in bytes
picSizeKB.Text = "Picture KB Size: " + fi.Length / 1024 + " KB";
//Updates the file path
filePath.Text = "File Path: " + openPic.FileName;
}


Last, we will need to set up a MouseMove event on the Picture box to update the cursor's coordinates.

private void pictureBox1_MouseMove(object sender, MouseEventArgs e)
{
//An if will be used as we don't want anything to be updated unless a picture is loaded
//inside the if statement we check to see if an image is loaded
if (pictureBox1.Image != null)
{
//We add a MouseMove event to the picturebox
//to display the mouse coordinates on the picture
cursorPosition.Text = "Cursor Poistion: (" + e.X + " : " + e.Y + ")";
}
}


In case you will no longer see some of the Status Labels upon updating them, it means that the form is too small and there is no room to display them. Enlarging the form should fix the problem.

You should obtain something like in the bellow screenshot:

3 comments:

  1. very interesting, thanks

    ReplyDelete
  2. That's amazing! Never imagined a C# StatusStrip control can do this.

    ReplyDelete
  3. Thanks a lot...it solves my problem...Keep it up...

    ReplyDelete