Make thumbnails and a web page to display the images in a directory in C#

[Make thumbnails]

This example searches a directory and makes thumbnails for each of the image files it finds there. It also builds a web page that displays the thumbnails and that includes links to the full-scale images. It puts all of the files (original images, thumbnails, and web page) in the directory of your choice.

The following code shows the MakeWebPage method that does most of the work.

// Make the web page and thumbnails.
private void MakeWebPage(string input_dir, string output_dir,
    string url_prefix, string web_page, int thumb_width,
    int thumb_height)
    // Open the HTML file.
    string html_filename = output_dir + web_page;
    using (StreamWriter html_file = new StreamWriter(html_filename))
        // Make a list of the image files.
        List<string> files =
                "*.bmp;*.gif;*.jpg;*.png;*.tif", false);

        // Process the files.
        foreach (string image_filename in files)
            // Copy the file to the destination directory.
            FileInfo image_fileinfo = new FileInfo(image_filename);
            string dest_filename = output_dir + image_fileinfo.Name;
            File.Copy(image_filename, dest_filename, true);

            // Get the image.
            using (Bitmap bm = new Bitmap(image_filename))
                // Get the original size.
                Rectangle src_rect =
                    new Rectangle(0, 0, bm.Width, bm.Height);

                // Shrink the image.
                double scale = Math.Min(
                    (double)thumb_width / bm.Width,
                    (double)thumb_height / bm.Height);
                int shrunk_width = (int)(bm.Width * scale);
                int shrunk_height = (int)(bm.Height * scale);
                Rectangle dest_rect =
                    new Rectangle(0, 0, shrunk_width, shrunk_height);

                using (Bitmap thumbnail =
                    new Bitmap(shrunk_width, shrunk_height))
                    // Copy the image at reduced scale.
                    using (Graphics gr =
                        gr.DrawImage(bm, dest_rect, src_rect,

                    // Save the thumbnail image.
                    string thumb_filename =
                            dest_filename.Length -
                                image_fileinfo.Extension.Length) +
                    thumbnail.Save(thumb_filename, ImageFormat.Png);

                    // Add the thumbnail image to the HTML page.
                    FileInfo thumb_fileinfo =
                        new FileInfo(thumb_filename);
                        "<a href=\"" + url_prefix +
                        image_fileinfo.Name + "\">" +
                        "<img src=\"" + url_prefix +
                        thumb_fileinfo.Name + "\">" +

                } // using (Bitmap thumbnail =
                  //     new Bitmap(shrunk_width, shrunk_height))
            } // using (Bitmap bm = new Bitmap(image_file))
        } // foreach (string image_file in files)

        // Close the HTML file.

        MessageBox.S	how("Processed " + files.Count + " images.");
    } // using (StreamWriter html_file =
      //     new StreamWriter(html_filename))
} // MakeWebPage

The method starts by creating a StreamWriter so it can write the new web page. Next it calls the FindFiles method to get files in the target directory that have bmp, gif, jpg, png, or tif extensions. See the example Find files that match multiple patterns in C# for a description of the FindFiles method.

For each file it found, the code copies the file to the output directory. It then loads the file and calculates how big it should make the thumbnail to fit in the desired size without distorting it. The code makes a thumbnail bitmap of that size and copies the original image into it. The method saves the thumbnail in .png format and finally writes a line into the web page to display the thumbnail, linking it to the full-size image.

Download Example   Follow me on Twitter   RSS feed   Donate

This entry was posted in files, html, image processing, internet, web and tagged , , , , , , , , , , , , . Bookmark the permalink.