Поделиться через

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

  • Статья

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

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

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

Примечание.

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

Создание всплывающего окна

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

<ToggleButton x:Name="TogglePopupButton" Height="30" Width="150" HorizontalAlignment="Left">
    <StackPanel>
        <TextBlock VerticalAlignment="Center" HorizontalAlignment="Center">
            <Run Text="Is button toggled? " />
            <Run Text="{Binding IsChecked, ElementName=TogglePopupButton}" />
        </TextBlock>

        <Popup Name="myPopup" IsOpen="{Binding IsChecked, ElementName=TogglePopupButton}">
            <Border BorderThickness="1">
                <TextBlock Name="myPopupText" Background="LightBlue" Foreground="Blue" Padding="30">
                Popup Text
                </TextBlock>
            </Border>
        </Popup>
    </StackPanel>
</ToggleButton>

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

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

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

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

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

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

Анимация

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

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

Прозрачность и эффекты для точечных рисунков

Свойство 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. Однако при установке значения true для свойства IsOpen объекта Popup создается новое окно с собственным визуальным деревом. В новом окне находится содержимое Child элемента управления Popup. Ширина и высота нового окна не могут превышать 75 процентов от ширины или высоты экрана.

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

См. также