将图片拉伸以填满可用宽度/高度（分别）

Question

有没有办法在XAML中填充可用宽度/高度的图像？ 我需要类似UniformToFill的东西，但可以控制拉伸方向（宽度或高度）。

假设我有以下代码：

<UniformGrid Columns="2" Rows="2">        
    <Image Source="Desert1.jpg" Stretch="Uniform"/> //
    <Image Source="Desert2.jpg" Stretch="UniformToFill"/> // 
    <Image Source="Desert3.jpg" />
    <Image Source="Desert4.jpg" />
</UniformGrid>

编辑： 例如（宽度）：如果图像的宽度只有我想要显示的一半，我不在意高度，只需将图像的高度和宽度缩放两倍即可。因此，图像必须适合宽度，并且不在意高度。这是期望的行为，但如果不可能-那也可以。因此，您可以重新考虑问题：如果可能的话，如何在xaml中实现。

另外，所有图像的宽度和高度可能不同。

- Eugene

---

你需要动态控制它吗？ - King King

@KingKing 是的，我需要类似界面上的复选框来对其进行控制。 - Eugene

据我理解，@ZombieSheep可能想要添加一些“属性”，以确定图像是应该在“宽度”还是“高度”上进行拉伸（当然，另一个非拉伸的方向会被统一处理，以保证图像的“宽度/高度”与原始图像相同）。 - King King

@ZombieSheep 如果我的图像只有我想要显示的一半宽度，我不关心高度，只需将图像高度和宽度扩大2倍即可。因此，图像必须适合宽度，而不关心高度。这是期望的行为，但如果不可能-好的。因此，您可以重新考虑问题，即如果可能的话，我如何在xaml中实现它。 - Eugene

@Dave，纯XAML好像不可能实现。您需要编写具有该逻辑的自定义控件。但是需求价值较低，所以我放弃了这个任务。 - Eugene

Answer 1

我认为在某些条件下，您可能会获得所需的效果。如果您的图像都比将要显示的尺寸大，您可以尝试使用以下方法:

<Image Source="Desert.jpg" Stretch="UniformToFill" StretchDirection="DownOnly" />

ViewBox与Image具有相同的Stretch属性，MSDN网站上的如何将拉伸属性应用于Viewbox内容文章中有不同组合之间差异的很好的示例。

- Sheridan

---

我看过这些属性，但它们能够正常工作的情况太特殊了。此外，UniformToFill 覆盖的情况比期望的高度或宽度更多。不幸的是，UniformToFill 不允许设置所需的属性。 - Eugene

如果你真的花时间将链接页面上MSDN的示例代码放入新的测试WPF项目中，并按照我列出的设置运行它，那么你会发现这确实可以给你想要的结果。唯一的条件是原始图像大小必须大于显示的大小。尽管如此，如果无法满足该条件，则我接受这将对你没有帮助。 - Sheridan

好的，我放了这段代码，但还是不理解。它看起来绝对像是在处理宽高都比较大的图片时使用UniformToFill，但对于小图根本不起作用。而且似乎我无法控制哪个属性必须用于缩放。 - Eugene

我确实说过，只有当您的图像比您要显示的尺寸大时才能正常工作。如果您选择“DownOnly”，然后在“Uniform”和“UniformToFill”设置之间交替，您会发现它通过减小高度并显示完整宽度来按您所需工作。如果您想缩放图像（例如使用比要显示的尺寸小的图像），那就算了，祝您好运。 - Sheridan

我在 MSDN 的示例中仔细测试了它的整体效果（包括旋转版本）。Uniform 减小宽度和高度。对于 UniformToFill，它会减小宽度或高度中较小的那个。而且，似乎我不能控制使用哪个属性进行缩放。 - Eugene

Answer 2

这可能是你正在寻找的内容...

TransformedBitmap（转换位图）

这是我在一个ImageUtility类中编写的静态方法。

public static TransformedBitmap GetScaledBitmapImageSprite(BitmapSource src, double x_scale, double y_scale)
{
  return (new TransformedBitmap(src, new ScaleTransform(x_scale, y_scale)));
{

x_scale和y_scale是以以下形式的双倍数表示：

desired_width / original_width

可能与您想要的略有不同，但我认为它可以让您朝着正确的方向开始。

您可以将TransformedBitmap存储在内存中，并通过以下方式应用新的转换：

TransformedBitmap x = new TransformedBitmap();
x.Transform = new ScaleTransform(x,y);

- mwjohnson

---

我正在寻找一种基于XAML的解决方案，因为它可以避免我在代码中获取父容器高度、图片高度并计算比例率的麻烦。 - Eugene

Answer 3

你应该使用 <\p>。

<Image Source="{Binding Image}" Stretch="Fill"/>

如果您使用Stretch="UniformToFill"，则它将以比例或者说同时更改长度和宽度。

因此，如果您使用Stretch="Fill"，它会给您一个机会单独更改高度或宽度。

- DeshDeep Singh