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);

->运行网页