WPF: ¿Cómo hacer referencia a otros controles dentro de la propiedad de propiedad del disparador?

Question

Tengo una página WPF. La página tiene algo de contenido, pero el último componente secundario del diseño raíz de la página es un control de usuario que he creado. Se ve así:

<UserControl DataContext=UserControlViewModel> 
    <UserControl.Resources> 
    <BooleanToVisibilityConverter x:Key="visibilityConverter" /> 
    </UserControl.Resources> 
    <Grid 
     Name="grid" 
     Visibility="{Binding IsOn, Converter={StaticResource visibilityConverter}}"> 
    <!-- Border to dim everything behind my user control --> 
    <Border Background="#000000" Opacity="0.4" /> 
    <!-- The following border is red and holds the content --> 
    <Border 
     Width="{Binding ElementName=txt, Path=ActualWidth}" 
     Height="{Binding ElementName=txt, Path=ActualHeight}" 
     Margin="{Binding ElementName=txt, Path=Margin}" 
     HorizontalAlignment="{Binding ElementName=txt, Path=HorizontalAlignment}" 
     VerticalAlignment="{Binding ElementName=txt, Path=VerticalAlignment}" 
     Background="Red"> 
     <TextBlock 
      Name="txt" 
      Width="200" 
      Height="100" 
      Margin="20" 
      HorizontalAlignment="Center" 
      VerticalAlignment="Center" 
      Text="This is my super awesome message!" /> 
    </Border> 
    </Grid> 
</UserControl> 

De manera predeterminada, la propiedad del objeto IsOnUserControlViewModel se establece en false, es decir, el control de usuario no es visible. He implementado una lógica que cambia esta propiedad a true y luego el control del usuario se muestra frente a todos los demás componentes que están atenuados. Esto funciona bien

Ahora, quiero crear una animación de efecto de fundido que atenuaría los componentes que están detrás del control del usuario una vez que se vuelva visible. Luego, quiero hacer que mi borde rojo contenga el contenido para desvanecerse desde el lado izquierdo, por lo que se mueve + se desvanece.

Comencemos primero con el efecto de fundido. Escribí este estilo a la Border que se supone que debe hacer el oscurecimiento de componentes de fondo:

<UserControl DataContext=UserControlViewModel> 
    <UserControl.Resources> 
    <BooleanToVisibilityConverter x:Key="visibilityConverter" /> 
    </UserControl.Resources> 
    <Grid 
     Name="grid" 
     Visibility="{Binding IsOn, Converter={StaticResource visibilityConverter}}"> 
    <!-- Border to dim everything behind my user control --> 
    <Border Background="#000000" Opacity="0.4"> 
     <!-- The following style is new code --> 
     <Border.Style> 
     <Style TargetType="Border"> 
      <Style.Triggers> 
      <Trigger Property="{Binding ElementName=grid, Visibility}" Value="Visible"> 
       <Trigger.EnterActions> 
       <BeginStoryboard> 
        <Storyboard> 
        <DoubleAnimation 
         Storyboard.TargetProperty="Opacity" 
         From="0.0" 
         To="0.4" 
         Duration="0:0:1" /> 
        </Storyboard> 
       </BeginStoryboard> 
       </Trigger.EnterActions> 
      </Trigger> 
      </Style.Triggers> 
     </Style> 
     </Border.Style> 
    </Border> 
    ... 

Pero ahí está el problema: No puedo establecer la unión en el gatillo Property, porque no es una propiedad de dependencia. Necesito una forma de decirle a mi disparador que dispare una vez que el grid tiene la propiedad Visibility establecida en Visible. Por favor ayuda y gracias!

El segundo problema es que no sé cómo mover el borde rojo, así que también necesito ayuda con algunas transformaciones de escala, supongo ... ¡Gracias una vez más!

Answer 1

intente reemplazar la siguiente línea:

original:

<Trigger Property="{Binding ElementName=grid, Visibility}" Value="Visible"> 

sustitución:

<DataTrigger Binding={Binding Visibility, ElementName=grid} Value="Visibile">