Click here to Skip to main content
13,862,971 members
Click here to Skip to main content
Add your own
alternative version


285 bookmarked
Posted 12 Apr 2002
Licenced CDDL

C# Photo Album Viewer

, 1 Apr 2012
Rate this:
Please Sign up or sign in to vote.
A C# Windows application to store and retrieve photos from a SQL Server database.

Sample Image - AlbumViewer.jpg

C# Photo Album Viewer

This sample is a C# Windows application to demonstrate storing and retrieving of images from a database.

Although, this article and code has been updated to support .NET 4.0 and SQL Server 2012 it was previously build for .NET 1.0 and SQL Server 2000 so all methods and techniques should work in previous versions of those applications with little or no modifications.   

The Database Tables and Stored Procedures 

The download file contains the script to create the database and stored procedures necessary for this demo application.

Initial Load

After the main form for this application is initialized the first thing necessary is to obtain any existing Albums and Photos and load them in the TreeView.

private void LoadAlbums()
    // Get all albums, including photos, from the database
    ReadOnlyCollection<album> albums = Data.GetPhotoAlbums();

    // Now iterate through them and add to treeview
    foreach(Album album in albums)
        TreeNode albumNode = new TreeNode(album.Name);
        // Add the album struct to the Tag for later
        // retrieval of info without database call
        albumNode.Tag = album;


        // Add each photo in album to treenode for the album
        foreach(Photo photo in album.Photos)
            TreeNode photoNode = new TreeNode(photo.Name);
            photoNode.Tag = photo;


This is fairly straight forward. The TreeNode Tag object is being set to the struct so that later when selecting and item there is no additional database calls necessary to populate the display controls.

Obtaining the via the Data.GetPhotoAlbums method is, again, a straight forward ADO.NET implementation.

public static ReadOnlyCollection<album> GetPhotoAlbums()
    List<album> albums = new List<album>();
    using(SqlConnection conn = new SqlConnection(ConnectionString))
        using(SqlCommand cmd = new SqlCommand("GetAlbums", conn))
            cmd.CommandType = System.Data.CommandType.StoredProcedure;

            // Use using here so SqlDataReader will be closed automatically
            using(SqlDataReader reader = cmd.ExecuteReader())
                    albums.Add(new Album()
                        Id = reader.GetInt32(0),
                        Name = reader.GetString(1),
                        Description = reader.GetString(2)

        // Now get all the photos for each each album
        // This could be obtained by a single query with multiple
        // resultsets but for illustrative purposes it is broken
        // into two processes
        using(SqlCommand cmd = new SqlCommand("GetPhotosByAlbum", conn))
            cmd.CommandType = System.Data.CommandType.StoredProcedure;
            cmd.Parameters.Add("@albumId", SqlDbType.Int);
            for(int x = 0; x < albums.Count; x++)
                cmd.Parameters["@albumId"].Value = albums[x].Id;

                List<photo> photos = new List<photo>();
                // Use using here so SqlDataReader will be closed automatically
                using(SqlDataReader reader = cmd.ExecuteReader())
                        photos.Add(new Photo()
                                Id = reader.GetInt32(0),
                                Name = reader.GetString(1),
                                Description = reader.GetString(2),
                                Image = (byte[])reader.GetValue(3)

                // Annoying because
                // albums[x].Photos = photos.AsReadOnly();
                // produces the error, Cannot modify the return value of xxx because it is not a variable
                // The error could be avoided by using class rather than struct
                Album temp = albums[x];
                temp.Photos = photos.AsReadOnly();
                albums[x] = temp;

    return albums.AsReadOnly();

The first step is to initialize the SqlConnection and SqlCommand objects. Then execute the store procedure and use a SqlDataReader to iterate through the results and create a collection of Albums to return. After this the Photos are added to each Album in a similar manner. As noted, this could be done with one store procedure, however, to illustrate the process it has been broken in to two methods.

Storing the images

After selecting the Add Photo context menu item a multi select FileOpenDialog allows images to be selected for addition. For each file a System.IO.FileStream is created and used to read into a byte array. The byte array is then passed to a method which uses it as an input parameter for a stored procedure to add it to an image field of the database table.

The last step is to add the image to the treeview. A helper class call TreeItem is used for this purpose. This class stores the description and database index id of the image. This class is also used for albums so an enum defines the type of object it is. After a new instance of this class is created it is assigned to the Tag member of the TreeNode. The node is then added to the selected album node.

private void OnAddPhoto(object sender, EventArgs e)
    if(DialogResult.OK == openFileDialog1.ShowDialog())
        // Retrieve the Album to add photo(s) to
        Album album = (Album)treeAlbums.SelectedNode.Tag;

        // We allow multiple selections so loop through each one
        foreach(string file in openFileDialog1.FileNames)
            // Create a new stream to load this photo into
            System.IO.FileStream stream = new System.IO.FileStream(file, System.IO.FileMode.Open, System.IO.FileAccess.Read);
            // Create a buffer to hold the stream bytes
            byte[] buffer = new byte[stream.Length];
            // Read the bytes from this stream
            stream.Read(buffer, 0, (int)stream.Length);
            // Now we can close the stream

            Photo photo = new Photo()
                // Extract out the name of the file an use it for the name
                // of the photo
                Name = System.IO.Path.GetFileNameWithoutExtension(file),
                Image = buffer

            // Insert the image into the database and add it to the tree
            Data.AddPhoto(album.Id, photo);
            buffer = null;

            // Add the photo to the album node
            TreeNode node = treeAlbums.SelectedNode.Nodes.Add(photo.Name);
            node.Tag = photo;

public static void AddPhoto(int albumId, Photo photo)
    using(SqlConnection conn = new SqlConnection(ConnectionString))
        using(SqlCommand cmd = new SqlCommand("InsertPhoto", conn))
            cmd.CommandType = System.Data.CommandType.StoredProcedure;

                // Add the name parameter and set the value
            cmd.Parameters.AddWithValue("@name", photo.Name);
            // Add the description parameter and set the value
            cmd.Parameters.AddWithValue("@desc", photo.Description);
            // Add the image parameter and set the value
            cmd.Parameters.AddWithValue("@photo", photo.Image);
            // Add the album parameter and set the value
            cmd.Parameters.AddWithValue("@albumId", albumId);

            // Add the return value parameter
            SqlParameter param = cmd.Parameters.Add("RETURN_VALUE", SqlDbType.Int);
            param.Direction = ParameterDirection.ReturnValue;

            // Execute the insert

            // Return value will be the index of the newly added photo
            photo.Id = (int)cmd.Parameters["RETURN_VALUE"].Value;

Display the image

The AfterSelect event captures the selection of an image or album. If an images is selected the Tag member of the selected node is retrieved and cast into a TreeItem. The Id member of this class is then passed to a stored procedure to retrieve the desired image. The return of the ExecuteScalar method is cast into a byte array which is then read into a System.IO.MemoryStream. This stream object is then used to create a Bitmap which is then used assigned to the picturebox for display.

private void AfterSelect(object sender, TreeViewEventArgs e)
    DisplayPanel.Visible = true;

    if(treeAlbums.SelectedNode.Tag is Album)
        Album album = (Album)treeAlbums.SelectedNode.Tag;

        DisplayName.Text = album.Name;
        DisplayDescription.Text = album.Description;

        pictureBox.Image = null;
    else if(treeAlbums.SelectedNode.Tag is Photo)
        Photo photo = (Photo)treeAlbums.SelectedNode.Tag;

        DisplayName.Text = photo.Name;
        DisplayDescription.Text = photo.Description;

        System.IO.MemoryStream stream = new System.IO.MemoryStream(photo.Image, true);
        stream.Write(photo.Image, 0, photo.Image.Length);

        // Draw photo to scale of picturebox
        DrawToScale(new Bitmap(stream));
        DisplayPanel.Visible = false;


This is a relatively simple implementation of a photo album viewer application. Using .NET and C# definitely made this application very easy to make. Storing the images in a SQL Server database adds a bit to the distribution but also simplifies the application by having one source to store and retrieve images from. You also don't have to worry about missing files or broken links.


4/1/2012 - Updated to .NET 4.0, SQL Server 2012 and apply lessons learned learned for last 10 years.  


This article, along with any associated source code and files, is licensed under The Common Development and Distribution License (CDDL)


About the Author

You may also be interested in...

Comments and Discussions

Questionc# Pin
Manjiri Sakhardande22-Feb-14 21:23
memberManjiri Sakhardande22-Feb-14 21:23 
GeneralMy vote of 5 Pin
kevin_yap15-Jul-13 22:18
professionalkevin_yap15-Jul-13 22:18 
GeneralMy vote of 5 Pin
Kanasz Robert24-Sep-12 7:16
memberKanasz Robert24-Sep-12 7:16 
GeneralMy vote of 5 Pin
Perić Željko15-Mar-12 22:52
professionalPerić Željko15-Mar-12 22:52 
QuestionNeed help ASAP Pin
Behnam0713-Feb-12 5:05
memberBehnam0713-Feb-12 5:05 
AnswerRe: Need help ASAP Pin
Not Active13-Feb-12 6:25
mentorNot Active13-Feb-12 6:25 
GeneralRe: Need help ASAP Pin
Behnam0713-Feb-12 22:02
memberBehnam0713-Feb-12 22:02 
GeneralRe: Need help ASAP Pin
Not Active14-Feb-12 2:10
mentorNot Active14-Feb-12 2:10 
GeneralThanks Pin
Nueman9-Feb-11 17:44
memberNueman9-Feb-11 17:44 
GeneralRe: Thanks Pin
Not Active10-Feb-11 2:54
mentorNot Active10-Feb-11 2:54 
GeneralRe: honest feedback Pin
Not Active27-Dec-10 10:26
mentorNot Active27-Dec-10 10:26 
GeneralRe: honest feedback Pin
Not Active27-Dec-10 11:01
mentorNot Active27-Dec-10 11:01 
GeneralRe: honest feedback Pin
Not Active27-Dec-10 11:23
mentorNot Active27-Dec-10 11:23 
GeneralRe: honest feedback Pin
Ali Al Omairi(Abu AlHassan)28-Dec-10 9:22
professionalAli Al Omairi(Abu AlHassan)28-Dec-10 9:22 
GeneralRe: honest feedback Pin
Not Active28-Dec-10 9:35
mentorNot Active28-Dec-10 9:35 
GeneralRe: honest feedback Pin
Ali Al Omairi(Abu AlHassan)28-Dec-10 9:45
professionalAli Al Omairi(Abu AlHassan)28-Dec-10 9:45 
QuestionHow come no foreign keys Pin
macupryk2-Feb-10 12:03
membermacupryk2-Feb-10 12:03 
AnswerRe: How come no foreign keys Pin
Not Active2-Feb-10 12:09
mentorNot Active2-Feb-10 12:09 
Generalpls help Pin
Jaedah14-Jan-10 6:19
memberJaedah14-Jan-10 6:19 
GeneralRe: pls help Pin
Not Active14-Jan-10 7:14
mentorNot Active14-Jan-10 7:14 
GeneralMy vote of 1 Pin
DanWalker29-Dec-09 10:14
memberDanWalker29-Dec-09 10:14 
GeneralRe: My vote of 1 Pin
Not Active14-Jan-10 7:11
mentorNot Active14-Jan-10 7:11 
GeneralRe: My vote of 1 Pin
L Viljoen26-Apr-10 4:51
professionalL Viljoen26-Apr-10 4:51 
Questionscrolling in picture box Pin
sdeepa19-Dec-08 19:39
membersdeepa19-Dec-08 19:39 
AnswerRe: scrolling in picture box Pin
Not Active20-Dec-08 3:29
mentorNot Active20-Dec-08 3:29 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Cookies | Terms of Use | Mobile
Web03 | 2.8.190214.1 | Last Updated 1 Apr 2012
Article Copyright 2002 by Not Active
Everything else Copyright © CodeProject, 1999-2019
Layout: fixed | fluid