Product and Development Musings

Persisting Annotations: The Viewer Control

14. January 2010 10:50

In the last series, we learned how to work with Annotations in ImageMan.Net Document Edition. Now, we will learn more about one of the ways to persist your annotated images.

The ImageMan.Net Viewer control automatically manages the annotations for each image in it's associated Images collection.  So, when you load an image in the Viewer and add annotations to it, then add a second image to the Viewer, you can still go back to the first image and manipulate the annotation marks. 

Let's try this out by adding some file and paging features to the example application that we started in the previous article.  (If you didn't create this solution, then I suggest you quickly follow the steps as indicated in the previous blog post so we can be in synch.)

  1. Open IMAnnotate1.sln in Visual Studio 2005 or 2008 (which ever you used last time)
  2. Open the Form1 class in design view
  3. Drag and drop a ImageMan.Net OpenImageDialog control onto the design surface
  4. Add the following menu items:
    - File
    - Image

A2-1

  1. Under the File men item, add the following menu items:
    - Add...  A2-2
  2. Under the Image menu item, add the following menu items:
    - First
    - Next
    - Previous
    - Last A2-3
  3. Automatically add events to each submenu item by double-clicking each one.  Let Visual Studio autogenerate the event method.
  4. Now, in code view, let's add some code that will handle adding images to the Viewer control's Images collection:

[C#]

private void addToolStripMenuItem_Click(object sender, EventArgs e)
{
    if (openImageDialog1.ShowDialog() == DialogResult.OK)
    {
        viewer1.Images.Add(ImImage.Load(openImageDialog1.FileName));
        viewer1.Images.MoveLast();
    }
}

[Visual Basic]

Private Sub AddToolStripMenuItem_Click( _
    ByVal sender As System.Object, _
    ByVal e As System.EventArgs) Handles AddToolStripMenuItem.Click
    If OpenImageDialog1.ShowDialog = Windows.Forms.DialogResult.OK Then
        Viewer1.Images.Add(ImImage.Load(OpenImageDialog1.FileName))
        Viewer1.Images.MoveLast()
    End If
End Sub
  1. Add this code that will handle navigating the image collection:

[C#]

private void firstToolStripMenuItem_Click(object sender, EventArgs e)
{
    viewer1.Images.MoveFirst();
    viewer1.Refresh();
}
 
private void nextToolStripMenuItem_Click(object sender, EventArgs e)
{
    viewer1.Images.MoveNext();
    viewer1.Refresh();
}
 
private void previousToolStripMenuItem_Click(object sender, EventArgs e)
{
    viewer1.Images.MovePrevious();
    viewer1.Refresh();
}
 
private void lastToolStripMenuItem_Click(object sender, EventArgs e)
{
    viewer1.Images.MoveLast();
    viewer1.Refresh();
}

[Visual Basic]

Private Sub FirstToolStripMenuItem_Click( _
    ByVal sender As System.Object, _
    ByVal e As System.EventArgs) Handles FirstToolStripMenuItem.Click
    Viewer1.Images.MoveFirst()
    Viewer1.Refresh()
End Sub
 
Private Sub NextToolStripMenuItem_Click( _
    ByVal sender As System.Object, _
    ByVal e As System.EventArgs) Handles NextToolStripMenuItem.Click
    Viewer1.Images.MoveNext()
    Viewer1.Refresh()
End Sub
 
Private Sub PreviousToolStripMenuItem_Click( _
    ByVal sender As System.Object, _
    ByVal e As System.EventArgs) Handles PreviousToolStripMenuItem.Click
    Viewer1.Images.MovePrevious()
    Viewer1.Refresh()
End Sub
 
Private Sub LastToolStripMenuItem_Click( _
    ByVal sender As System.Object, _
    ByVal e As System.EventArgs) Handles LastToolStripMenuItem.Click
    Viewer1.Images.MoveLast()
    Viewer1.Refresh()
End Sub
  1. Run the application and add a few images
  2. Add some annotations
  3. Navigate between the various images

You'll notice the annotations you added will remain intact while navigating between the images.  The annotated marks are able to moved, resized, modified, etc.

Next week, we'll continue on this persistence topic and learn how to save and brand the annotated image.

Log in