캔버스 - 그린 컨트롤의 크기가 다른

Question

내 XAML은 다음과 같습니다

<Grid Name="grid"> 
      <Viewbox Name="viewBox" Grid.Column="0" Grid.Row="0"> 
       <Grid> 
        <Image Name="image" /> 
        <Canvas Name="canvas" /> 
       </Grid> 
      </Viewbox> 
     </Grid> 

당신은 내가 이미지를 통해 그리기 수행하기 위해 그리드의 캔버스 및 이미지 컨트롤이 볼 수 있듯이.

내가 로딩있어 모든 이미지는 동일한 dpi로있다 - (72) 이미지가 나는 일부 데이터를 가져오고 도면 수행로드

:

var ellipse = new Ellipse 
       { 
        Width = 100, 
        Height = 100, 
        Cursor = Cursors.Hand, 
        Fill = new SolidColorBrush(Colors.Green), 
        Stroke = new SolidColorBrush(Colors.Black), 
        StrokeThickness = 1 
       }; 
      canvas.Children.Add(ellipse); 
      Canvas.SetLeft(ellipse, 10); 
      Canvas.SetTop(ellipse, 10); 

을하지만 타원 다른 다르게 보일 것으로 보인다 이미지. 크기는로드 된 이미지의 크기에 따라 다릅니다. 로드 된 이미지의 해상도가 크면 타원이 작습니다. 로드 된 이미지의 해상도가 낮 으면 타원이 너무 큽니다.

어떻게 동일한 물리적 크기를 가진 타원을 그릴 수 있습니까?

타원 컨트롤에 SnapsToDevicePixels 속성을 적용하려고했지만 나에게 적합하지 않았습니다.

Answer 1

코드의 문제점은 Image 컨트롤과 내부 그리드가 항상로드 된 이미지의 크기를 얻는다는 것입니다. 그런 다음 Viewbox는 외부 Grid (셀)에 맞게 모든 것을 조절합니다. 분명히 Canvas와 그 자식 요소를 같은 비율로 배율을 조정합니다. 따라서 서로 다른 크기의 이미지를로드 할 때 크기가 다른 타원을 관찰 할 수 있습니다.

해결책은 Viewbox를 사용하지 않는 것입니다. Stretch 속성을 None으로 설정하지 않으면 Image 컨트롤이 이미 표시된 이미지의 크기를 조절합니다. 따라서 Viewbox가 전혀 필요하지 않습니다. Width 또는 Height 중 하나 또는 둘 다를 설정하여 Image 컨트롤에 적절한 크기를 지정해야합니다.

<Grid> 
    <Image Name="image" Width="120" /> 
    <Canvas Name="canvas" /> 
</Grid>