WPF-Popup: Wie man eine Grenze setzen um das Pop-up?

Question

Ich habe ein Popup in meiner XAML bekam einige Informationen zu zeigen. Wenn die Box erscheint, hat es keine Border und erscheint in den Background der Seite zu mischen. Es braucht nur einen Border und idealerweise einen Drop-Schatten dahinter eine Art von Schichtung und Fokus zu zeigen.

Alle Ideen, wie ein Popup, um Stil eine Grenze zu haben und möglicherweise den Schatten-Effekt?

Answer 1

Thanks, I ended up giving it a 3D-like (hardly) appearance by setting the border like:

 <Border BorderBrush="White" BorderThickness="3,3,0,0">
            <Border BorderBrush="Black" BorderThickness="1,1,3,3">
</Border>
</Border>

Looks pretty decent!

Answer 2

Much easier in my opinion is putting a margin around the Popup Border large enough for the DropShadowEffect, i.e.

<Border ... Margin="0 0 8 8">
    <Border.Effect>
        <DropShadowEffect ... />
    </Border.Effect>
    <!-- Popup Content Here -->
</Border>

The Popup should allow transparency, that is AllowsTransparency = True.

Answer 3

<Popup PopupAttributes="SetByYou">
 <Border BorderAttribute="SetByYou">
  <!-- Content here -->
 </Border>
</Popup>

Answer 4

Apparently popups don't currently support drop shadows, see link.

However, I have come up with a workaround this which works rather well IMO. Basically the idea is to have a Canvas nested within another transparent Canvas and just apply the drop shadow to the nested Canvas. Simple. Heres an example:

        <Grid>
        <TextBox x:Name="MyTxtBx" Width="50" 
                 Height="20" Text="Hello"/>
        <Popup IsOpen="True" Width="200" Height="100" 
               PlacementTarget="{Binding ElementName=MyTxtBx}" 
               AllowsTransparency="True" >
            <Canvas Background="Transparent">
                <Canvas Background="Green" Width="150" Height="50">
                    <Canvas.BitmapEffect>
                        <DropShadowBitmapEffect Softness=".5" 
                                                ShadowDepth="5" 
                                                Color="Black"/>
                    </Canvas.BitmapEffect>
                    <Label Content="THIS IS A POPUP TEST"/>
                </Canvas>
            </Canvas>
        </Popup>
    </Grid>

The points to note are that the nested canvas needs to be smaller than the size of it's container. Also AllowsTransparency must be set too.