Ajax Control Toolkit 34个服务器端控件(7)

26. RoundedCorners

【功能】

控件圆角 纯粹是控制外观的了，什么时候审美疲劳了还要改。据说GUI风格也是N年一轮回，这让我想起来了一个27KB的QQ，命令行界面，真的是这样么？穿孔纸带据说是第一代GUI，不会有一天真的回到那个时代吧?
   【细节】

 (1)还有一个非常非常细节的地方：你必须要设置 CssClass="roundedPanel"要不然不起作用
                (2) Radius设置弧度，默认是5
                (3)只适用于容器 WebControl

       【示意代码】

代码示意：
              <ajaxToolkit:RoundedCornersExtender ID="rce" runat="server"     TargetControlID="Panel1"     Radius="6" />

27. Slider

【功能概述】

实现WinForm中的Slider控件效果，新浪论坛用来分页了，还有的用来调整“时间----------|----热度”，创意！
  【细节】

(1)   修改文本框的值也可以影响Slider的状态

【示意代码】

  代码示意：
              <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>                              
    <cc1:SliderExtender ID="SliderExtender2" runat="server"
                                BehaviorID="Slider2"
                                TargetControlID="Slider2"
                                BoundControlID="TextBox1"
                                Orientation="Horizontal" 
                                EnableHandleAnimation="true"
                                 Minimum="0"
                                Maximum="100"
                                />

28. Tabs NEW！！！

Tabs是我认为这一次新增控件中最实用的好东东， 在编码风格上与所有嵌套式的控件一样：
           <ajaxToolkit:TabContainer runat="server"
        OnClientActiveTabChanged="ClientFunction"
        Height="150px">
    <ajaxToolkit:TabPanel runat="server"
        HeaderText="Signature and Bio"
        <ContentTemplate>
            ...
        </ContentTemplate>
    />
</ajaxToolkit:TabContainer>
 Demo效果让我们很容易想到最近改版之后的网页主页和新浪主页 和Accordion比较一下各有千秋，是对经典WinForm的一种继承。

29 .TextBoxWatermark

【功能概述】

对文本框进行扩展，文本水印效果。

看了几十个WEB2.0的网站，没想到，见到最多的就是这种水印效果，看来很受欢迎。

【示意代码】

 代码示意：
    <asp:TextBox ID="TextBox1" CssClass="unwatermarked" Width="150" runat="server"></asp:TextBox>
            <cc1:TextBoxWatermarkExtender ID="TextBoxWatermarkExtender1" runat="server" TargetControlID="TextBox1" WatermarkText="请输入用户名" WatermarkCssClass="watermarked" />

 

30. ToggleButton

【功能概述】

就是把一个CheckBox的逻辑应用到一个按钮上，于是就有了双态按钮这么个玩意，有点意思啊

实际上示例页面并没有突出这个控件功能上的优势，对这个控件的操作引起页面上数据的更新，这才是CheckBox控件封装成Button的最终原因。
 【示意代码】

<asp:CheckBox ID="CheckBox1" Checked="true" Text="I like ASP.NET" runat="server"/>
    <cc1:ToggleButtonExtender ID="ToggleButtonExtender1" runat="server" TargetControlID="CheckBox1" ImageWidth="19"
     ImageHeight="19" UncheckedImageUrl="Image/down.gif" CheckedImageUrl="Image/up.gif" CheckedImageAlternateText="Check" 
     UncheckedImageAlternateText="UnCheck" />

31．UpdatePanelAnimation

【功能概述】

更新动画效果，个人认为应用于时间较短的场合，时间长了这个动画就有点不合适了，毕竟这是一个过渡效果；时间长还是UpdateProgress比较好。

   【细节】

代码结构简单但是要说的东西很多，回头再说写专题吧

代码示意：
  <ajaxToolkit:UpdatePanelAnimationExtender ID="ae"
  runat="server" TargetControlID="up">
     <Animations>
        <OnUpdating>   </OnUpdating>
        <OnUpdated>   </OnUpdated>
    </Animations>
</ajaxToolkit:UpdatePanelAnimationExtender>

32. ValidatorCallout

【功能概述】

Windows系统中最常见的气泡提示，比如你磁盘空间不足的时候。是对数据验证控件的扩展，比较实用，页面效果的确是比以前那个红色的星号醒目多了！

【细节】

Errormessage是一个开放的属性，我们可以进行丰富的扩展，大胆的想象，让显示出来的气泡更有意义

代码示意：
  <asp:RequiredFieldValidator runat="server" ID="PNReq" ControlToValidate="PhoneNumberTextBox" Display="None" ErrorMessage="<b>
  Required Field Missing</b><br />A phone number is required.<div style='margin-top:5px;padding:5px;border:1px solid #e9e9e9;background-color:white;'>
  <b>Other Options:</b><br /><a href='javascript:alert(&quot;No phone number available in profile.&quot;);'>Extract from Profile</a></div>" />
  
   <ajaxToolkit:ValidatorCalloutExtender runat="Server" ID="PNReqE" TargetControlID="PNReq" HighlightCssClass="highlight" Width="350px" />

还有一段：

代码示意：
 <asp:RequiredFieldValidator runat="server" ID="NReq" ControlToValidate="NameTextBox" Display="None" ErrorMessage="<b>Required Field Missing</b><br />A name is required." />
        <asp:RequiredFieldValidator runat="server" ID="PNReq" ControlToValidate="PhoneNumberTextBox" Display="None" ErrorMessage="<b>Required Field Missing</b><br />A phone number is required.<div style='margin-top:5px;padding:5px;border:1px solid #e9e9e9;background-color:white;'><b>Other Options:</b><br /><a href='javascript:alert(&quot;not implemented but you get the idea;)&quot;);'>Extract from Profile</a></div>" />
        <asp:RegularExpressionValidator runat="server" ID="PNRegEx" ControlToValidate="PhoneNumberTextBox" Display="None" ErrorMessage="<b>Invalid Field</b><br />Please enter a phone number in the format:<br />(###) ###-####" ValidationExpression="((/(/d{3}/) ?)|(/d{3}-))?/d{3}-/d{4}" />
        <cc1:ValidatorCalloutExtender runat="Server" ID="NReqE" TargetControlID="NReq" HighlightCssClass="highlight" />
        <cc1:ValidatorCalloutExtender runat="Server" ID="PNReqE" TargetControlID="PNReq" HighlightCssClass="highlight" Width="350px" />
        <cc1:ValidatorCalloutExtender runat="Server" ID="PNReqEx" TargetControlID="PNRegEx" HighlightCssClass="highlight" />