【譯】Silverlight for Windows Phone Toolkit In Depth(四)

開篇： Silverlight for Windows Phone Toolkit In Depth(一)

上一篇：Silverlight for Windows Phone Toolkit In Depth(三)

 

說明：由於原書的第二版已經發布，所以後續章節均是基於原書第二版進行翻譯的，前期翻譯的與第二版區別不大，已經對部分進行了更正且用紅色標註了修改的部分。

 

ContextMenu

 

概述

ContextMenu 是當使用者點擊並且按住某一項不放彈出的動態控制項。它常被用在像應用程式列表這樣的場合，正如你點擊並且長按某一應用程式後看到的“固定到開始畫面”、“卸載”等選項一樣。

 

準備

開始使用ContextMenu必須先在你的項目中添加引用Microsoft.Phone.Controls.Toolkit.dll

Note:在安裝完Toolkit後你可以在下面路徑找到Microsoft.Phone.Controls.Toolkit.dll

For 32-bit systems:

C:\Program Files\Microsoft SDKs\Windows

Phone\v7.1\Toolkit\Oct11\Bin\Microsoft.Phone.Controls.Toolkit.dll 

For 64-bit systems:

C:\Program Files (x86)\Microsoft SDKs\Windows

Phone\v7.1\Toolkit\Oct11\Bin\Microsoft.Phone.Controls.Toolkit.dll  

或者如果你下載了“Silverlight for Windows Phone Toolkit Source & Sample - Nov 2011.zip”,可以直接從“...\Source and Sample\Bin\”目錄下找到

你可以在XAML或C#/VB中建立ContextMenu執行個體

• 在XAML中定義ContextMenu：你需要添加如下命名空間

注意:確保在你的頁面聲明中包含“toolkit”命名空間！你可以通過Visual Studio Toolbox, Expression Blend Designer或者手動添加。

• 在C#/VB中建立ContextMenu控制項執行個體

 

主要屬性

 

IsOpen

IsOpen  bool類型屬性，擷取或設定表明ContextMenu是否可見的值

 

IsFadeEnabled

IsFadeEnabled  bool類型屬性，它用來擷取或設定當ContextMenu開啟時，背景是否漸入。IsZoomEnabled必須設定為true時，此項才會生效。

樣本：

 

IsZoomEnabled

IsZoomEnabled bool類型屬性，它用來擷取或設定當ContextMenu開啟時背景是否縮小。

樣本：

 

ItemContainerStyle

ItemContainerStyle Style類型屬性，它用來擷取或設定每一項的容器元素樣式。

樣本：

 

RegionOfInterest

RegionOfInterest Rect?類型的屬性，它用來擷取或設定使用根視圖座標系的感興趣地區，ContextMenu會努力地將自己定位在感興趣地區之外。如果為空白，則由所屬的繫結控制項決定感興趣地區

 

VerticalOffset

VerticalOffset double類型屬性，它用來擷取或設定目標原與彈出層的垂直距離

樣本：

 

主要事件Closed

在ContextMenu執行個體關閉後觸發

樣本：

Opened

在ContextMenu執行個體開啟後觸發

樣本：

 

MenuItem

MenuItem是ContextMenu中可選擇的項

NOTE:ContextMenu包含MenuItem對象的集合,在ContextMenu中選擇一個MenuItem,將設定IsSelected屬性為true,通過綁定資料來源到ContextMenu的ItemsSource屬性實現將MenuItem綁定資料.

 

MenuItem主要屬性

 

Command 

Command  ICommand類型屬性，擷取或設定與功能表項目關聯的命令。

CommandParameter

CommandParameter Object類型屬性，擷取或設定傳遞到MenuItem命令的參數。

Header

Header Object類型屬性，擷取或設定標識控制項的項。預設值為空白。注意，該屬性在你未使用資料繫結而是使用功能表項目集合填充ContextMenu時使用。

樣本：

HeaderTemplate

HeaderTemplate DataTemplate類型屬性，擷取或設定控制項頭部內容的資料範本

ItemContainerStyle

ItemContainerStyle Style類型屬性，它用來擷取或設定每一項的容器元素樣式。

Owner

Owner DependencyObject類型屬性，擷取或設定ContextMenu所屬對象

 

MenuItem 主要事件

 

Click

當點擊某一項MenuItem時觸發

樣本

 

使用MenuItems填充ContextMenu

下面這個樣本將示範最簡單的方法，使用MenuItems將資料填充到ContextMenu

當使用者點選並按住"OpenContextMenu"按鈕，將有三個選項彈出。在你選擇某一項後，關於選中項資訊的MessageBox彈出。

結果如下：

 

ContextMenu資料繫結

下面的樣本將示範通過資料繫結的方式為ContextMenu填充資料。我們需要 一個ItemContainerStyle，為了改變功能表項目的背景顏色。

• 定義資料來源

我們建立一個string類型的簡單集合

• ContextMenu資料繫結

我們將添加一個Button控制項，包含資料繫結的ContextMenu

第一步：在Button控制項中定義ContextMenu執行個體，然後添加如下ItemContainerStyle

第二步：通過ItemsSource屬性填充樣本資料到ContextMenu

運行結果如下：

 

在ListBox ItemTemplate之中使用 ContextMenu（DataTemplate）

下面的樣本將示範如何在ListBox ItemTemplate添加ContextMenu（當有資料需要綁定ListBox時）

• 定義資料來源

下面是建立資料來源步驟：

第一步：定義業務/資料類：

首先需要定義資料類，我們定義了包含如下屬性的“SampleData”類

第二步：建立一個新的Images檔案夾，並為之添加需要的圖片（圖片的build action設定為Content）

第三步：建立類型為 “SampleData”的集合

• ListBox控制項資料繫結

第一步：定義一個ListBox，並且在它的ItemTemplate中放置ContextMenu。ContextMenu是由兩個MenuItem（ “Click”響應事件為“MenuItem_Click”）組成。

第二步：通過ItemsSource屬性為ListBox填充資料

第三步：在後台代碼中，添加 “MenuItem_Click”處理函數

通過下面ContextMenu的Click處理方法，你可以突出的顯示ListBox的選中項，也可以擷取被點擊項的引用

第四步：編譯運行項目

運行結果如下：

 

聲明：本人英語水平有限，翻譯有不當的地方還望指正，所有翻譯均是理解性翻譯，與原文不一定相符，出現錯誤翻譯不當，以原文為準，英文好的建議直接閱讀英文原版(也不是太難)，著作權歸原作者所有。轉載此文請註明文章出處和作者。

英文原版（第二版）：http://www.windowsphonegeek.com/WPToolkitBook2nd