Compartilhar via

Visão geral do pop-up

O Popup controle fornece uma maneira de exibir o conteúdo em uma janela separada que flutua sobre a janela atual do aplicativo em relação a um elemento designado ou coordenada de tela. Este tópico apresenta o Popup controle e fornece informações sobre seu uso.

O que é um pop-up?

Um Popup controle exibe o conteúdo em uma janela separada em relação a um elemento ou ponto na tela. Quando estiver Popup visível, a IsOpen propriedade será definida como true.

Observação

Um Popup não é aberto automaticamente quando o ponteiro do mouse se move sobre seu objeto pai. Se você quiser que Popup abra automaticamente, use a classe ToolTip ou ToolTipService. Para obter mais informações, consulte Visão geral da Dica de Ferramenta.

Criando um pop-up

O exemplo a seguir mostra como definir um Popup controle que é o elemento filho de um ToggleButton controle. Como um ToggleButton pode ter apenas um elemento filho, este exemplo coloca o texto para o ToggleButton e o Popup controle em um StackPanel. O conteúdo do Popup é exibido em uma janela separada que flutua sobre a janela do aplicativo perto do controle relacionado 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>

Controles que implementam um pop-up

Você pode incorporar Popup controles em outros controles. Os controles a seguir implementam o Popup controle para usos específicos:

O Popup controle fornece funcionalidade que permite personalizar seu comportamento e aparência. Por exemplo, você pode definir comportamentos de abertura e fechamento, animação, opacidade e efeitos de bitmap, assim como Popup tamanho e posição.

Comportamento de Abrir e Fechar

Um Popup controle exibe seu conteúdo quando a IsOpen propriedade é definida como true. Por padrão, Popup permanece aberto até que a IsOpen propriedade seja definida como false. No entanto, você pode alterar o comportamento padrão definindo a StaysOpen propriedade como false. Quando você define essa propriedade como false, a janela de conteúdo obtém a captura do mouse. Quando ocorre um evento do mouse fora da janela Popup, a Popup perde a captura do mouse, e a janela é fechada.

Os eventos Opened e Closed são gerados quando a janela de conteúdo Popup está aberta ou fechada.

Animação

O Popup controle tem suporte interno para as animações que normalmente estão associadas a comportamentos como fade-in e slide-in. Você pode ativar essas animações definindo a PopupAnimation propriedade como um PopupAnimation valor de enumeração. Para Popup que as animações funcionem corretamente, você deve definir a propriedade AllowsTransparency como true.

Você também pode aplicar animações como Storyboard ao Popup controle.

Opacidade e Efeitos de Bitmap

A Opacity propriedade de um Popup controle não tem efeito sobre seu conteúdo. Por padrão, a janela de Popup conteúdo é opaca. Para criar um transparente Popup, defina a AllowsTransparency propriedade como true.

O conteúdo de um Popup não herda efeitos de bitmap, como DropShadowBitmapEffect, que são definidos diretamente no controle Popup ou em qualquer outro elemento na janela pai. Para que os efeitos de bitmap apareçam no conteúdo de um Popup, você deve definir o efeito bitmap diretamente em seu conteúdo. Por exemplo, se o filho de um Popup for um StackPanel, defina o efeito bitmap no StackPanel.

Por padrão, um Popup é dimensionado automaticamente para seu conteúdo. Quando ocorre o dimensionamento automático, alguns efeitos de bitmap podem estar ocultos porque o tamanho padrão da área de tela definida para o Popup conteúdo não fornece espaço suficiente para que os efeitos de bitmap sejam exibidos.

Popup o conteúdo também pode ser obscurecido quando você aplica um RenderTransform ao conteúdo. Nesse cenário, algum conteúdo pode ficar oculto se o conteúdo do elemento transformado Popup se estender além da área do elemento original Popup. Se um efeito bitmap ou transformação exigir mais espaço, você poderá definir uma margem em torno do Popup conteúdo para fornecer mais área para o controle.

Definindo a posição do pop-up

Você pode posicionar um popup definindo as propriedades PlacementTarget, PlacementRectangle, Placement, HorizontalOffset e VerticalOffsetProperty. Para obter mais informações, consulte Comportamento de Posicionamento de Popup. Quando Popup é exibido através da tela, ele não se reposiciona se o pai for reposicionado.

Personalizando o posicionamento pop-up

Você pode personalizar o posicionamento de um Popup controle especificando um conjunto de coordenadas relativas ao PlacementTarget local em que deseja que ele Popup apareça.

Para personalizar o posicionamento, defina a Placement propriedade como Custom. Em seguida, defina um CustomPopupPlacementCallback delegado que retorna um conjunto de possíveis pontos de posicionamento e eixos primários (em ordem de preferência) para o Popup. O ponto que mostra a maior parte do Popup é selecionado automaticamente. Para obter um exemplo, consulte Especificar uma posição pop-up personalizada.

Um Popup controle não tem sua própria árvore visual; em vez disso, retorna um tamanho de 0 (zero) quando o método MeasureOverride para Popup é chamado. No entanto, quando você define a IsOpen propriedade como Popuptrue, uma nova janela com sua própria árvore visual é criada. A nova janela contém o Child conteúdo de Popup. A largura e a altura da nova janela não podem ser maiores que 75% da largura ou altura da tela.

O Popup controle mantém uma referência ao seu Child conteúdo como um elemento lógico. Quando a nova janela é criada, o conteúdo de Popup torna-se um filho visual da janela e permanece o filho lógico de Popup. Por outro lado, Popup continua sendo o pai lógico do conteúdo de Child.

Consulte também

  • Last updated on