2016-11-05 114 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

有一個相關的問題特別相關,https://stackoverflow.com/questions/6196915/fit-image-in-canvas-using-wpf。它包含了一些示例代碼,如果你堅持將'Image'放置在'Canvas'中,你將如何做到這一點(即你必須手動縮放,如其他Q&A所示)。但是如果你能避免這種做法,我不推薦這種方法;如果你希望'Image'和它的容器一起縮放,給它一個容器知道如何做,並且有這樣做的屬性選項(例如'Grid'),那麼更好。 –

回答

1

如果你擺脫畫布的(因爲它並不能衡量它的孩子),轉而使用ImageStretch財產,你應該能夠拿到行爲你需要。如果沒有,你可以試驗ViewBox

+0

不需要Viewbox。 'Stretch'默認設置爲'Uniform',所以你也不需要設置。只需通過網格或其他一些控制設置其子的大小來替換畫布,例如邊框。 – 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>