我必须在 WPF 中放大单张图片。问题是手术后图片只显示了一部分。
我必须让它逐渐扩大。我该怎么做?
我认为您将图像拉伸属性修改为none
.
集合Height
和Width
属性:
<Image
Height="165"
HorizontalAlignment="Left"
Name="image1" Stretch="Fill"
VerticalAlignment="Top"
Width="339"
Source="[your source]" />
在[your source]
你将把你的图像的来源。
如果您的图像元素仅显示图片的一部分,您可以将 Stretch 属性更改为 Uniform(保留纵横比)或 Fill(不保留纵横比)。
您可以使用 RenderTransform 属性的 ScaleTransform 来放大图片而不影响应用程序的布局,或者使用 LayoutTransform 属性的 ScaleTransform 来放大图片,从而影响您的布局。ScaleTransform 提供了两个重要的属性 ScaleX 和 ScaleY,它们分别影响图像在其 X 和 Y 轴上的大小调整方式。要逐渐应用此效果,您必须使用 DoubleAnimation。您没有指定何时触发放大,因此出于示例的目的,我假设您希望在用户将鼠标悬停在图像上时放大图像。当用户将鼠标移出图像时,提供的代码也会逐渐减小图像大小。要更改大小的增加和减少发生的时间,请更改两个 EventTrigger 的 RoutedEvent 属性。
<Image Stretch="Uniform" Source="Penguins.jpg">
<Image.RenderTransform>
<ScaleTransform ScaleX="1" ScaleY="1" x:Name="scale" />
</Image.RenderTransform>
<Image.Triggers>
<EventTrigger RoutedEvent="MouseEnter">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="ScaleX"
Storyboard.TargetName="scale" To="1.5"
Duration="0:0:1" />
<DoubleAnimation Storyboard.TargetProperty="ScaleY"
Storyboard.TargetName="scale" To="1.5"
Duration="0:0:1" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="MouseLeave">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="ScaleX"
Storyboard.TargetName="scale" To="1"
Duration="0:0:1" />
<DoubleAnimation Storyboard.TargetProperty="ScaleY"
Storyboard.TargetName="scale" To="1"
Duration="0:0:1" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Image.Triggers>
</Image>