WPFで1枚の画像を拡大する必要があります。問題は、手術後の写真が一部しか表示されないことです。
そして、徐々に拡大していく必要があります。どうすればいいですか?
画像のストレッチプロパティをに変更したと思います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の2つの重要なプロパティを提供します。これらは、それぞれX軸とY軸での画像のサイズ変更方法に影響を与えます。この効果を徐々に適用するには、DoubleAnimationを使用する必要があります。いつ拡大をトリガーするかは指定しないので、例として、ユーザーが画像の上にマウスを置いたときに画像を拡大することを想定します。提供されたコードは、ユーザーが画像からマウスを離したときにも画像サイズを徐々に小さくします。サイズの増減が発生したときに変更するには、2つの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>