图像拉伸和居中?

时间:2012-02-09 10:58:36

标签: wpf xaml stretch

我有以下XAML代码:

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

我在视觉上得到了这个:

enter image description here

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

Stretch="None",我得到了这个:

enter image description here

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

现在,我想要的是使用Stretch="Uniform"垂直或水平居中图像!只有“最小”的一面(Uniform)才会居中,右边。但目前,正如您在屏幕截图中看到的那样,即使我将HorizontalAlignmentVerticalAlignment定义为"Center"

,图片也只是放在左上角

我该怎么办?

整个代码是:

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

编辑(解决方案): 以防some1有同样的问题,这就是我解决它的方法:

<Canvas Width="640" Height="480" Background="#FFAA00FF" >
    <Image Source="z.jpg" Height="480"  Width="640"/>
</Canvas>

这与HorizontalAlignment="Center" VerticalAlignment="Center" Stretch="Uniform"的行为完全相同 图像被拉伸到Uniform(无论图像是小于还是大于画布),它都是垂直和水平居中的!

4 个答案:

答案 0 :(得分:7)

如果将它放在网格中,它将自动居中。

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

使用更多网格进行完全控制:

<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>

答案 1 :(得分:6)

Canvas不支持图像的Horizo​​ntalAlignment。如果你想要像这样的动态布局,Canvas是一个糟糕的选择(如果你想实际忽略这样的布局,它会很有用)。您使用Canvas的确切原因是什么?
只需使用网格:

<Grid Background="#FF881607">
    <Image Source="a.jpg" HorizontalAlignment="Center"  VerticalAlignment="Center" Stretch="Uniform"/>
</Grid>

答案 2 :(得分:0)

您可以将图像分配给 ImageBrush,然后将该画笔设置为您的控件或其他元素的 Background矩形例如)。

ImageBrush 具有 Fill 属性以及 StretchAlignmentX 属性。默认情况下,它们都设置为 AlignmentY

Center

Stack Overflow logo centred inside WPF window

我发现的唯一问题是图像在尺寸减小时似乎变得非常锯齿。我不确定这是为什么。

答案 3 :(得分:0)

                 <Border Width="X" Height="X" HorizontalAlignment="Center">
                    <Border.Background>
                        <ImageBrush ImageSource="{Binding X}" Stretch="UniformToFill"/>
                    </Border.Background>
                </Border>