Image control in asp.net csharp-: Image control is used to display image into your web page. This is the server side control.In the asp.net csharp language we can use three type image control.
- Image Control-: In the image control we can insert image here.
- Image Button-:This control is used for inserting a image here. It’s behavior as like a button control.
- Image Map-:This control in ASP.NET 2.0 and onward versions can be used to create an image that contains defined hot spot regions. When a user clicks a hot spot region, the control can either generate a post back to the server or navigate to a specified URL.
How to add Image Control in asp.net csharp-:This control is use to insert image in our web pages.For adding image control in our web page.First click the tool box menu and select image control and double click or drag and drop. We can add another image control like this way. We can add this in source code using this syntax
For simple image control-:
<asp:Image ID="Image1" runat="server"/>
For adding Image Button -:
<asp:ImageButton ID="ImageButton1" runat="server"/>
For adding Image map control in web page
<asp:ImageMap ID="ImageMap1" runat="server"></asp:ImageMap>
Property of image control -: There are some property are same for all these control.
Image control property -: All the property are same as like label control property ID, back color,Border,border style etc. Here we we define another property as like
ImageUrl-: This property is used to assign a value to image control. First select the imageurl property and select the image here. Image will insert in the web page.
Width-: By selecting this property we can set the width of image.
Height -: By selecting this property we can set the image height.
Image Align -:Choosing this property we can set the image where we want to insert in the web page. When we click this property we get the menu here we select the image align menu as like left, right,center etc.
Image Button property -: Like the image control Its property are same.This is a button where we can insert image.
PostBackUrl-: When we click this property we get a menu here a list will open all the page available in our project.We can select which we want to open when we click the image button.
Image Map control-: This control have capability to navigate from one image link to another image or any other link.This control is use to create an image that contain defined hot-spot regions. When a user click a hot spot region the control can either generate a post back to the server or navigate to a specified URL.
There are three kinds of hot spot regions defined in ImageMap control.
- RectangleHotSpot
- CircleHotSpot
- PolygonHotSpot
Image Map property -:all the image property are same to image control. There are some different property has been given here.
HotspotMode-: When navigate,the user is navigate to a different URL. In case of PostBack the page is posted back to the server.
onclick-: attach a server side event that fires after clicking on image when HotSpotMode is postback.
PostBackValue-: You can access it in the server side click event through
ImageMap Implementation -: we can add imagemap control in our source code as like
<asp:ImageMap ID="ImageMap1" runat="server" Height="167px" HotSpotMode="Navigate" ImageUrl="~/image/rajasthan 2.png" Width="186px" OnClick="ImageMap1_Click">
<asp:CircleHotSpot NavigateUrl="~/Default.aspx" Radius="10" Target="_blank" X="70" Y="104" />
< asp:CircleHotSpot HotSpotMode="PostBack" PostBackValue="hello" Radius="10" X="147" Y="104" />
</asp:ImageMap>In the image Map button control we do this coding .
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class imagecontrol : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void ImageMap1_Click(object sender, ImageMapEventArgs e)
{
Response.Write("The postback value is :" + e.PostBackValue);
}
}When we click the image it show hello .