ASP.NET 2.0新控件介绍
1. Adrotator
l Adrotator广告控件的功能
ü 轮换显示广告图片
ü 显示广告文字
ü 有权重的显示广告
ü 广告显示内容控制
Ø 通过设定XML文件作为广告数据源,轮训显示广告
Ø XML文件格式如下
<Advertisements>;表示其中的内容是一个标准的广告链接
<ad>;表示为广告发布信息
<ImageUrl>images/banner1.gif</ImageUrl >
<NavigateUrl>http://www.microsoft.com</ NavigateUrl >
<AlternateText>Microsoft.com</ AlternateText >;鼠标点击的浮动信息
<Keyword>Computers</ Keyword >
<Impressions>80</ Impressions ></Ad>;表示这个广告出现的几率和高
</Advertisements >
Ø XML文件说明
属性 |
描述 |
ImageUrl |
广告链接的图片属性 |
NavigateUrl |
点击广告后的链接地址 |
AlternateText |
鼠标放置在图片之上显示的文字 |
Keyword |
指定一个关键字 |
Impressions |
图片显示的权重 |
演示一个显示三大门户的广告控件
2. 新建网站->新建网页文件ad->切换到设计模式->添加一个Adrotator控件->添加三幅图片到方案->添加一个XML文件并编写文件内容如下:
<Advertisements>
<Ad>
<ImageUrl>~/index_logo.gif</ImageUrl>
<NavigateUrl>http://www.sohu.com</NavigateUrl>
<AlternateText>sohu</AlternateText>
<Keyword>Computers</Keyword>
<Impressions>80</Impressions>
</Ad>
<Ad>
<ImageUrl>~/sina_logo2.gif</ImageUrl>
<NavigateUrl>http://www.sina.com</NavigateUrl>
<AlternateText>sina</AlternateText>
<Keyword>Computers</Keyword>
<Impressions>80</Impressions>
</Ad>
<Ad>
<ImageUrl>~/neteaselogo.gif</ImageUrl>
<NavigateUrl>http://www.163.com</NavigateUrl>
<AlternateText>163</AlternateText>
<Keyword>Computers</Keyword>
<Impressions>80</Impressions>
</Ad>
</Advertisements>
->指定广告描述文件(两种方式:一、源模式下添加代码:<asp:AdRotator ID="AdRotator1" runat="server" AdvertisementFile ="~/XMLFile.xml" />二、设计模式点击选择数据源->新建数据源->XML文件->选择数据文件(这里直接使用数据绑定控件来完成相同任务))->运行->刷新网页查看效果。三个广告出现几率一样。
3. Calendar
l 日历控件负责显示一个月的日历,并接受用户的选择日期操作
l 选择日期的模式
模式 |
描述 |
Day |
用户只能选择一天 |
DayWeek |
用户可以选择一天或者一周 |
DayWeekMonth |
用户可以选择一天或者一周或者一个月 |
None |
用户不能选择 |
l 日历选择模式演示
新建一个Web窗体->添加一个Calendar控件和一个DroDownList控件->在DroDownList控件中添加四种显示模式->在DroDownList控件的SelectedIndexChanged事件中添加如下代码
switch (this.DropDownList1.SelectedValue)
{
case "DayWeek":
this.Calendar1.SelectionMode = CalendarSelectionMode.DayWeek;
break;
case "Day":
this.Calendar1.SelectionMode = CalendarSelectionMode.Day;
break;
case "DayWeekMonth":
this.Calendar1.SelectionMode = CalendarSelectionMode.DayWeekMonth;
break;
case "None":
this.Calendar1.SelectionMode = CalendarSelectionMode.None;
break;
default:
break;
}
->运行网页->改变DroDownList选项查看效果。
通过样式套用还可以实现不同样式的显示
l 定义自己的节假日
ü 日历控件可以定义自己的节假日
ü 通过对DayRender时间进行编程,可以在显示日期的时候方便的显示自定义的节日
ü 示例
ü 接着本控件示例中在代码文件中声明一个数组(string[,] holidays = new string[12,31];)->在Page——Load中定义自定义节日(holidays[5, 11] = "七夕情人节";)->在Calendar的Calendar1_DayRender事件中进行加入如下代码
CalendarDay d;
TableCell c;
d = e.Day;
c = e.Cell;
if (d.IsOtherMonth)
c.Controls.Clear();
else
{
try
{
string hol = holidays[d.Date.Month-1, d.Date.Day-1];
if (hol != "")
{
c.Controls.Add(new LiteralControl("<br><font color = red>" + hol + "</font>"));
}
}
catch (Exception exc)
{
Response.Write(exc.ToString());
}
}
运行网页->改变月份查看效果。
4. fileupload
上传文件控件
l ASP.NET 2.0 提供了一个非常方便的文件上传控件fileupload,可以快速的把文件上传到服务器端,而无需编写更多的代码。
l 文件上传控件示例
5. ImageButton
图片按钮控件
l 图片按钮控件示例:获取用户点击位置
l 图片按钮控件可以在按钮上显示一幅图片,并代替按钮控件的基本功能,不仅如此,图片按钮控件还可以方便的获取图片点击的位置。
l 图片按钮控件示例
新建一个Web 窗体->添加图片到方案中->添加一个ImageButton,三个Label控件->ImageButton中设置加入的图片->label1Text为“您点击的坐标是”->在ImageButton的ImageButton1_Click事件中添加如下代码:
int x = e.X;
int y = e.Y;
Label2.Text = "X: " + x.ToString() + " Y: " + y.ToString();
if (y >= 120)
Label3.Text = "你点击的是新浪!";
else
Label3.Text = "你点击的是搜狐";
运行网页->点击图片查看效果。
6. Imagemap
图片地图控件
l 图片地图控件可以在一副图片中设置很多热区,当用户点击不同热区的时候会有不同的反应,既可以让用户通过点击热区跳转到不同的URl也可以让用户通过点击热区运行不同的服务代码。
l 图片地图控件示例
l 新建一个Web 窗体->添加图片到方案中->添加一个Imagemap,一个Label控件->ImageButton中设置加入的图片->ImageButton的HotSpots属性中添加两个热区,在热区中设置模式为postback,对应的设置AlternateText为搜狐和新浪,设置PostBackValue的值->在Imagemap的ImageMap1_Click事件中写下如下代码:
switch (e.PostBackValue)
{
case "souhu":
Label1.Text = "感谢您为搜狐投上一票!";
break;
case "xinlang":
Label1.Text = "感谢您为新浪投上一票!";
break;
default:
break;
}
运行网页->点击图片查看效果。
注:三种作用点类型的方式
<asp:ImageMap ID="ImageMap1" ImageUrl="~/Images/MapTest.PNG" runat="server" HotSpotMode="PostBack">
<asp:RectangleHotSpot Bottom="100" Left="100" Right="200"
PostBackValue="Northeast" />
<asp:RectangleHotSpot Bottom="200" Right="100" Top="100"
PostBackValue="Southwest" />
<asp:RectangleHotSpot Bottom="200" Left="100" Right="200"
Top="100" />
<asp:CircleHotSpot Radius="50" X="100" Y="100"
HotSpotMode="Navigate"
NavigateUrl="http://www.contoso.com/" />
<asp:PolygonHotSpot Coordinates="0,0;100,100;200,0"
PostBackValue="Triangle1" />
</asp:ImageMap>
7. MultiView
MultiView控件
l MultiView控件是为了显示View控件的而定制的工具,View控件是一个Web控件的容器。我们可以在一个网页上设置几个view控件,然后通过MultiView控件来选择把什么样的控件呈现给用户,请看下面这个例子。
l MultiView示例
新建一个Web 窗体->添加一个MultiView控件,在MultiView控件中添加三个View控件,三个View控件中分别添加今天所谈及的Adrotator、Calendar、Imagemap三个控件。三个控件的设置分别参考上文。添加一个DroDownlist控件。DroDownlist控件中添加三个项:View1,View2,View3.Value分别为0、1、2->在DroDownlist控件的DropDownList1_Selected IndexChanged事件中添加如下代码:
this.MultiView1.ActiveViewIndex =Convert.ToUInt16( this.DropDownList1.SelectedValue);
->运行网页
总结
l Adrotator
l Calendar
l ImageButton
l Imagemap
l MultiView