easiest way to center an image in silverlight?

Question

Say I have a grid with 3 rows. In the center row I'd like to put an image and then center it in that row vertically and horizontally. But since (I think) Silverlight uses upper left corners of an element when it centers, the upper left corner of the image is centered when I tell it to center vertically/horizontally.

I've seen 2 approaches to this:

• modify the image position in an event
• set the image's margin to a very large number on all sides (500)

Is there an easier way? Seems kinda weird that you'd need to do something hacky like those 2 approaches. I'd prefer to just tell the thing that its anchor is in the center and then tell it to center. Hmmm, could be a good custom control.

Update: the really obnoxious thing about this was when I made a minor change to the page to change how that image was centered and FF3 displayed an old version of the page. Which made me think that it didn't work. Then I pulled it up in IE and it looked right. I flushed FF3's cache and it displayed the right page. Damn annoying.

Answer 1

Why wouldn't this work for you?

<Grid x:Name="LayoutRoot" Background="White">
    <Grid.RowDefinitions>
        <RowDefinition />
        <RowDefinition />
        <RowDefinition />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Image Source="Butterfly.jpg"
           Height="50" Width="50"
           HorizontalAlignment="Center" VerticalAlignment="Center"
           Stretch="UniformToFill"
           Grid.Column="1" Grid.Row="1" />
</Grid>