Silverlight 4 - Am I using TransformToVisual() correctly?

Question

I have just started to play around with Silverlight and I decided to do a small app in Visual Studio 2010. I am trying to find the current position of a usercontrol in a Canvas. Here is the XAML layout:

<Grid x:Name="LayoutRoot" Background="#FF141313">
    <Grid.RowDefinitions>
        <RowDefinition Height="39"/>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <Button Opacity="0.5" Background="{x:Null}" BorderThickness="1" FontFamily="Courier New" Content="Align Images" Cursor="Hand" Name="buttonAlignImages" Click="buttonAlignImages_Click" Margin="45,8,0,11" HorizontalAlignment="Left" Width="84" />
    <Button HorizontalAlignment="Left" Width="33" Opacity="0.5" Background="{x:Null}" BorderThickness="1" FontFamily="Courier New" Content="Home" Cursor="Hand" Margin="8,8,0,11"/>
    <Canvas x:Name="ImageContainer" Margin="8" Grid.Row="1" Background="Black"/>
</Grid>

My usercontrol is added to the "ImageContainer" Canvas. One of the buttons in XAML is called "buttonAlignImages". When the user clicks this I basically want the images to be aligned in a specific manner. Anyways to do this I want to first get the position of the usercontrol embedded in the "ImageContainer". So here is the code when the button is clicked:

private void buttonAlignImages_Click(object sender, RoutedEventArgs e)
    {
        double margin = 5.0;
        Point top_left = new Point(margin, margin);
        Point top_right = new Point(ActualWidth - margin, margin);
        Point bottom_left = new Point(5.0, ActualHeight - margin);
        Point bottom_right = new Point(ActualWidth - margin, ActualHeight - margin);

        foreach (UIElement element in ImageContainer.Children)
        {

            Photo singlePhoto = element as Photo;
            if (singlePhoto != null)
            {
                // get the transform for the current photo as applicable to basically this visual
                GeneralTransform gt = singlePhoto.TransformToVisual(ImageContainer);
                // get the position on the root visual by applying the transform to the singlePhoto
                Point singlePhotoTopLeft = gt.Transform(new Point(0, 0));
                // now translate the position of the singlePhoto
                singlePhoto.Translate(singlePhotoTopLeft.X - top_left.X, singlePhotoTopLeft.Y - top_left.Y);
            }
        }
    }
public void Translate(double deltaX, double deltaY)
    {
        translateTransform.X += deltaX;
        translateTransform.Y += deltaY;
    }

The embedded photo usercontrol does move around but when I call gt.Transform(new Point(0,0)) it always gives me (0,0), so the resulting translation is only by 5 pixels. Why does this happen? Am I not using TransformToVisual() correctly?

Answer 1

Did you ever solve this? I've got the same issue- everything works fine with TransformToVisual if it's JUST a grid or JUST a canvas, but get a grid inside a canvas or viceV and I always get 0,0...