日期:2014-05-18  浏览次数:20897 次

WPF如何写出可以移动的(Shape如图所示)

最近在搞图形的程序,说真的翻书有些数据都是点到为止,没有完美的范例解说,可能是我理解能力太差了…
先前一直使用Win form C# 来做做数据处理也画一些报表,突然要用WPF来写程序真的很不习惯,尤其是绘图的部分,请教有经验的前辈要如何写(我用PhotoShop画的如图所示)?
能给一段范例跟说明吗~感谢… 


------解决方案--------------------
做了一个简单的例子:

XML code
 
<Canvas xmlns:local="clr-namespace:WPFTester">
  <Canvas.Resources>
    <Style TargetType="Ellipse">
      <Setter Property="Width" Value="{x:Static local:PointsConverter.PointWidth}" />
      <Setter Property="Height" Value="{x:Static local:PointsConverter.PointWidth}" />
      <Setter Property="Cursor" Value="SizeAll" />
      <Setter Property="Fill" Value="Blue" />
      <EventSetter Event="MouseLeftButtonDown" Handler="Element_MouseLeftButtonDown" />
      <EventSetter Event="MouseMove" Handler="Element_MouseMove" />
      <EventSetter Event="MouseLeftButtonUp" Handler="Element_MouseLeftButtonUp" />
    </Style>
    <local:PointsConverter x:Key="PointsConverter" />
  </Canvas.Resources>
  <Polygon Fill="Red">
    <Polygon.Points>
      <MultiBinding Mode="TwoWay" Converter="{StaticResource PointsConverter}">
        <Binding ElementName="P1" Path="(Canvas.Left)" />
        <Binding ElementName="P1" Path="(Canvas.Top)" />
        <Binding ElementName="P2" Path="(Canvas.Left)" />
        <Binding ElementName="P2" Path="(Canvas.Top)" />
        <Binding ElementName="P3" Path="(Canvas.Left)" />
        <Binding ElementName="P3" Path="(Canvas.Top)" />
        <Binding ElementName="P4" Path="(Canvas.Left)" />
        <Binding ElementName="P4" Path="(Canvas.Top)" />
        <Binding ElementName="P5" Path="(Canvas.Left)" />
        <Binding ElementName="P5" Path="(Canvas.Top)" />
      </MultiBinding>
    </Polygon.Points>
  </Polygon>
  <Ellipse Name="P1" Canvas.Left="50" Canvas.Top="50" />
  <Ellipse Name="P2" Canvas.Left="150" Canvas.Top="150" />
  <Ellipse Name="P3" Canvas.Left="250" Canvas.Top="250" />
  <Ellipse Name="P4" Canvas.Left="50" Canvas.Top="150" />
  <Ellipse Name="P5" Canvas.Left="150" Canvas.Top="50" />
</Canvas>