2016-11-05 26 views
-1

私はWPFを初めて使い、簡単なことを試しています。私はキャンバスよりも高いイメージを持つキャンバスでカスタムコントロールを作成しています。表示するとキャンバスがオーバーフローしますので、親の高さに合わせて拡大します。おそらく簡単な答えがありますが、私はそれをまだ見つけていません。ここでWPFでのキャンバスの親の高さへの画像の拡大

はXAMLです:

<UserControl x:Class="WPFUserControl.Instance" 
      Name="InstanceBox" 
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      mc:Ignorable="d" 
      Width="448" Height="99.2"> 
    <Grid Name="InstanceGrid" Background="White" x:FieldModifier="public" Margin="0,0,0,0.2"> 
     <Canvas> 
      <Image 
       HorizontalAlignment="Left" 
       Source="pack://siteoforigin:,,,/Resources/M-Series-single.jpg" /> 
     </Canvas> 
    </Grid> 
</UserControl> 
+2

キャンバスは子要素のサイズを変更しないので、なぜここで使用しますか?それを削除し、グリッド(またはトップレベルのグリッドの子である別のグリッド)に画像を配置するだけです。 – Clemens

+0

前のコメントノートにあるように、 'Canvas'要素は子のサイズを変更しません。それは厳密に物事を置く場所です。 WPFには他にもたくさんのレイアウトオプションがありますが、あなたの質問は非常に曖昧で、研究の証拠はほとんどないので、なぜCanvas要素でコードを表示したのかは明らかではありません。別の方法でも問題ありません。 –

+0

特に関連する1つの関連する質問があります。https://stackoverflow.com/questions/6196915/fit-image-in-canvas-using-wpfこれは 'Canvas'に' Image'を置くことを主張する場合(つまり、他のQ&Aに見られるように手動でスケーリングする必要がある場合)、これを行う方法のコードをいくつか含みます。しかし、私はあなたがそれを避けることができるなら、このアプローチをお勧めしません。 'Image'をコンテナで拡大して、それを行う方法を知っているコンテナを与え、そうするためのプロパティオプション(例えば' Grid')を持たせたい場合は、それが良いでしょう。 –

答えて

1

あなたは(それがその子を測定するものではないので)キャンバスを取り除く、代わりにImageStretchプロパティを使用する場合は、あなたが行動を得ることができる必要がありますあなたは必要です。そうでない場合は、ViewBoxを試してみてください。

+0

ビューボックスは必要ありません。 'Stretch'はデフォルトで' Uniform'に設定されているので、設定する必要もありません。 CanvasをGrid、または子のサイズを設定する他のコントロールで置き換えてください。ボーダー。 – Clemens

0

1)キャンバスを使用しないでください。

2)グリッドのActualHeightプロパティにバインドできます。

<Grid Name="InstanceGrid" Background="White" x:FieldModifier="public" Margin="0,0,0,0.2"> 
    <Image Heigh="{Binding ElementName=InstanceGrid, Path=ActualHeight}" 
      HorizontalAlignment="Left" 
      Source="pack://siteoforigin:,,,/Resources/M-Series-single.jpg" /> 
</Grid> 
関連する問題