Übersicht über Popups

  • Artikel

Das Popup-Steuerelement bietet eine Möglichkeit, Inhalt in einem separaten Fenster anzuzeigen, das relativ zu einer festgelegten Element- oder Bildschirmkoordinate über das aktuelle Anwendungsfenster gleitet. In diesem Thema wird das Popup-Steuerelement vorgestellt und Sie erhalten Informationen über seine Verwendung.

Was ist ein Popup?

Ein Popup-Steuerelement zeigt Inhalt in einem separaten Fenster relativ zu einem Element oder einem Punkt auf dem Bildschirm an. Wenn Popup festgelegt ist, ist die IsOpen-Eigenschaft auf true festgelegt.

Hinweis

Ein Popup wird nicht automatisch geöffnet, wenn der Mauszeiger über sein übergeordnetes Objekt bewegt wird. Wenn sie automatisch Popup öffnen möchten, verwenden Sie die ToolTip- oder die ToolTipService-Klasse. Weitere Informationen finden Sie unter Übersicht über die QuickInfo.

Erstellen eines Popups

Im folgenden Beispiel wird das Definieren eines Popup-Steuerelement gezeigt, das einem ToggleButton-Steuerelement untergeordnet ist. Da ein ToggleButton untergeordnetes Element nur ein untergeordnetes Element aufweisen kann, platziert dieses Beispiel den Text für die ToggleButton- und Popup-Steuerelemente in einem StackPanel. Der Inhalt der Popup-Datei wird in einem separaten Fenster angezeigt, das in der Nähe des zugehörigen ToggleButton-Steuerelements über das Anwendungsfenster schwebt.

<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>

Steuerelemente, die ein Popup implementieren

Sie können Popup-Steuerelemente in andere Steuerelemente einbauen. Die folgenden Steuerelemente implementieren die Popup-Steuerelement für bestimmte Verwendungen:

Das Popup-Steuerelement bietet Funktionen, die es Ihnen ermöglichen, das Verhalten und die Darstellung anzupassen. Beispielsweise können Sie Folgendes festlegen: Öffnungs- und Schließverhalten, Animation, Deckkraft und Bitmapeffekte sowie Popup-Größe und -Position.

Öffnungs- und Schließverhalten

Ein Popup-Steuerelement zeigt seinen Inhalt an, wenn die IsOpen-Eigenschaft auf true gesetzt ist. Popup bleibt standardmäßig so lange geöffnet, bis die IsOpen-Eigenschaft auf false gesetzt wird. Für einige Aktionen können Sie das Standardverhalten ändern, indem Sie die StaysOpen-Eigenschaft auf false festlegen. Wenn Sie diese Eigenschaft auf false setzen, wird das Popup-Inhaltsfenster mit der Maus erfasst. Der Popup verliert die Mauserfassung und das Fenster schließt sich, wenn ein Mausereignis außerhalb des Popup-Fensters auftritt.

Die Opened- und Closed-Ereignisse werden ausgelöst, wenn das Popup-Inhaltsfenster geöffnet oder geschlossen wird.

Animation

Das Popup-Steuerelement verfügt über integrierte Unterstützung für die Animationen, die typischerweise mit Verhalten wie dem Einblenden verknüpft sind. Sie können diese Animationen einschalten, indem Sie die PopupAnimation-Eigenschaft auf einen PopupAnimation-Aufzählungswert setzen. Damit die Popup-Animationen korrekt funktionieren, müssen Sie die AllowsTransparency-Eigenschaft auf true setzen.

Sie können auch Animationen wie Storyboard auf das Popup-Steuerelement anwenden.

Deckkraft und Bitmapeffekte

Die Opacity-Eigenschaft für ein Popup-Steuerelement hat keine Auswirkungen auf seinen Inhalt. Standardmäßig ist das Popup-Inhaltsfenster undurchsichtig. Zum Erstellen einer transparenten Popup, legen Sie die AllowsTransparency-Eigenschaft auf true fest.

Der Inhalt eines Popup erbt keine Bitmap-Effekte, wie z. B. DropShadowBitmapEffect, die Sie direkt auf dem Popup-Steuerelement oder auf einem anderen Element im übergeordneten Fenster einstellen. Damit Bitmapeffekte auf dem Inhalt eines Popup-Elements erscheinen, müssen Sie den Bitmapeffekt direkt auf dessen Inhalt festlegen. Wenn beispielsweise ein untergeordnetes Element von PopupStackPanel ist, legen Sie den Bitmapeffekt auf den StackPanel fest.

Standardmäßig wird die Größe von Popup automatisch an seinen Inhalt angepasst. Bei der automatischen Anpassung werden einige Bitmapeffekte möglicherweise ausgeblendet, da die Standardgröße des Bildschirmbereichs, der für den Popup-Inhalt definiert ist, nicht ausreichend Platz zum Anzeigen der Bitmapeffekte bietet.

Der Popup-Inhalt kann auch verdeckt werden, wenn Sie ein RenderTransform auf den Inhalt setzen. In diesem Szenario können einige Inhalte ausgeblendet werden, wenn der Inhalt der transformierten Popup über den Bereich des Popup-Originals hinausgeht. Wenn für einen Bitmapeffekt oder eine Transformation mehr Platz benötigt wird, können Sie einen Rand um den Popup-Inhalt definieren, um dem Steuerelement mehr Platz zu bieten.

Definieren der Popup-Position

Sie können ein Popup positionieren, indem Sie die PlacementTarget-, PlacementRectangle-, Placement-, HorizontalOffset- und VerticalOffsetProperty-Eigenschaften festlegen. Weitere Informationen finden Sie unter Verhalten beim Platzieren von Popups. Wenn das Popup auf dem Bildschirm angezeigt wird, positioniert es sich nicht selbst neu, wenn sich sein übergeordnetes Element neu positioniert.

Anpassen der Popupplatzierung

Sie können die Platzierung eines Popup-Steuerelements anpassen, indem Sie eine Reihe von Koordinaten angeben, die relativ zu der PlacementTarget sind, an der das Popup erscheinen soll.

Um die Platzierung anzupassen, legen Sie die Placement-Eigenschaft auf Custom fest. Definieren Sie anschließend einen CustomPopupPlacementCallback-Delegaten, der eine Reihe möglicher Platzierungspunkte und primärer Achsen (in der bevorzugten Reihenfolge) für das Popup-Steuerelement zurückgibt. Der Punkt, an dem der größte Teil des Popup-Steuerelements anzeigt wird, wird ausgewählt. Ein Beispiel finden Sie unter Angeben einer benutzerdefinierten Popupposition.

Ein Popup-Steuerelement hat keinen eigenen visuellen Baum; stattdessen gibt es eine Größe von 0 (Null) zurück, wenn die MeasureOverride-Methode für Popup aufgerufen wird. Wenn Sie jedoch die IsOpen-Eigenschaft von Popup auf true setzen, wird ein neues Fenster mit einem eigenen visuellen Baum erstellt. Der Child, der den Inhalt dieser neuen Popup enthält. Die Breite und Höhe des neuen Fensters darf nicht größer als 75 Prozent der Breite oder Höhe des Bildschirms sein.

Das Popup-Steuerelement behält einen Verweis auf seinen Child-Inhalt als logisches untergeordnetes Element bei. Wenn das neue Fenster erstellt wird, wird der Inhalt von Popup ein visuelles untergeordnetes Element des Fensters und bleibt das logische untergeordnete Element von Popup. Umgekehrt bleibt Popup das logische übergeordnete Element des Child-Inhalts.

Weitere Informationen