Click here to Skip to main content
15,029,333 members
Articles / Programming Languages / C#
Posted 28 Dec 2012


8 bookmarked

Web Page Capturing

Rate me:
Please Sign up or sign in to vote.
5.00/5 (2 votes)
29 Dec 2012CPOL2 min read
Windows Forms application for capturing or thumbnailing a web page
Image 1


This is a Windows Forms application for taking a snapshot of a web page. It has many uses (example: Alexa and Google search).


I used WebBrowser in code behind to load the page and then took a snapshot of it. The output image will be shown in a picture box in the main window.

Using the Code

There is just one class WebPageCapture that handles everything. After filing the forms and clicking on save button, checking that the size property has been set properly, the output image format has been chosen and the path where to save the image will happen first and then the webBrowser will navigate to the specified URL.

There are two different sizing mechanisms. The first one is to take a snapshot of the whole page, which is the default option, and that can be done by ticking the Full page check box. The second one is to set the size manually which can be done by unchecking the Full page check box option and typing the required size.

The most important part is using the DrawToBitmap method which takes a Bitmap object and Rectangle object. However, most people ask why the output is an empty white image. The reason is that the page hasn't been loaded completely. So, I used DocumentCompleted property.

// wait till the loading finishes
webB.DocumentCompleted += 
	new WebBrowserDocumentCompletedEventHandler(WebBrowser_DocumentCompleted); 
while (webB.ReadyState != WebBrowserReadyState.Complete)
    if (webB.IsDisposed)

The WebBrowser_DocumentCompleted method will take the preferred size and set it to the size of the browser. Then, it will create the Bitmap object and the Rectangle object to pass it to the most important method DrawToBitmap.

// creating the Bitmap
Bitmap bitmap = new Bitmap(weidth, height);
Rectangle bitmapRect = new Rectangle(0, 0, bitmap.Width, bitmap.Height);
// the most important method which will save an image 
// of the web page with the a specific size
webB.DrawToBitmap(bitmap, bitmapRect); 
System.Drawing.Image origImage = bitmap; 

After that, a thumbnail of the output image will be created to be shown in the pictureBox in the main window.

//creating a thumbnail to show it in a picture box 
//in the main user interface and setting some property
System.Drawing.Image origThumbnail = new Bitmap(400, 400, origImage.PixelFormat);
Graphics GraphicT = Graphics.FromImage(origThumbnail);
GraphicT.CompositingQuality = CompositingQuality.HighQuality;
GraphicT.SmoothingMode = SmoothingMode.HighQuality;
GraphicT.InterpolationMode = InterpolationMode.HighQualityBicubic;
Rectangle RectangleT = new Rectangle(0, 0, 400, 400);
GraphicT.DrawImage(origImage, RectangleT); 
// setting the image to be shown in the picture box in the main user interface
pictureBox1.Image = null;
pictureBox1.SizeMode = PictureBoxSizeMode.CenterImage;
pictureBox1.BackgroundImage = origThumbnail; 

The last part is to save the output image to the specified path taken from saveFileDialog.

Point of Interest

I have faced some problems of getting image of some pages like Google. I tried to increase the size and decrease it, but with no result. Finally, I read that the reason for this is because of using JavaScript and some script that can't be viewed by WebBrowser control.



This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Abdullah Altokhais
Saudi Arabia Saudi Arabia
No Biography provided

Comments and Discussions

GeneralMy vote of 5 Pin
Carsten V2.031-Dec-12 23:23
MemberCarsten V2.031-Dec-12 23:23 
GeneralRe: My vote of 5 Pin
Abdullah Altokhais31-Dec-12 23:29
MemberAbdullah Altokhais31-Dec-12 23:29 
QuestionCan We do this with Pin
Barış Akpunar28-Dec-12 9:54
MemberBarış Akpunar28-Dec-12 9:54 
AnswerRe: Can We do this with Pin
Abdullah Altokhais28-Dec-12 9:56
MemberAbdullah Altokhais28-Dec-12 9:56 

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.