Popup-meny

Kontrollen Popup ger ett sätt att visa innehåll i ett separat fönster som flyter över det aktuella programfönstret i förhållande till ett angivet element eller skärmkoordinat.

Följande bild visar en Popup kontroll som är placerad med avseende på en Button som är dess överordnade:

En popup-kontroll som är placerad i förhållande till en knappkontroll.

I följande tabell visas vanliga uppgifter för att arbeta med popup-kontrollen:

Titel Description
Animera ett popup-fönster Lär dig hur du animerar ett popup-fönster med hjälp av storyboards och animeringar.
Beteende för placering av popup-fönster Lär dig mer om de olika placeringslägena och hur du placerar ett popup-fönster i förhållande till element eller skärmkoordinater.
Ange en anpassad popup-position Lär dig hur du definierar anpassad placeringslogik för exakt popup-positionering.

Vad är ett popup-fönster?

En Popup kontroll visar innehåll i ett separat fönster i förhållande till ett element eller en punkt på skärmen. När Popup är synlig är egenskapen inställd på IsOpentrue.

Anmärkning

A Popup öppnas inte automatiskt när muspekaren flyttas över det överordnade objektet. Om du vill att en Popup ska öppnas automatiskt använder du ToolTip klassen eller ToolTipService . Mer information finns i Knappbeskrivning.

Skapa ett popup-fönster

I följande exempel definieras en Popup kontroll som det underordnade elementet i en ToggleButton kontroll. Eftersom ett ToggleButton kan bara ha ett underordnat element placerar det här exemplet texten för ToggleButton kontrollerna och Popup i en StackPanel. Popup-egenskapen IsOpen använder databindning för att synkronisera med knappens IsChecked egenskap. När du väljer knappen öppnas eller stängs popup-fönstret automatiskt. Innehållet visas i ett separat fönster som flyter över programfönstret nära knappen.

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

Kontroller som implementerar ett popup-fönster

Du kan skapa Popup kontroller i andra kontroller. Följande kontroller implementerar ett popup-fönster för specifika användningsområden:

  • ToolTip. Använder ett popupfönster för att visa kontextberoende hjälp när användaren hovrar över eller fokuserar ett element. Mer information finns i Knappbeskrivning.

  • ContextMenu. Använder ett popup-fönster för att visa kommandoalternativ för ett element, vanligtvis när användarna högerklickar. Mer information finns i ContextMenu.

  • ComboBox. Använder ett popup-fönster för att visa eller dölja listrutan med valbara objekt. Mer information finns i ComboBox.

Formatmallar och stilar

Kontrollen Popup innehåller XAML-formategenskaper som du kan använda för att anpassa dess utseende. Kontrollen definierar inte en standardmall med malldelar eller visuella tillstånd, men du kan anpassa dess beteende. Mer information finns i avsnittet Popup-beteende och utseende .

Innehållsegenskap

Den här kontrollen använder egenskapen Child som dess innehållsegenskap. Egenskapen Child representerar det enda elementet som popup-fönstret visar.

Delar

Den här kontrollen definierar inga malldelar.

Visuella tillstånd

Den här kontrollen definierar inga visuella tillstånd.

Kontrollen Popup innehåller funktioner som du kan använda för att anpassa dess beteende och utseende. Du kan till exempel ange öppet och nära beteende, animering, opacitet och bitmappseffekter samt Popup storlek och position.

Öppnings- och stängningsbeteende

En Popup kontroll visar dess innehåll när egenskapen IsOpen är inställd på true. Som standard Popup förblir öppen tills egenskapen IsOpen har angetts till false. Du kan dock ändra standardbeteendet genom att ange StaysOpen egenskapen till false. När du anger den här egenskapen till falsePopup har innehållsfönstret musfångst. Popup förlorar musfångst och fönstret stängs när en mushändelse inträffar utanför Popup-fönstret.

Händelserna Opened och Closed aktiveras när Popup innehållsfönstret öppnas eller stängs.

Animation

Kontrollen Popup har inbyggt stöd för animeringar som vanligtvis är associerade med beteenden som tona in och dra in. Du kan aktivera dessa animeringar genom att ange PopupAnimation egenskapen till ett PopupAnimation uppräkningsvärde. För att animeringar ska fungera korrekt måste egenskapen Popup ställas in till AllowsTransparency.

Du kan också använda animeringar som Storyboard för Popup kontrollen.

Ogenomskinlighet och bitmappseffekter

Egenskapen Opacity för en Popup kontroll påverkar inte dess innehåll. Som standard är Popup-innehållsfönstret ogenomskinligt. Ställ in Popup till AllowsTransparency för att skapa en transparent true.

Innehållet i en Popup ärver inte bitmappseffekter, som DropShadowBitmapEffect, som du ställer in direkt på Popup-kontrollen eller på någon annan del i det överordnade fönstret. För att bitmappseffekter ska visas på innehållet i en Popupmåste du ange bitmappseffekten direkt på innehållet. Om till exempel barnet till en Popup är en StackPanel, anger du bitmappseffekten på StackPanel.

Som standard storleksanpassas en Popup automatiskt till sitt innehåll. När automatisk storleksändring sker kan vissa bitmappseffekter döljas eftersom standardstorleken för det skärmområde som har definierats för Popup innehållet inte ger tillräckligt med utrymme för att bitmappseffekterna ska visas.

Popup innehållet kan också döljas när du ställer in en RenderTransform på innehållet. I det här scenariot kan en del innehåll döljas om innehållet i den transformerade Popup sträcker sig utanför det ursprungliga Popupområdet . Om en bitmappseffekt eller transformering kräver mer utrymme kan du definiera en marginal runt Popup innehållet för att ge mer område för kontrollen.

Definiera popup-positionen

Du kan placera ett popup-fönster genom att PlacementTargetange egenskaperna , PlacementRectangle, Placement, HorizontalOffsetoch VerticalOffsetProperty . Mer information finns i Beteende för placering av popup-fönster. När du visar en Popup på skärmen flyttas den inte om dess överordnade objekt flyttas.

Anpassa popup-placering

Du kan anpassa placeringen av en Popup kontroll genom att ange en uppsättning koordinater som är relativa till den PlacementTarget plats där du vill att den Popup ska visas.

Om du vill anpassa placeringen anger du egenskapen Placement till Custom. Definiera sedan ett CustomPopupPlacementCallback ombud som returnerar en uppsättning möjliga placeringspunkter och primära axlar (i prioritetsordning) för Popup. Den punkt som visar den största delen av Popup väljs automatiskt. Ett exempel finns i Ange en anpassad popup-position.

En Popup kontroll har inte ett eget visuellt träd. Den returnerar en storlek på 0 (noll) när du anropar MeasureOverride metoden. Men när du anger IsOpen egenskapen till trueskapar kontrollen ett nytt fönster med ett eget visuellt träd. Det nya fönstret innehåller innehållet i ChildPopup. Bredden och höjden på det nya fönstret får inte vara större än 75 procent av skärmens bredd eller höjd.

Kontrollen Popup underhåller en referens till dess Child innehåll som ett logiskt underordnat objekt. När kontrollen skapar det nya fönstret blir innehållet Popup ett visuellt underordnat objekt i fönstret och förblir det logiska underordnade till Popup. Omvänt förblir Popup det logiska överordnade till innehållet Child.

Se även

  • Last updated on