Disegno di una freccia su un segmento Bezier quadratico utilizzando xaml

Qual è il modo più semplice per disegnare una freccia alla fine di un QuadraticBezierSegment? La parte più difficile è ottenere la rotazione corretta per macchiare il segmento di linea in entrata.Disegno di una freccia su un segmento Bezier quadratico utilizzando xaml

Qualche idea su come procedere? Devo estendere PathSegment?

Bezier segment with an arrow at the end

Ho questo per disegnare una semplice linea di Bézier.

<Path Stroke="Black" StrokeThickness="1"> 
    <Path.Data> 
    <PathGeometry> 
     <PathGeometry.Figures> 
     <PathFigureCollection> 
      <PathFigure StartPoint="100,430"> 
      <PathFigure.Segments> 
       <PathSegmentCollection> 
       <QuadraticBezierSegment Point1="150,250" Point2="250,300" /> 
       </PathSegmentCollection> 
      </PathFigure.Segments> 
      </PathFigure> 
     </PathFigureCollection> 
     </PathGeometry.Figures> 
    </PathGeometry> 
    </Path.Data> 
</Path>

fonte

2012-08-31 vidstige

È il 'path' del' QuadraticBezierSegment' statica? (Sembra che si tratti del tuo codice, ma hai detto che la freccia doveva essere allineata al segmento, quindi non sono sicuro) – Rachel

Sì, è statico, ma sarebbe conveniente se la rotazione fosse calcolata automaticamente. – vidstige

è possibile definire la geometria per la punta della freccia .... ma ci vorrebbe tentativi ed errori per orientare correttamente alla fine della curva di Bézier.

Invece è possibile utilizzare questo controllo e definire il tappo finale desiderato utilizzando la geometria e posizionarlo correttamente alla fine della "linea".

http://blogs.msdn.com/b/mrochon/archive/2011/01/10/custom-line-caps-in-wpf.aspx

<loc:CappedLine Stroke="Red" StrokeThickness="1" Canvas.Left="40" Canvas.Top="200" RenderTransformOrigin="0.5,0.5" Height="107" Width="195"> 
    <loc:CappedLine.EndCap> 
     <GeometryGroup> 
      <LineGeometry StartPoint="0,0" EndPoint="10,10"/> 
      <LineGeometry StartPoint="0,0" EndPoint="10,-10"/> 
     </GeometryGroup> 
    </loc:CappedLine.EndCap> 
    <loc:CappedLine.LinePath> 
     <PathGeometry Figures="M0,0 C1,1 10.5,75.5 48.5,66.5 86.5,57.5 5,3.5000146 105.5,16.500091 157.5,29.500166 164.5,87.500505 164.5,87.500505" /> 
    </loc:CappedLine.LinePath> 
</loc:CappedLine> 

<loc:CappedLine Stroke="Red" StrokeThickness="1" Canvas.Left="180" Canvas.Top="200" RenderTransformOrigin="0.5,0.5" Height="107" Width="195"> 
    <loc:CappedLine.EndCap> 
     <GeometryGroup> 
      <LineGeometry StartPoint="0,0" EndPoint="10,10"/> 
      <LineGeometry StartPoint="0,0" EndPoint="10,-10"/> 
     </GeometryGroup> 
    </loc:CappedLine.EndCap> 
    <loc:CappedLine.LinePath> 
     <PathGeometry Figures="M0,0 C1,1 10.5,75.5 48.5,66.5 86.5,57.5 5,3.5000146 105.5,16.500091" /> 
    </loc:CappedLine.LinePath> 
</loc:CappedLine>

enter image description here

fonte

2012-08-31 20:32:09

Disegno di una freccia su un segmento Bezier quadratico utilizzando xaml

risposta

Problemi correlati