Image控件

Image控件又称图像控件,主要用来显示用户的图片或图像信息。

1.属性

Image控件的常用属性及说明如表1所示。

表1 Image控件常用属性及说明

属    性

说    明

ID

控件ID

ImageAlign

获取或设置Image控件相对于网页上其他元素的对齐方式

ImageUrl

获取或设置在Image控件中显示的图像的位置

Width

控件的宽度

Visible

控件是否可见

CssClass

控件呈现的样式

BackColor

控件的背景颜色

Enabled

控件是否可用

Image控件的大部分属性和Label控件类似,在此主要讲解一下其ImageUrl属性设置。

ImageUrl属性用来获取Image控件中要显示图像的地址,在设置该属性时,单击ImageUrl属性文本框后面的image控件 java Image控件名词解释_image控件 java图标按钮,弹出一个如图1所示的“选择图像”对话框,用户可以选择要显示的图像。 

 

image控件 java Image控件名词解释_ASP控件_02

图1  “选择图像”对话框

2.方法

Image控件常用方法同Label控件类似,具体请参见Label控件常用方法。这里主要介绍一下该控件的ResolveUrl方法,ResolveUrl方法主要用来将URL转换为在请求客户端可用的URL。

例如,要使用ResolveUrl方法设置一个Image控件的链接图像路径,可以编写如下代码。

      Image1.ImageUrl = ResolveUrl(~/image/Image1.gif);

3.事件

Image控件常用事件同Label控件类似,具体请参见Label控件常用事件。

4.示例

示例:

Image控件示例

下面示例主要通过设置Image控件的ImageUrl属性在该控件上显示链接图片。新建一个网站,默认主页为Default.aspx,在Default.aspx页面上添加一个Image控件,其属性设置如表2所示。

表2 Image控件属性设置

属 性 名 称

属  性  值

ID

Image1

ImageUrl

~/image/Image1.gif(链接图片)

ImageAlign

Middle(居中对齐)

执行程序,示例运行结果如图2所示。

image控件 java Image控件名词解释_ASP控件_03

图2  Image控件示例

程序完整代码如下:

★★★★★Default.aspx.cs代码文件★★★★★

1 using System;
 2 using System.Data;
 3 using System.Configuration;
 4 using System.Web;
 5 using System.Web.Security;
 6 using System.Web.UI;
 7 using System.Web.UI.WebControls;
 8 using System.Web.UI.WebControls.WebParts;
 9 using System.Web.UI.HtmlControls;
10 
11 public partial class _Default : System.Web.UI.Page 
12 {
13     protected void Page_Load(object sender, EventArgs e)
14     {
15 
16     }
17 }

★★★★★Default.aspx设计文件★★★★★

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Image控件示例</title>
</head>
<body>

    <form id="form1" runat="server">
    <div>
        <asp:Image ID="Image1" runat="server" Height="177px" ImageAlign="Middle" 
             ImageUrl="~/image/Image1.gif" Width="121px" />
    </div>
    </form>

</body>
</html>