Общие сведения о контекстном меню

Статья
08/11/2011

Элемент управления Popup предоставляет способ отображения содержимого в отдельном окне, расположенном поверх текущего окна приложения относительно обозначенного элемента или экранных координат. В этом разделе рассматриваются элементы управления Popup и содержатся сведения об их использовании.

В этом разделе содержатся следующие подразделы.

Что такое контекстное меню?
Создание контекстного меню
Элементы управления, реализующие контекстное меню
Поведение и вид контекстного меню
Определение положения контекстного меню
Контекстное меню и визуальное дерево
Связанные разделы

Что такое контекстное меню?

Элемент управления Popup отображает содержимое в отдельном окне относительно элемента или точки на экране. Когда Popup является видимым, свойство IsOpen устанавливается в значение true.

Примечание
Popup не открывается автоматически при наведении указателя мыши на родительский объект.Если требуется, чтобы Popup открывалось автоматически, то следует использовать класс ToolTip или ToolTipService.Дополнительные сведения см. в разделе Общие сведения о всплывающих подсказках.

Popup не открывается автоматически при наведении указателя мыши на родительский объект.Если требуется, чтобы Popup открывалось автоматически, то следует использовать класс ToolTip или ToolTipService.Дополнительные сведения см. в разделе Общие сведения о всплывающих подсказках.

Создание контекстного меню

В следующем примере показано определение элемента управления Popup, являющегося дочерним элементом элемента управления Button. Поскольку Button может иметь только один дочерний элемент, в этом примере текст для элементов управления Button и Popup размещается в StackPanel. Содержимое Popup появляется в элементе управления TextBlock, отображающем текст в отдельном окне, расположенном поверх окна приложения около связанного элемента управления Button.

<Button HorizontalAlignment="Left" Click="DisplayPopup" 
        Width="150" Margin="20,10,0,0">
  <StackPanel>
    <TextBlock>Display Your Popup Text</TextBlock>
    <Popup Name="myPopup">
      <TextBlock Name="myPopupText" 
                 Background="LightBlue" 
                 Foreground="Blue">
        Popup Text
      </TextBlock>
    </Popup>
  </StackPanel>
</Button>

<Button Name="ButtonForPopup" HorizontalAlignment="Left" 
        Click="CreatePopup"  
        Width="150" Margin="20,10,0,0">
  <StackPanel Name="aStackPanel">
    <TextBlock>Create Popup</TextBlock>
  </StackPanel>
</Button>

Элементы управления, реализующие контекстное меню

Можно встраивать элементы управления Popup в другие элементы управления. Следующие элементы управления реализуют элемент управления Popup для определенных целей:

ToolTip. Если необходимо создать подсказку для элемента, то следует использовать классы ToolTip и ToolTipService. Дополнительные сведения см. в разделе Общие сведения о всплывающих подсказках.
ContextMenu. Если требуется создать контекстное меню для элемента, то следует использовать элемент управления ContextMenu. Дополнительные сведения см. в разделе Общие сведения о ContextMenu.
ComboBox. Если требуется создать элемент управления, предназначенный для выбора значения и имеющий раскрывающийся список, который можно отображать и скрывать, то следует использовать элемент управления ComboBox.
Expander. Если требуется создать элемент управления, отображающий заголовок со сворачиваемой областью отображения содержимого, то следует использовать элемент управления Expander. Дополнительные сведения см. в разделе Общие сведения об элементе управления Expander.

Поведение и вид контекстного меню

Элемент управления Popup предоставляет функциональные возможности, которые позволяют настраивать его внешний вид и поведение. Например, можно настроить поведение при открытии и закрытии, анимацию, эффекты прозрачности и размытия, а также размер и положение Popup.

Поведение при открытии и закрытии

Элемент управления Popup отображает свое содержимое при установке свойства IsOpen в значение true. По умолчанию Popup остается открытым до установки свойства IsOpen в false. Однако можно изменить поведение по умолчанию, задав для свойства StaysOpen значение false. При установке этого свойства в значение false, содержимое окна Popup имеет захват указателя мыши. Popup теряет захват указателя мыши и окно закрывается, если возникает событие мыши вне окна Popup.

События Opened и Closed вызываются при открытии или закрытии окна содержимого Popup.

Анимация

Элемент управления Popup имеет встроенную поддержку анимаций, которые обычно связаны с таким поведением, как "постепенное проявление" или "выезд из-за кадра" Эти эффекты анимации можно включить, задав для свойства PopupAnimation одно из значений перечисления PopupAnimation. Для правильной работы анимации Popup необходимо установить значение свойства AllowsTransparency в true.

Можно также применить анимацию по типу Storyboard к элементу управления Popup.

Эффекты прозрачности и размытия

Свойство Opacity элемента управления Popup не влияет на его содержимое. По умолчанию окно содержимого Popup является непрозрачным. Для создания прозрачного Popup задайте для свойства AllowsTransparency значение true.

Содержимое Popup не наследует эффекты размытия, такие как DropShadowBitmapEffect, которые непосредственно устанавливаются в элементе управления Popup или любом другом элементе родительского окна. Для отображения эффектов размытия в содержимом Popup необходимо задать эффект размытия непосредственно для его содержимого. Например, если дочерний элемент Popup является StackPanel, то следует задать эффект размытия для StackPanel.

Размер контекстного меню

По умолчанию Popup автоматически изменяет размер в соответствии с содержимым. При автоматической регулировке размеров некоторые эффекты размытия могут быть скрыты, поскольку размер области экрана по умолчанию, который определен для содержимого Popup, не предоставляет достаточно места для отображения эффектов размытия.

Содержимое Popup может быть скрыто при задании RenderTransform для содержимого. В этом случае часть содержимого может быть скрыта, если содержимое преобразованного Popup выходит за пределы области исходного Popup. Если для эффекта размытия или преобразования требуется больше места, то можно определить поля вокруг содержимого Popup для предоставления элементу управления дополнительного пространства.

Определение положения контекстного меню

Позиция всплывающего окна определяется свойствами PlacementTarget, PlacementRectangle, Placement, HorizontalOffset и VerticalOffsetProperty. Дополнительные сведения см. в разделе Поведение при размещении контекстного меню. При отображении Popup на экране оно остается на прежнем месте, даже если изменилось положение его родительского элемента.

Настройка размещения контекстного меню

Можно настроить размещение элемента управления Popup, указав набор координат, относящихся к PlacementTarget, в которых необходимо отобразить Popup.

Чтобы настроить размещение, следует задать для свойства Placement значение Custom. Затем следует определить делегат CustomPopupPlacementCallback, который для Popup возвращает набор возможных точек размещения и основные оси (в порядке приоритета). Точка, показывающая наибольшую часть Popup, выбирается автоматически. Пример см. в разделе Практическое руководство. Указание пользовательского расположения контекстного меню.

Контекстное меню и визуальное дерево

Элемент управления Popup не имеет своего собственного визуального дерева. Вместо этого он возвращает размер 0 (ноль) при вызове метода MeasureOverride для Popup. Однако при задании свойства IsOpen для Popup в true создается новое окно со своим собственным визуальным деревом. Новое окно включает содержимое Child Popup. Ширина и высота нового окна не может превышать 75 процентов от ширины или высоты окна.

Элемент управления Popup содержит ссылку на его содержимое Child как на логический дочерний элемент. При создании нового окна содержимое Popup становится визуальным дочерним элементом окна и остается логическим дочерним элементом Popup. И наоборот Popup остается логическим родительским элементом содержимого Child.