2009-09-15 24 views
14

Tengo un Popup en mi XAML para mostrar algo de información. Cuando aparece el cuadro, no tiene Border y parece combinarse en el Background de la página. Solo necesita un Border, e idealmente una sombra paralela detrás de él para mostrar algún tipo de estratificación y enfoque.Ventana emergente de WPF: ¿Cómo poner un borde alrededor de la ventana emergente?

¿Alguna idea de cómo hacer que una ventana emergente tenga un borde y posiblemente el efecto de sombra?

+3

debe tener cuidado con el uso de esos efectos, la mayoría de las veces son sloooowwww. –

Respuesta

4

Gracias, que terminó dándole una apariencia 3D-como (casi) mediante el establecimiento de la frontera como:

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

ve bastante decente!

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

Aparentemente, las ventanas emergentes no admiten sombras paralelas, see link.

Sin embargo, he encontrado una solución que funciona bastante bien IMO. Básicamente, la idea es tener un lienzo anidado dentro de otro lienzo transparente y simplemente aplicar la sombra paralela al lienzo anidado. Sencillo. Aquí está un ejemplo:

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

Los puntos a tener en cuenta son que el lienzo anidada tiene que ser más pequeño que el tamaño de su contenedor. También AllowsTransparency debe establecerse también.

+0

+1 por recordarme acerca de 'AllowsTransparency' – quetzalcoatl

25

mucho más fácil en mi opinión es poner un margen alrededor de la frontera emergente suficientemente grande para el DropShadowEffect, es decir

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

la ventana emergente debe permitir la transparencia, es decir AllowsTransparency = True.

+0

Realmente estaba luchando con la materia de dropshadow, y esto realmente me ayudó. ¡Agregar el margen es una idea increíble! – Franchesca

+0

¡El margen me funcionó a la perfección! Muchas gracias – Chris

+0

Esto es bastante obvio porque está en la respuesta, pero el 'AllowsTransparency =" True "' en la ventana emergente es la parte más importante. Si lo extrañas como lo hice, obtendrás un borde negro grueso alrededor de tu ventana emergente. – Brandon