데이터 바인딩 모양과 선은 WPF

Question

에 나는 WPF의 모양과 라인을 조작 할 수 있어야하는 응용 프로그램에서 일하고 있습니다. 필자의 원래 생각은 ListBox에 컬렉션을 데이터 바인딩하고 datatemplate에서 Rectangle을 사용하여 각 채우기 속성을 이미지에 설정하는 것이 었습니다. 이것은 원과 사각형을 제외하고 대부분의 모양에서 잘 작동합니다. 이미지 크기를 조정하면 픽셀 화가 일어나고 선들의 크기가 변경되기 때문에 그 결과는 별보다 작습니다.

나는 SO 찾아 몇 시간을 보냈습니다 및 경로의 요소에 대한 몇 가지 다른 사이트는하지만, 정말 내 요구를 충족 아무것도 발견하지 않았습니다. 내 생각 엔 모양의 각 유형에 대해 경로를 다르게 생성해야하고 Path drawing and data binding과 유사한 변환기를 사용하여 데이터 바인딩을하거나 http://www.telerik.com/help/wpf/raddiagram-overview.html 또는 유사한 rad 도구를 사용해야합니다.

내 질문이 나 다른 예를 달성하는 쉬운 방법이 있나요?

편집 : 나는 또한 텍스트를 추가 할 수 있어야합니다. 경로로 어떻게 할 수 있는지 모르겠다. 어쩌면 ContentControl 일까?

Answer 1

당신은 Geometry에 Path.Data를 데이터 바인딩에 의해 모양의 모든 방법을 그릴 수 있습니다. 포인트 목록에서 Geometry을 생성 할 수 있습니다. A 컨버터는이 적응에 완벽합니다.

예를 들어, 내가보기 모델에 의해 관리 지점의 목록 떨어져 생성 StreamGeometry에 Path.Data 속성을 데이터 바인딩에 의해 나선을 그리고 내 요구에 아주 잘 작동합니다

// ViewModel ... 
public class ViewModel 
{ 
    [Notify] 
    public IList<Point> Points { get; set; } 
} 

// Converter ... 
public class GeometryConverter : IValueConverter 
{ 
    public Object Convert(Object value, Type targetType, Object parameter, CultureInfo culture) 
    { 
     if (value == null || value == DependencyProperty.UnsetValue) 
     { 
      return value; 
     } 

     var points = (IList<Point>)value;    
     var i = 0; 
     var newPath = new StreamGeometry(); 

     using (var context = newPath.Open()) 
     { 
      var begun = false; 

      for (var i = 0; i < points.Count; i++) 
      { 
       var current = points[i]; 

       if (!begun) 
       { 
        begun = true; 
        context.BeginFigure(current, true, false); 
       } 
       else 
       { 
        context.ArcTo(current, new Size(radius, radius), angle, false, SweepDirection.Counterclockwise, true, true); 
       } 
      } 
     } 

     newPath.Freeze(); 
     return newPath.GetFlattenedPathGeometry(); 
    } 
} 

XAML : TextBlock 요소를 결합하고 필요에 따라 'Canvas`에 사람을 배치 할 텍스트, 더 나은되지 않을 것에 관해서는

<Canvas> 
    <Path StrokeThickness="{Binding StrokeWidth}" 
      Canvas.Top="{Binding Top}" 
      Canvas.Left="{Binding Left}" 
      Data="{Binding Points, Converter={StaticResource GeometryConverter}}"> 
     <Path.Stroke> 
      <SolidColorBrush Color="{Binding CurrentColor}" /> 
     </Path.Stroke> 
    </Path> 
</Canvas> 

?