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

Canvas는 하위 요소의 크기를 조정하지 않으므로 여기에서 왜 사용합니까? 그냥 제거하고 그리드 (또는 최상위 그리드의 자식 인 다른 그리드)에 이미지를 넣으십시오. – Clemens

+0

이전 주석 노트 에서처럼,'Canvas' 엘리먼트는 아이들의 크기를 변경하지 않습니다. 물건을 넣는 것은 엄격히 장소입니다. WPF에는 다른 레이아웃 옵션이 많이 있지만 질문이 너무 모호하고 연구의 증거가 거의 없으므로 코드가 Canvas 요소로 표시된 이유가 명확하지 않으며 원하는 시각적 결과를 얻는 대답이 다른 방법으로 받아 들일 수 있습니다. –

+0

특히 관련성이 높은 하나의 관련 질문이 있습니다 (https://stackoverflow.com/questions/6196915/fit-image-in-canvas-using-wpf). 'Canvas'에'Image '를 넣으 려한다면 (예 : 다른 Q & A에서 볼 수 있듯이 수동으로 크기를 조절해야합니다. 그러나 당신이 그것을 피할 수 있다면 나는이 접근법을 추천하지 않는다; '이미지 '를 컨테이너로 스케일링하고 싶다면 컨테이너를 어떻게 처리 하는지를 알려주는 컨테이너를 제공하고 속성 옵션 (예 :'Grid')을 사용하는 것이 좋습니다. –

답변

1

(이 아이를 측정하지 않기 때문에) 대신 ImageStretch 속성을 사용하여 캔버스를 제거하면 동작을 얻을 수 있어야합니다 당신은 필요합니다. 그렇지 않은 경우 ViewBox으로 실험 할 수 있습니다.

+0

Viewbox가 필요하지 않습니다. '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>