29

我有一个小问题,我有一个组项目,我想提供一个背景图像,它应该缩放以保持其正确的尺寸,但默认情况下它从左上角显示图像,我希望图像居中。

这是一个插图,以进一步解释我的问题。(灰色部分是被剪掉的部分)

我的问题

我有这个 XAML

<Image Source="/url/to/image.jpg" Stretch="UniformToFill"/>
4

3 回答 3

17

我设法解决了我的问题,我使图像大于放置它的容器,并将其垂直对齐在中心。

<Grid HorizontalAlignment="Left" Width="250" Height="125">
    <Image Source="/url/to/image.jpg" Stretch="UniformToFill" Height="250" Margin="0" VerticalAlignment="Center"/>
</Grid>

图像的溢出是不可见的:)

于 2012-11-24T15:45:22.987 回答
5

如果事先不知道源图像的大小,我不得不使用不同的技巧:

<Border Width="250" Height="250">
    <Border.Background>
        <ImageBrush ImageSource="/url/to/image.jpg"
                    Stretch="UniformToFill"/>
    </Border.Background>
</Border>
于 2016-05-05T13:22:01.887 回答
3

我为 Silverlight/Windows Phone 编写了一个处理类似情况的行为。我必须展示的图片可能更大或更高,我必须将它展示在一个正方形中。

该行为计算容器和图片的宽度/高度比。根据哪个是最大/最高,我调整 Image 控件的大小以使父控件具有这种剪切效果。

这是用于我的行为的示例 XAML。

<Border Height="150" Width="150">
    <Image Source="{Binding BitmapImage}" Stretch="UniformToFill"
            HorizontalAlignment="Center" VerticalAlignment="Center">
        <i:Interaction.Behaviors>
            <b:FillParentBehavior />
        </i:Interaction.Behaviors>
    </Image>
</Border>

这是 C# 代码的摘录。完整的代码可以在这里找到:FillParentBehavior.cs

double width = this.AssociatedObject.Width;
double height = this.AssociatedObject.Height;
var parentSize = new Size(this.parent.ActualWidth, this.parent.ActualHeight);
var parentRatio = parentSize.Width / parentSize.Height;

// determine optimal size
if (this.AssociatedObject is Image)
{
    var image = (Image)this.AssociatedObject;
    if (image.Source is BitmapImage)
    {
        var bitmap = (BitmapImage)image.Source;
        var imageSize = new Size(bitmap.PixelWidth, bitmap.PixelHeight);
        var imageRatio = imageSize.Width / imageSize.Height;
        if (parentRatio <= imageRatio)
        {
            // picture has a greater width than necessary
            // use its height
            width = double.NaN;
            height = parentSize.Height;
        }
        else
        {
            // picture has a greater height than necessary
            // use its width
            width = parentSize.Width;
            height = double.NaN;
        }
    }
}

this.AssociatedObject.Width = width;
this.AssociatedObject.Height = height;
于 2013-04-11T14:39:30.247 回答