共用方式為


功能表控制項概觀

更新:2007 年 11 月

ASP.NET Menu 控制項可以讓您同時開發 ASP.NET Web 網頁的靜態和動態顯示功能表。

這個主題包含:

  • Background

  • 程式碼範例

  • 類別參考

背景

Menu 控制項有兩種顯示模式:靜態和動態。靜態顯示表示 Menu 控制項一直都會完全展開。您可以看到整個結構,並且使用者可以按一下任何部分。在動態顯示的功能表中,只有您指定的部分是靜態的,當使用者將滑鼠指標停留在父節點時才會顯示子功能表項目。

您可以在控制項中直接設定 Menu 控制項的內容,或是將控制項繫結至資料來源以指定內容。您可以在不需要撰寫任何程式碼的情況下,控制 ASP.NET Menu 控制項的外觀、方向和內容。除了控制項公開的視覺屬性以外,控制項也支援 ASP.NET 控制項面板和佈景主題。如需面板和佈景主題的詳細資訊,請參閱 ASP.NET 佈景主題和面板概觀

靜態顯示行為

您可以使用 Menu 控制項的 StaticDisplayLevels 屬性控制靜態顯示行為。StaticDisplayLevels 屬性表示從根功能表以靜態方式顯示的層數。例如,如果 StaticDisplayLevels 設定為 3,您的功能表會展開以靜態方式顯示前三層。最小的靜態顯示層級為 1,如果值設定為 0 或負數,控制項會擲回例外狀況。

動態顯示行為

MaximumDynamicDisplayLevels 屬性指定在靜態顯示層級之後要顯示多少層的動態顯示功能表節點。例如,如果功能表的靜態層級是 3,而動態層級是 2,功能表的前三層會以靜態顯示,而之後的兩層會以動態顯示。

如果 MaximumDynamicDisplayLevels 設定為 0,就不會以動態方式顯示任何功能表節點。如果 MaximumDynamicDisplayLevels 設定為負數,就會擲回例外狀況。

定義功能表內容

您可以使用兩種方法定義 Menu 控制項的內容:加入個別 MenuItem 物件 (以宣告方式或程式設計方式),或資料繫結控制項至 XML 資料來源。

手動加入功能表項目

您可以在 Items 屬性中指定以便將個別功能表項目加入控制項。Items 屬性是 MenuItem 物件的集合。下列範例顯示使用三個項目的 Menu 控制項宣告式標記,每個項目有兩個子項目:

<asp:Menu ID="Menu1"  StaticDisplayLevels="3">
  <Items>
    <asp:MenuItem Text="File" Value="File">
      <asp:MenuItem Text="New" Value="New"></asp:MenuItem>
      <asp:MenuItem Text="Open" Value="Open"></asp:MenuItem>
    </asp:MenuItem>
    <asp:MenuItem Text="Edit" Value="Edit">
      <asp:MenuItem Text="Copy" Value="Copy"></asp:MenuItem>
      <asp:MenuItem Text="Paste" Value="Paste"></asp:MenuItem>
    </asp:MenuItem>
    <asp:MenuItem Text="View" Value="View">
      <asp:MenuItem Text="Normal" Value="Normal"></asp:MenuItem>
      <asp:MenuItem Text="Preview" Value="Preview"></asp:MenuItem>
    </asp:MenuItem>
  </Items>
</asp:Menu>

資料繫結至 XML 資料來源

繫結至 XML 檔案可以讓您透過編輯檔案,而不是使用設計工具來控制功能表的內容。這可以讓您在不需要重新造訪 Menu 控制項或編輯任何程式碼的情況下,更新網站的巡覽外觀。如果您的網站有變更內容,就可以使用 XML 檔案組織內容並且提供給 Menu 控制項,以確定網站使用者可以存取內容。

外觀和行為

您可以透過 Menu 控制項的屬性調整其行為。此外,您可以控制動態顯示的行為,包括一旦顯示功能表節點後維持顯示的時間量。例如,若要將 Menu 的方向從水平變更為垂直,可以將 Orientation 屬性設定如下:

[Visual Basic]

Menu.Orientation = Orientation.Vertical

[C#]

Menu.Orientation = Orientation.Vertical;

將屬性設定為 Orientation.Horizontal 會把方向變更回水平。

您可以設定 Menu 控制項的個別屬性,以指定大小、色彩、字型和其他外觀特性。此外,您可以將面板和佈景主題套用至 Menu 控制項。

樣式

每個功能表層級支援樣式屬性。如果並未設定動態樣式屬性,就會使用靜態樣式屬性。如果已設定動態樣式屬性,並且沒有設定靜態樣式屬性,就會使用靜態樣式屬性的預設呈現。Menu 控制項樣式階層架構如下所示:

  1. 控制項

  2. SubMenuStyles

  3. MenuItemStyles

  4. SelectedItemStyles

  5. HoverMenuItemStyles

這些樣式會使用下列邏輯合併動態和靜態功能表:

  • 每個個別樣式會套用至適當的動作或項目類型

  • 所有的樣式會使用最新的樣式覆寫,合併至在階層架構中位於它們之前的樣式

    注意事項:

    如果並未定義靜態樣式,就永遠不會合併靜態功能表而會套用動態樣式。

動態外觀執行時間

動態功能表的其中一項,是功能表動態顯示部分在消失前所花費的時間。您可以用毫秒為單位,將 DisappearAfter 屬性調整為如下所示來設定這個值:

[Visual Basic]

Menu.DisappearAfter = 1000

[C#]

Menu.DisappearAfter = 1000;

預設值為 500 毫秒。如果 DisappearAfter 的值設定為 0,在 Menu 控制項以外暫停會導致它立即消失。將值設定為 -1 表示暫停時間是無限的,只有在 Menu 控制項以外按一下,動態部分才會消失。

搭配 UpdatePanel 控制項使用功能表控制項

UpdatePanel 控制項用來更新選取的網頁區域,而非使用回傳來更新整個網頁。Menu 控制項可以使用於 UpdatePanel 控制項中,但限制必須使用階層式樣式表 (Cascading Style Sheet,CSS) 類別的參考來套用樣式。例如,不使用 property-subproperty 屬性 (Attribute) 來設定 DynamicHoverStyle 屬性 (Property ),而是使用 property-CssClass 屬性 (Attribute) 來設定樣式。同樣地當您使用 DynamicHoverStyle 範本來設定樣式時,請使用範本的 CssClass 屬性。

如需使用 UpdatePanel 控制項的詳細資訊,請參閱 UpdatePanel 控制項概觀網頁局部呈現概觀

程式碼範例

在功能表控制項上使用 CSS 和樣式

在功能表控制項上使用影像

逐步解說:在 Web 網頁上顯示功能表

逐步解說:以程式設計方式控制 ASP.NET 功能表

回到頁首

類別參考

下表列出 Menu 控制項的相關類別。

成員

描述

Menu

控制項的主要類別。

MenuEventArgs

提供資料給 Menu 控制項的 MenuItemClickMenuItemDataBound 事件。

MenuEventHandler

代表處理 Menu 控制項之 MenuItemClick 事件或 MenuItemDataBound 事件的方法。

MenuItem

代表顯示在 Menu 控制項中的功能表項目。

MenuItemBinding

定義 Menu 控制項中資料項目與其所繫結之功能表項目之間的關聯性。

MenuItemBindingCollection

表示 MenuItemBinding 物件的集合。

MenuItemCollection

代表 Menu 控制項中功能表項目的集合。

MenuItemStyle

代表 Menu 控制項中功能表項目的樣式。

MenuItemStyleCollection

代表 Menu 控制項中 MenuItemStyle 物件的集合。

回到頁首

請參閱

概念

ASP.NET 網站巡覽概觀

參考

Menu

其他資源

巡覽工具箱控制項