wpfxamlstretch

Image stretched and centered?

I have the following XAML code :

<Image Source="a.jpg" HorizontalAlignment="Center"  VerticalAlignment="Center" Stretch="Uniform"/>

and I, visually, got this :

enter image description here

(http://img810.imageshack.us/img810/2401/imagestretchuniform.png)

With Stretch="None", I got this :

enter image description here

(http://img28.imageshack.us/img28/1783/imagestretchnone.png)

Now, what I want is to center the Image vertically or horizontally with Stretch="Uniform" ! Only the "smallest" side (with Uniform) will be centered, right. But at the moment, as you can see on screenshots, the Image is simply put in the top-left corner, even if I defined HorizontalAlignment and VerticalAlignment to "Center"

What should I do ?

the whole code is :

<UserControl [...]>
    <Canvas Width="640" Height="480" Background="#FF881607">
        <Image Source="a.jpg" HorizontalAlignment="Center"  VerticalAlignment="Center" Stretch="Uniform"/>
    </Canvas>
</UserControl>
Solution

  • If you put it in a Grid it will be centered automatically.

    <Grid>
    <Image Source="a.jpg"/>
</Grid>

    The complete control with some more Grids:

    <UserControl>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <Grid Grid.Row="0">
            <Image Source="a.jpg" Stretch="Uniform"/>
        </Grid>
        <Grid Grid.Row="1" Margin="10">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <Button Grid.Column="0" Content="Start"/>
            <Button Grid.Column="2" Content="Stop"/>
        </Grid>
    </Grid>
</UserControl>