ActualHeight / ActualWidth of Border is not as expected when binding it dynamically

Question

I have two borders in a Grid in a UserControl. First border is in row one and second border is is in row two.

<UserControl>
    <Grid Height="100">
        <Grid.RowDefinitions>
            <RowDefinition Height="{Binding RowOneLength}" />
            <RowDefinition Height="{Binding RowTwoLength}" />
        </Grid.RowDefinitions>  

        <Border x:Name="Border1" Grid.Row="0">                       
        </Border>
        <Border x:Name="Border2" Grid.Row="1">                       
        </Border>
    </Grid>
</UserControl>

I am dynamically binding values to row definitions so that border height also fit to the row height.

When I create an object of this UserControl from the ViewModel and invoke a method in it's code behind, I am not getting the borders original height (what I expect is the value given by me) and it's showing half length of grid height for both borders. After a while border size is changed to what I expect.

I want to retrieve the correct values right from the beginning. What can I do to acchieve this behavior?

public void SetImagesForNewPattern(int val1, int val2)
{
    this.Loaded += (sender, e) =>
    {
         var len1 =  Border1.ActualHeight+Border1.ActualWidth;
         var len2 =  Border2.ActualHeight+Border2.ActualWidth;               
    }
}

This is my code behind method. This method is called from my ViewModel. I am getting the exact actual width & height only after the border SizeChanged event.

Answer 1

According to this msdn article a UserControl isn't finally rendered when the Loaded event is raised.

You could use the SizeChanged event of the UserControl or Border instances, but that would mean to recalculate the value several times as the sizes will change during measuring and rendering the UserControl.