風影ASP.NET基礎教學 2 web服務器控件


在asp.net中,web標准服務器控件是ASPNET的核心部件,也是Web Form編程模型的最基本元素。相對於Html服務器控件而言,它具有更多的內置功能和可編程性。它不僅包括簡單的按鈕和文本框這樣的簡單控件,還有一些特殊用途的控件如日期、菜單和樹形控件

 

1.與Html服務器控件的區別

html服務器控件不可以自動識別服務器達到自動變化的效果

編程擴展web服務器控件很容易可以擴展新的功能

Html服務器控件事件大多都是在客戶端,而服務器控件是在服務端

 

2.WebControl基類

在ASP.NET中,所有的web服務器控件都定義在System.Web.UI.Controls命名空間下,都派生自WebControl。那么就有了一些公共屬性

2.1常用屬性

AccessKey 控件的鍵盤快捷鍵,此屬性指定用戶在按住Alt鍵的同時按下單個字母或者數字。例如如果希望用戶按下Alt+K以訪問控件,則指定“K”
Attributes 控件上的屬性集合。可以直接使用Html屬性,注意只能在代碼中使用
BackColor 控件的背景顏色可以用red或者#ff0000來賦值
BorderColor 邊框顏色,設置與BackColor相同
BorderStyle 邊框樣式,枚舉值  如Solid、Double等
BorderWidth 控件邊框寬度
CssClass 分配給控件的級聯樣式表
Style CSS樣式屬性集合
Enabled 是否啟用
EnableTheming 是否啟用控件皮膚(后面講解)
Font 設置字體
ForeColor 字體顏色
Height 控件高度
Width 控件寬度
ToolTip 控件設置 title 屬性 鼠標提示信息
TabIndex Tab鍵切換順序

 

3. 單位

Web服務器控件的寬度和高度和類似的屬性都是以單位進行設置的。單位是以對象(Unit結構)的形式出現的。Unit對象可以接收像素px和百分比%等這樣的度量單位

aspnet頁面標簽代碼

<asp:Button ID="Button1" runat="server" Width="100%" Height="30px" Text="Button" />

后置代碼

 
            Button1.Height = new Unit("20px");
            Button1.Width = new Unit("100%");
            Button1.Height = Unit.Pixel(20);
            Button1.Width = Unit.Percentage(80);
            Button1.Height = new Unit(20, UnitType.Pixel);
            Button1.Width = new Unit(80, UnitType.Percentage);

4.顏色

            int alpha = 255;
            int red = 255;
            int green = 255;
            int blue = 0;
            Button1.ForeColor = Color.FromArgb(red, green, blue);
            Button1.ForeColor = Color.FromArgb(alpha, red, green, blue);
            Button1.ForeColor = Color.FromName("Red");
            Button1.ForeColor = Color.Red;
            Button1.ForeColor = ColorTranslator.FromHtml("Red");

5. 字體

Font屬性完整的引用了FontInfo對象,屬性如下

Name 字體名稱
Names 字體名稱的字符串數組
Size 字體大小(絕對或者相對),作為FontUnit對象
Bold、Italic、Strikeout、Underline和Overline 它是一個布爾屬性,要么應用給定的Style特性

 

注意:Names屬性要和Name屬性同步,設置任何一個都會影響到另一個,只需要設置Name屬性為Names屬性集合中的一個即可

            Button1.Font.Name = "微軟雅黑";
            Button1.Font.Bold = true;
            Button1.Font.Names = new string[] { "微軟雅黑,宋體,黑體" };
            Button1.Font.Size = FontUnit.XSmall;
            Button1.Font.Size = FontUnit.Point(16);
            Button1.Font.Italic = true;
            Button1.Font.Underline = true;

6.默認按鈕

    <form id="form1" runat="server" defaultbutton="Button1">
    <div>
        <asp:Button ID="Button1" runat="server" Width="100%" Height="30px" Text="Button" />
    </div>
    </form>

 

當用戶按下Enter的時候會觸發defaultbutton的click事件。這個屬性只能填入 Button,ImageButton和LinkButton

7.數據顯示控件

7.1Label

我們在Winform已經學過Label了,顧名思義,就是顯示文本到html頁面里,它會生成一個Span的網頁標記。最常用的屬性是Text

7.2Literal

這個控件也是在Web頁面上輸出一個靜態文本但是這個控件不會添加任何其他的多余標記,只是普通的文本輸出

image

顯示源代碼結果:

image

 

 

 

8.數據輸入控件

8.1 TextBox

AutoCompleteType Bool類型 是否讓瀏覽器記住之前在當前文本框錄入過的數據 默認None
AutoPostBack 是否當內容改變時自動回傳到服務器(和TextChange事件聯合使用) 默認false
CausesValidation 當回傳事件PostBack發生時是否驗證控件  默認false
Cols 在多行文本模式時使用 寬度
Rows 在多行文本模式時使用 高度
MaxLength 最多錄入的字符數量
ReadOnly 只讀
Text 地球人都知道的
TextMode 文本模式 默認是單行文本
ValidationGroup 當PostBack發生時,用來驗證數據的驗證組
Wrap 是否自動換行  默認true
OnTextChanged 當文本發生改變時  (失去焦點並改變數據時)

 

8.2CheckBox控件

這個大家也比較熟悉了,依然是Checked屬性來判斷復選框是否被選中了。但是有所不同的是,這個CheckBox有一個Text屬性,可以直接把復選框的內容也一塊顯示出來

 <asp:CheckBox ID="CheckBox1" runat="server"  Text="我是復選框"/>

結果:

image

生成的html代碼:

image

我們會發現,微軟人性化的幫我們把內容和Check控件綁定起來了。

8.3CheckBoxList

相比之前的CheckBox而言,CheckBoxList可以創建一組復選框。

        <asp:CheckBoxList ID="CheckBoxList1" runat="server">
            <asp:ListItem Text="aaa" Value="a" />
            <asp:ListItem Text="bbb" Value="b" />
            <asp:ListItem Text="ccc" Value="c" Selected="True" />
        </asp:CheckBoxList>

 

結果:

image

生成的源代碼

 <table id="CheckBoxList1">
 
    <tr>
 
        <td><input id="CheckBoxList1_0" type="checkbox" name="CheckBoxList1$0" value="a" /><label for="CheckBoxList1_0">aaa</label></td>
 
    </tr><tr>
 
        <td><input id="CheckBoxList1_1" type="checkbox" name="CheckBoxList1$1" value="b" /><label for="CheckBoxList1_1">bbb</label></td>
 
    </tr><tr>
 
        <td><input id="CheckBoxList1_2" type="checkbox" name="CheckBoxList1$2" checked="checked" value="c" /><label for="CheckBoxList1_2">ccc</label></td>
 
    </tr>
 
</table>

我們驚奇的發現微軟我們生成了一個table 萬惡的table啊能不能有其他方式呢。當然有了。

RepeatLayout="Flow"我們可以根據自己的意願來組織html的生成效果。

8.3RadioButton 和RadioButtonList

 

同上

 

9.數據提交控件

9.1Button

它也是我們較常見的控件之一。

當然它和Winform里的Button有所不同,它可以作為命令按鈕。Commed,我們可以用同一個處理方法來處理不同按鈕的事件,達到更高的重用性,如何區分這些按鈕呢,當然Sender是一個選擇,另一個就是CommedName 和CommedArgument這兩個屬性,我們使用OnCommed事件就可以輕松獲取這兩個屬性

asp.net代碼

image

后置代碼

image

生成的效果

image

這個OnCommed事件是所有按鈕型控件都可以使用的。如LinkButton和ImageButton

  

 

10 圖像顯示控件

Image 和ImageMap這里掠過講解了。

先寫到這里吧,有問題請留言。第一篇寫到講義里了。后面我會整理后放出。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM