Dela via

Popup-översikt

  • Artikel

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 en skärmkoordinat. Det här avsnittet beskriver Popup kontroll och innehåller information om dess användning.

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 visas är egenskapen IsOpen inställd på true.

Not

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

Skapa ett popup-fönster

I följande exempel visas hur du definierar en Popup kontroll som är det underordnade elementet i en ToggleButton kontroll. Eftersom en ToggleButton bara kan ha ett underordnat element placerar det här exemplet texten för ToggleButton och Popup-kontrollerna i en StackPanel. Innehållet i Popup visas i ett separat fönster som flyter över programfönstret nära den relaterade ToggleButton kontrollen.

<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 Popup kontroll för specifika användningsområden:

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

Öppna och stäng beteende

En Popup-kontroll visar dess innehåll när egenskapen IsOpen är inställd på true. Som standard förblir Popup öppen tills egenskapen IsOpen har angetts till false. Du kan dock ändra standardbeteendet genom att ange egenskapen StaysOpen till false. När du anger den här egenskapen till falsehar Popup innehållsfönstret musfångst. Den 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 utlöses när Popup innehållsfönstret är öppet eller stängt.

Animation

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

Du kan också använda animeringar som Storyboard på Popup-kontrollen.

Ogenomskinlighet och bitmappseffekter

Egenskapen Opacity för en Popup-kontroll påverkar inte dess innehåll. Som standardinställning är innehållsfönstret Popup ogenomskinligt. Om du vill skapa en transparent Popupanger du egenskapen AllowsTransparency till true.

Innehållet i en Popup ärver inte bitmappseffekter, till exempel DropShadowBitmapEffect, som du ställer in direkt på Popup-kontrollen eller på något annat element 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 underordnad till en Popup är en StackPanelanger du bitmappseffekten på StackPanel.

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

Innehållet i Popup kan också döljas när du anger 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 området för den ursprungliga Popup. Om en bitmappseffekt eller transformering kräver mer utrymme kan du definiera en marginal runt Popup innehåll för att ge mer område för kontrollen.

Definiera popup-positionen

Du kan placera ett popup-fönster genom att ange egenskaperna PlacementTarget, PlacementRectangle, Placement, HorizontalOffsetoch VerticalOffsetProperty. Mer information finns i Beteende för popup-placering. När Popup visas på skärmen flyttas inte själva om dess överordnade objekt flyttas.

Anpassa popupplaceringen

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

Om du vill anpassa placeringen anger du egenskapen Placement till Custom. Definiera sedan en CustomPopupPlacementCallback delegering 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 i stället storleken 0 (noll) när metoden MeasureOverride för Popup anropas. Men när du anger egenskapen IsOpen för Popup till trueskapas ett nytt fönster med ett eget visuellt träd. Det nya fönstret innehåller innehållet av Child i Popup. 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 har en referens till sitt Child innehåll som en logisk underordning. När det nya fönstret skapas blir innehållet i Popup ett visuellt barn i fönstret och förblir ett logiskt barn till Popup. Omvänt förblir Popup den logiska föräldern för sitt Child-innehåll.

Se även