{Binding ElementName=...} does not work from any CompositeTransform property

Question

I have the following code in which I hide a WebView just under the main Grid (LayoutRoot) so I can do a sliding animation later:

<Page...>
    <Grid x:Name="LayoutRoot">
        ...
        <Grid x:Name="ContentRoot">
            ...
        </Grid>
        <WebView...>
            <WebView.RenderTransform>
                <CompositeTransform TranslateY="{Binding ElementName=LayoutRoot, 
                                    Path=ActualHeight}"/> <!--Does not work-->
            </WebView.RenderTransform>
        </WebView> 
    </Grid>
</Page>

When I first type the {Binding ElementName=...} line into the designer, the WebView appears just below the Grid like it should. However, when I rebuild the solution or run the app, the WebView simply obscures the whole LayoutRoot.

This will happen regardless of what I am binding to/whatever the control is; however, binding to the exact same expression will show up properly in the designer and in the phone. To demonstrate what I am saying:

<Button Width="{Binding ElementName=LayoutRoot, Path=ActualHeight}"> <!--Works perfectly, both on designer and phone-->
    <Button.RenderTransform>
        <CompositeTransform SomeProperty={Binding ElementName=SomeElement, Path=SomePath}"/> <!--This does not work-->
    </Button.RenderTransform>
</Button>

Is there any way to bind to LayoutRoot.ActualHeight short of writing C# code for this?

score 1 · Answer 1 · answered Apr 01 '15 at 23:39

1

One problem you have is you are trying to bind to ActualHeight which is not a dependency property nor an observable (INotifyPropertyChanged) property, so the binding is only evaluated once when it's first created.

answered Apr 01 '15 at 23:39

Filip Skakun

31,624
6
74
100

But then, why are other properties of the control (such as Height or Width) able to bind to the Grid's ActualHeight with no problems? – James Ko Apr 02 '15 at 00:37
They shouldn't be able to do that. Perhaps their bindings are evaluated after the first layout pass while the transform's one is evaluated before. – Filip Skakun Apr 02 '15 at 06:35
ActualHeight **is** a dependency property. https://msdn.microsoft.com/en-us/library/system.windows.frameworkelement.actualheightproperty%28v=vs.110%29.aspx – Kevin Gosse Apr 02 '15 at 11:54
@KooKiz Sorry if I didn't clarify enough in the description: I am making a WinRT app. The link you provided was for WPF. – James Ko Apr 02 '15 at 19:44
@FilipSkakun Is there anything I can do in XAML to cause the RenderTransform to reevaluate the property? – James Ko Apr 02 '15 at 19:50
1

It's a weird property, the MSDN page for [`ActualWidth`](https://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.frameworkelement.actualwidth.aspx) says it's a "calculated property" and to "not attempt to use `ActualWidth` as a binding source for an `ElementName` binding. If you have a scenario that requires updates based on `ActualWidth`, use a [`SizeChanged`](https://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.frameworkelement.sizechanged.aspx) handler." – Filip Skakun Apr 03 '15 at 05:41
Oh indeed. I wonder what the MSDN means, afaik a binding shouldn't behave differently depending on whether it's using `ElementName` or not... Maybe something specific to WinRT? I'll dig into the matter, thanks for the heads-up – Kevin Gosse Apr 03 '15 at 08:08
It might be a question of name scopes. – Filip Skakun Apr 03 '15 at 16:09
Apparently MSDN is inaccurate in this case. – Filip Skakun Apr 03 '15 at 22:04

{Binding ElementName=...} does not work from any CompositeTransform property

1 Answers1