Adding Web Controls to a Web Form in GDI+

This article has been excerpted from book "Graphics Programming with GDI+".
 
Visual Studio .NET provides a Web Forms control toolbox that's similar to the Windows control toolbox. We can open the toolbox by selecting the View | Toolbox main menu item. The Web Forms category of the toolbox contains the server-side controls (controls available on the server, for which all processing is done on the server). When a browser requests a control, ASP.NET converts the request into HTML and sends it to the browser. The HTML category contains HTML controls. HTML controls are simple HTML tags which all processing done on the client side. As a result, HTML controls are often faster than server-side controls.
 
Let's switch the page back to the Design and GridLayout mode and add a button, a text box and an Image control to the page by dragging these controls from the Web Forms toolbox to WebForm1.aspx. We will use the View Image button to view an image. The ImageUrl property of the View Image button represents the image that this control will view.
 
The page should now look like Figure 12.7 (after your position your controls). As the figure shows, we change the button's text to "View Image" by right-clicking on the Properties menu item, which launches the Properties window.
 
Writing Code on the Button Click Event Handler
 
The last step of this tutorial is to add an event handler for the button click event, which will set the ImageUrl property of the Image button. This is similar to adding a control event in a Windows Forms application. You can double-click on the button to add a button click event handler.
 

 
Figure 12.7: The WebForm1.aspx design mode after the addition of Web Forms controls



Figure 12.8: Viewing an image in a Image control
 
Double-clicking on the button adds a Button1_click method to the WebForm1.aspx.cs class which hosts code for the page controls and events. Now we write a line of code that sets the ImageUrl property of the Image control as the text of the TextBox control. The button click event handler code is given in Listing 12.1.
 
Listing 12.1: The button click event handler
 
private void Button_Click (object, sender, System.EventArgs e)
{
Image1.ImageUrl = TextBox1.Text;
}

 Now compile and run the project. In the text box we type http://www.c-sharpcorner.com/cslogo101.gif  (or any valid image URL) as the URL name and click the View Image button. The output of the program looks like Figure 12.8.
 
Now that we have seen how to create a simple Web application using Visual Studio .NET and ASP.NET, in the next section we will move on to GDI+ and shows how to use GDI+ to write graphics Web application.

Conclusion

Hope the article would have helped you how to  Add Web Controls to a Web Form in GDI+. Read other articles on GDI+ on the website.