WPF: come fade-in e scalare un controllo utente in un pop-up
Domanda
Ho un controllo utente che mi piacerebbe mostrare quando l'utente fa clic su un pulsante. Questo non è un problema, utilizzando il controllo Popup AF.
Tuttavia, vorrei avere la dissolvenza in controllo utente e scala che va da 0,5 a 1.2 e di nuovo a 1,0 (X e Y) allo stesso tempo.
Come faccio a farlo?
Soluzione
WPF popup non sono trasparenti, in modo da fade in e fade out non funzionano veramente. È possibile impostare l'opacità tutto quello che volete, ma che non cambierà nulla. Tuttavia, si potrebbe giocare con il Tooltip. E 'abbastanza vicino a un popup. In ogni caso, ecco qualcosa per iniziare:
<UserControl x:Class="WpfApplication1.UserControl1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<UserControl.Style>
<Style>
<Style.Triggers>
<EventTrigger RoutedEvent="FrameworkElement.Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="Opacity" Duration="00:00:02" From="0" To="1" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<Trigger Property="FrameworkElement.Visibility" Value="Collapsed">
<Setter Property="FrameworkElement.Opacity" Value="0"/>
</Trigger>
</Style.Triggers>
</Style>
</UserControl.Style>
<Border x:Name="border" BorderBrush="Blue" BorderThickness="3" CornerRadius="3" Padding="3" Background="Orange"
Width="175" Height="175">
<TextBlock Text="Sample" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
plop da qualche parte, io sto usando un tooltip sullo stesso pulsante, solo a scopo dimostrativo:
<Button Click="OnButtonClick" Content="click to see popup">
<Button.ToolTip>
<ToolTip x:Name="popup" IsOpen="False" Background="Transparent" BorderBrush="Transparent"
Placement="Bottom">
<WpfApplication1:UserControl1/>
</ToolTip>
</Button.ToolTip>
</Button>
per il codice onButtonClick alle spalle, ho appena toggleed il pop-up in modo da poter cliccare più di una volta:
private void OnButtonClick(object sender, RoutedEventArgs e)
{
popup.IsOpen = !popup.IsOpen;
}
Altri suggerimenti
popup WPF in grado di gestire la trasparenza, è sufficiente impostare il seguente
<Popup AllowsTransparency="True" PopupAnimation="Fade">