I'm trying to create a reflection effect and it's working great except that I have to hard-code some values. This is my XAML:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="60"/>
<RowDefinition />
<RowDefinition Height="80"/>
</Grid.RowDefinitions>
<StackPanel Grid.Row="1" VerticalAlignment="Center">
<UserControl x:Name="CurrentPresenter" />
<Border Width="500" Height="200" >
<Border.Background>
<VisualBrush Visual="{Binding ElementName=CurrentPresenter}" >
<VisualBrush.Transform>
<TransformGroup>
<ScaleTransform ScaleX="1" ScaleY="-1" CenterX="500" CenterY="99" />
</TransformGroup>
</VisualBrush.Transform>
</VisualBrush>
</Border.Background>
<Border.OpacityMask>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,0.6">
<GradientStop Offset="-0.6" Color="Black"></GradientStop>
<GradientStop Offset="0.6" Color="Transparent"></GradientStop>
</LinearGradientBrush>
</Border.OpacityMask>
</Border>
</StackPanel>
</Grid>
I've tried to replace Border's Width="500"
and Height="200"
by Width="{Binding ElementName=CurrentPresenter, Path=Width}"
and Height="{Binding ElementName=CurrentPresenter, Path=Height}"
but it doesn't seem to work.
Wha's wrong with this code?
UPDATE: If I set Width and Height here:
<UserControl x:Name="CurrentPresenter" Height="200" Width="500" />
It works as expected. However it doesn't work if I set those values in the UserControl XAML. Any ideas?
Rather than bind to the Height and Width properties of the UserControl, have you tried binding the
Height
andWidth
properties of theBorder
to theActualHeight
andActualWidth
properties of the UserControl?change path to ViewportWidth! its work for me